Working with numbers in Velocity templates
By default, Velocity templates treat all entity attributes as string values. You might want to treat an entity attribute as a numeric value in order to perform a math operation or compare it to another numerical value. To treat an entity attribute as a numeric value, follow these steps:
- Declare a dummy variable and initialize it to an arbitrary integer or double value.
- Ensure that the entity attribute you want to use is not blank (required for Target Recommendations’ template parser to validate and save the template).
- Pass the entity attribute into the
parseInt
orparseDouble
method on the dummy variable you created in step 1 to turn the string into an integer or double value. - Perform the math operation or comparison on the new numeric value.
Example: Calculating a discount price
Suppose you want to reduce the displayed price of an item by $0.99 to apply a discount. You could use the following approach to achieve this result:
#set( $double = 0.1 )
#if( $entity1.get('priceBeforeDiscount') != '' )
#set( $discountedPrice = $double.parseDouble($entity1.get('priceBeforeDiscount')) - 0.99 )
Item price: $$discountedPrice
#else
Item price unavailable
#end
Example: Choosing the number of stars to display based on an item’s rating
Suppose you want to display an appropriate number of stars based on an item’s numerical average customer rating. You could use the following approach to achieve this result:
#set( $double = 0.1 )
#if( $entity1.get('rating') != '' )
#set( $rating = $double.parseDouble($entity1.get('rating')) )
#if( $rating >= 4.5 )
<img src="5_stars.jpg">
#elseif( $rating >= 3.5 )
<img src="4_stars.jpg">
#elseif( $rating >= 2.5 )
<img src="3_stars.jpg">
#elseif( $rating >= 1.5 )
<img src="2_stars.jpg">
#else
<img src="1_star.jpg">
#end
#else
<img src="no_rating_default.jpg">
#end
Example: Calculating the time in hours and minutes based on an item’s length in minutes
Suppose you store the length of a movie in minutes, but want to display the length in hours and minutes. You could use the following approach to achieve this result:
#if( $entity1.get('length_minutes') )
#set( $Integer = 1 )
#set( $nbr = $Integer.parseInt($entity1.get('length_minutes')) )
#set( $hrs = $nbr / 60)
#set( $mins = $nbr % 60)
#end
Displaying a key item with recommended products
You can modify your design to show your key item alongside other recommended products. For example, you might want to show the current item for reference next to the recommendations.
To do this, create a column in your design that uses the $key
attribute you are basing your recommendation on rather than the $entity
attribute. For example, the code for your key column might look like this:
<div class="at-table-column">
<a href="$key.pageURL">
<img src=$key.thumbnailUrl" class="at-thumbnail"/>
<br/><h3>$key.name</h3>
<br/><p class="at-light">$key.message</p>
<br/><p class="at-light">$key.value</p>
</a>
</div>
The result is a design like the following, where one column shows the key item.
When you are creating your Recommendations activity, if the key item is taken from the visitor’s profile, such as “last purchased item,” Target displays a random product in the Visual Experience Composer (VEC). This is because a profile is not available while you design the activity. When visitors view the page, they will see the expected key item.
Performing replacements in a string value
You can modify your design to replace values within a string. For example, replacing the decimal point delimiter used in the United States with the comma delimiter used in Europe and other countries.
The following code shows a single line in a conditional sale pricing example:
<span class="price">$entity1.value.replace(".", ",") €</span><br>
The following code is a complete conditional example of a sale price:
<div class="price">
#if($entity1.hasSalesprice==true)
<span class="old">Statt <s>$entity1.salesprice.replace(".", ",") €</s></span><br>
<span style="font-size: 10px; float: left;">jetzt nur</span> $entity1.value.replace(".", ",") €<br> #else
<span class="price">$entity1.value.replace(".", ",") €</span><br> #end
<span style="font-weight:normal; font-size:10px;">
$entity1.vatclassDisplay
<br/>
$entity1.delivery
<br>
</span>
Customizing the template size and checking for blank values
Using a Velocity script to control for dynamic sizing of the entity display, the following template accommodates a 1-to-many result to avoid creating empty HTML elements when there aren’t enough matching entities returned from Recommendations. This script is best for scenarios when back-up recommendations wouldn’t make sense and Partial Template Rendering is enabled.
The following HTML snippet replaces the existing HTML portion in the 4x2 default design (the CSS is not included here, for the sake of brevity):
- If a fifth entity exists, the script inserts a closing div and opens a new row with
<div class="at-table-row">
. - With 4x2, the maximum results shown will be eight, but this could be customized for smaller or larger lists by modifying
$count <=8
. - Be aware that the logic won’t balance the entities on multiple rows. For example, if there are five or six entities to display, it won’t dynamically become three on top and two on the bottom (or three on top and three on the bottom). The top row will display four items before starting a second row.
<div class="at-table">
<div class="at-table-row">
#set($count=1)
#foreach($e in $entities)
#if($e.id != "" && $count < $entities.size() && $count <=8)
#if($count==5)
</div>
<div class="at-table-row">
#end
<div class="at-table-column">
<a href="$e.pageUrl"><img src="$e.thumbnailUrl" class="at-thumbnail" />
<br/>
<h3>$e.name</h3>
<br/>
<p class="at-light">$e.message</p>
<br/>
<p class="at-light">$$e.value</p>
</a>
</div>
#set($count = $count + 1)
#end
#end
</div>
</div>
Adobe Target Maturity Webinar Series
Adobe Customer Success Webinars
Tuesday, Feb 4, 4:00 PM UTC
Adobe Target innovations, including GenAI, and best practices on AI-powered personalization and experimentation at scale.
Register