You are here:
Creating a Zone in the Template Designer (Managed Package)
For the managed package runtime, organize cards into sections by creating zones in the Template Designer.
This information is for Omnistudio for Managed Packages. For Omnistudio on standard runtime, see Omnistudio Help.
-
In your org, click App Launcher, click Vlocity Templates, and click a version of a
template to open the Template Designer.
Clone a template that has zones, such as
card-canvas-3x-zones-slds. Then update, remove, or add zones as needed. - Click the Edit tab.
-
In the Zones section, click Add
Zone.
- Enter a unique zone Name and descriptive zone Label, such as footer and Footer, respectively.
- Click Save.
- Click the HTML tab.
-
To reference the zone by Zone Name in the HTML add
data.zones['Zone Name'].cards to an
ng-repeatdirective, such as incard-canvas-3x-zones-slds:<!-- Name of zone here is "Body" --> <div ng-repeat="card in data.zones['Body'].cards |orderBy:order|filter: searchFunc(card, searchTerm.value)" vloc-card ctrl="{{ctrl}}" ng-model="card" data="card" records="records" index="{{$index}}" session-id="{{sessionId}}" class="slds-p-around--small slds-size--1-of-1 slds-medium-size--3-of-6 slds-large-size--4-of-12" use-existing-element-type> </div> - Click Save.
Did this article solve your issue?
Let us know so we can improve!
