Create a Template File

This topic applies to

Applies to

Kilimanjaro

The template is necessary to render the data defined by the view.

To create a template:

  1. In your CCT module’s Templates directory, create a new .tpl file.

  2. Name this file to intuitively relate to your module as a template.

    For example:

    ../SC.CCT.ImageViewer@0.0.1/Templates/sc_cct_imageviewer.tpl

  3. Create the HTML required to render the data defined by the view.

    For the example ImageViewer CCT, your template might look similar to the following:

    <div class="sc-cct-imageviewer"> <div class="sc-cct-imageviewer-slider-container"> <div class="sc-cct-imageviewer-image-slider"> <ul data-sc-cct-imageviewer class="sc-cct-imageviewer-image-slider-list"> <li> <div class="sc-cct-imageviewer-slide-main-container"> {{#if hasImage}} <img src="{{resizeImage imageUrl 'main'}}" alt="{{imageAlt}}"/> {{/if}} {{#if hasText}} <div class="sc-cct-imageviewer-slide-caption sc-cct-imageviewer-slide-caption-{{valign}}"> {{#each texts}} <h2 class="sc-cct-imageviewer-slide-caption-title">{{this}}</h2> {{/each}} </div> {{/if}} </div> </li> </ul> </div> </div> </div>
  4. Save the template.