Tuesday, December 30, 2014

SmartTarget tags: from template to page

I recently shared some SmartTarget Gists which show step by step how a SmartTarget region grows from a simple region tag in a Dreamweaver template layout TBB to the fully expanded SmartTarget controls or tags on an aspx or jsp page.

What follows is a number of code snippets from my Gist account. I shared some of this in a Tridion.Stackexchange answer.

Those code snippets all show one SmartTarget region which queries for SmartTarget promotions, the Experience Manager  markup and three fallback component presentations.

Step 1: Template

The Dreamweaver template TBB contains a region tag. 

source: https://gist.github.com/6053b09d0ccbd31e058b

The SmartTarget TBBs "Add SmartTarget Query", "Add Promotions" and "Apply SmartTarget Settings" (see manual) specify the region name and other settings and transform the region markup into TCDL tags. These are all default SmartTarget TBBs.

Step 2: TCDL

The TCDL tags form the instructions for the SmartTarget region in a platform neutral way. The Content Delivery deployer application transforms the TCDL tags into .NET Controls or JSP tags. For a REL target the deployer keeps the TCDL tags in the page content and DCP content and the TCDL tags are executed on runtime in the web application.

source: https://gist.github.com/3b5c48c3a5ea5d5e12b8

Step 3: controls and tags

The .NET controls, or JSP tags, or TCDL tags for a REL get the promotional content.
  1. The Query control/tag constructs a SmartTarget query
  2. The Promotions control/tag specifies what promotion region to query for, and how many results should be shown.
  3. The ComponentPresentation control/tag gets the component presentation. Note that this is not a SmartTarget control/tag and uses variables for ComponentURI and TemplateURI from the SmartTarget query result and uses the core Tridion CD functionality to get the component presentation.
  4. If the SmartTarget query does not return any promotions the contents of the FallbackContent tag are shown.
.NET source: https://gist.github.com/70d569023e78081c3b57

JSP source: https://gist.github.com/83e45c851b63481e39bb

Step 4: HTML with XPM markup

The web application renders the HTML which is parsed by the browser. This example includes the Experience Manager markup which would only be visible on a staging target. Note the Experience Manager markup is added to annotate the SmartTarget region.


source: https://gist.github.com/ea7312358ce22a61bbea

Tag demo

This tag demo in ASP.NET or JSP might come in handy to understand what each while troubleshooting SmartTarget promotions on your website.


No comments:

Post a Comment