Advanced Formatting Options for Description Templates

Advanced Formatting Options for Description Templates:

Advanced formatting can be utilized while working in code view mode; to switch to code view, click on the </> button located on the formatting toolbar. Clicking on this button will toggle your screen between code view and normal view.

 

Code view mode will allow you to use all predefined HTML tags and handleBars Expressions.

Field Selector

mceclip0.png

Field selector can be used to select and insert any predefined Dynamic fields from your inventory database. Click on the “Field Selector” textbox to use the Autofill feature, and the system will provide a long list of predefined fields identified in the database that can be matched with the intended Target field. Click on “Insert” to insert the field into the text box. Make a note that inserted fields will be in double curly brackets:

 

Example usage of {{Product.Name}} field. If there were HTML tags in the “Product.Name” text body, you have to use 3 curly Brackets before and after the field name to display the data in the field correctly. This is a function of handleBars language that the system is utilizing.

E.g.: the field Product.Name reads as: This product is good for especially <b> children</b> and their….

 

'<b>' and '</b>' are HTML tags and if the field was called form the template as: {{Product.Name}} …(with 2 curly brackets), this field will be displayed with the HTML tags, such as:

"This product is especially good for <b> children</b> and their…"

 

To display this field without HTML tags and with proper HTML Formatting, use 3 curly Brackets. Call the field as {{{Product.Name}}} from the template:

"This product is especially good for Children and their…"

 

Data Arrays

Tags and images are considered as data arrays in StoreAutomator. Data arrays are defined with the Point operator "." and starts with number 1, example:

{{Product.ImageUrls.1}}

{{Products.Tags.bulletpoints.1}}

{{Products.Tags.searchterms.1}}

{{Products.Tags.usedfor.1}}

{{Products.Tags.otherattributes.1}}

{{Products.Tags.targetaudience.1}}

you can use numbers 0 through 9 for each array type attribute, where 0 is the first value and 9 is the last value. Please make sure to use data arrays in this format.

 

Custom Field Usage

You can call custom fields in Description templates with the below expression:

 

{{Product.CF.customfield-1}}

 

where customfield-1 is the name of the custom field.

 

Also, you can define a custom field as a data array, when you choose its field type as "Tags", during custom field creation (Located at Inventory>Custom Fields, edit a custom field):

mceclip1.png

In this case usage is:

Product.CF.labels[0]

This will access the value stored as the first data container.

 

#if expression

If is the most common conditional statement. Usage:

{{#if condition}}

Do this...

{{else}}

Do That...

{{/if}}

 

- e.g., You want to assign and print a shipping price to product descriptions with a rule. The rule is if the product has free shipping, then print “free shipping for this item.” If not, print the product shipping fee in the descriptions. The following code does the described work:

{{#if Product.IsFreeShipping}}

          Free Shipping for this item.

{{else}}

        {{#if Product.ShipPrice}}

        Just ${{Product.ShipPrice}} for shipping.

{{else}}

        {{/if}}

{{/if}}

 

- You can also write a function in the condition section and run the "if" statement according to the result of that function. In this case the function that defines the case must go into parenthesis " ( ) ", below code is an example of how to use it:

{{#if ( LookupValue "BulletPoints" Product.Tags.bulletpoint[1] ) }}

Do this...

{{else}}

Do that...

{{/if}}

 

#each expression

Each is a conditional loop that can help displaying array type data such as images, and tags data, bullet points, etc... For the complete list of array type data fields please refer to the Data Arrays section above. General usage is:

{{#each condition}}

"do this work for all array items..."   

{{/each}}

 

- The code below renders multiple product images one after the other in the product description.

{{each Product.ImageUrls}}

{{/each}}

 

Note: There are no curly brackets at the front and back of "Product.Image"; they are on the outside, and encompass the whole expression.

- Below code print all bullet points one by one:

{{#each Product.Tags.BulletPoints}}

  • {{this}}

{{/each}}

You can use this code snippet to display contents of all tags, Bullet Points, Other Attributes, Search Terms, Target Audience and Used For.

 

You can use "#each" in combination with "#contains" to search for a text in a dynamic field and display the contents of the field.

- Following code searches "size_chart_img" in picture labels and when found returns the image urls of that label:

{{#each Product.Images}}

{{#Contains this.LabelList "size_chart_img"}}

<p><img src="{{this.Url}}" style="width: 900px;"><br></p>

{{/Contains}}

{{/each}}

 

#Contains Statement

#Containsserves as a conditional search algorithm in the given text block, searches the value in double quotation marks, and if the result is TRUE, it performs the actions delineated in the block.

While referring to the example above, #Containsfunction searches the word "size_chart_image" in the text block of LabelList, a dynamic field that is coming from the prior #eachfunction from Product.Images, and if the result is true it renders the block after itself, which is displaying the image which contains the given keyword.

Because #Contains is a statement that needs to be closed when it is opened.

 

LookupValue function

Lookup function performs a value lookup in the Replacements list, that is the first parameter written in the double quotation marks ( " " ) and searches the value given in the second parameter.

Usage Example:

{{LookupValue "BulletPoints" Product.Tags.bulletpoint[0] }}

This expression searches the value present in bulletpoints[0] field, in the replacements list "BulletPoints" and returns the value as the replacement. Let's give an example, if the value in bulletpoints[0]= eyeglasses-1, this value will be searched for in the "BulletPoints" replacement list. Let's say the contents of the replacement list is as follows:

mceclip2.png

In this example,  the LookupValue function will return "Reading glasses" as the result. If the keyword cannot be found, then the function returns a FALSE, that can be used in an #if, #each statements.

LookupValue also can be used as a stand alone statement that can render a block if the result returned is True, e.g.:

{{#LookupValue "BulletPoints" “Product.Tags.bulletpoint[0]” }} 

Do this if the result is TRUE 

{{else}}

Do this if the result is FALSE

{{/LookupValue}}

 In this case lookupValue receives a hashtag (#) in the front and there is an “else” statement also available, in case the return returned as FALSE.

LookupValue function requires usage of Replacement Lists, for more information regarding setting up and using replacement lists please click here.

 

ToUpperCase function

This function converts all characters to uppercase.  Usage:

{{ToUpperCase Product.CF.description1}}

 

To LowerCase function

This function converts all characters to lowercase. Usage

{{ToLowerCase Product.CF.size-value-list}}

 

Calling Sub-Templates

You can create new templates for specific work. For instance, you created a separate template for calculating shipping price. You can call this template as a sub-template to the main template, with the help of ">" sign in the front of the template name.

 

Usage: {{>sample-desc-sub-temp-shipping}}

 

Make sure to create the sub-template with the correct name before calling the main template. Failure to do so will result in error messages pointing out the missing sub-template.

 

HTML Escaping

If you would like to embed HTML tags and format the text output you can use three sets of braces ( {{{ }}} ). Usage:

{{{<p><b>This is a paragraph</b></p>}}}

Result: This is a Paragraph

Triple braces allow HTML tagging not to display on Description Template preview and on the remote channel.

 

>> Assign Description Templates to Channels

OR

>>Assign Title Templates to Channels

Was this article helpful?

0 out of 0 found this helpful