Content Slots

 

Content Slots

 

A content slot is an area on the page where a merchant defines content to display based on certain qualifiers or rules.

 

Slots can easily be found on a page by using the Storefront

 

Toolkit > Content Information tool. Hover the mouse around the page to reveal(显示) where content slots are used, and to get a link to the slot’s configuration page in BM.

 

 

 

Content slots(内容槽) vs. Content Assets (内容资源)

 

Slots are different from content assets in several aspects:

 

• Slots  are considered part of marketing. They are located under:

 

Site > Online Marketing > Content Slots.

 

Content Assets appear under: Content section.

 

• Slots are controlled by campaigns (活动): start/end dates, customer groups, source codes, coupons and rank are qualifiers that affect the appearance of a slot. Content Assets do not have such qualifiers.

   

  Creating Content Slots

  Creating a content slot requires a collaborative (合作) effort:

 

1. The developer inserts a <isslot> tag in a template in the location   where the slot will appear.

2. The developer creates a rendering template for the slot that defines how the slot data is to be presented.

3. The merchant creates a configuration for the slot in Business Manager.

    

   Slots can be of two kinds:

 

• Global slots: can appear on any page.

• Category slots: appear on category-specific pages since they depend on the category id.

   

  A content slot will display content of one of the following types:

 

• One or many products selected by the merchant

• Category attributes (images or other visual)

• Content assets from the content library

• Static HTML and images from the static library

   

  Creating Content Slots - Developer Tasks

  Creating a Content Slot

  The developer creates a content slot inside a template using the <isslot> tag. The tag must be located exactly where it should appear on the page. Here are some examples of tag usage:

 

• Global slot:

  <isslot id=”header_banner”  description=”…”  context=”global”/>

• Category slot:

  <isslot  id=”category_top_featured”  context=”category”

  description=”…” context-object=”${pdict.ProductSearchResult.category}” />

   

  Whenever the template is saved, the new content slot will automatically appear in the list of slots under Site > Online Marketing > Content Slots. The platform achieves this by automatically scanning any template for the use of the <isslot> tag.

   

  Creating the Slot Rendering Template

  As stated in the previous section, the slot will display one type of content out of four possible types. The developer creates a rendering template that takes into account the type of content (重点考虑内容类型), how many objects to display, plus any CSS styling required for the slot.

  The header_banner slot uses the htmlslotcontainer template below as the rendering template:

  <iscache type="relative" hour="24"/>

  <div class="htmlslotcontainer">

  <isif condition="${slotcontent != null}">

      <isloop items="${slotcontent.content}" var="markupText">

         <isprint value="${markupText.markup}" encoding="off"/>

     </isloop>

  </isif>

  </div>

  Using slotcontent and <isprint> in Rendering Templates

  Every slot is rendered by a system pipeline inside the core cartridge:

  _SYSTEM_Slot-Render. You do not have access to this pipeline. It uses the slot configuration that the merchant creates and provides all theconfiguration information to the rendering template by means of the TopLevel.global.slotcontent constant (常量). Only slot rendering templates getdata via this constant.

   

  The rendering template code checks that the slotcontent is not empty:

  <isif condition="${slotcontent != null}">

   

  Then it loops through the slotcontent.content (the content provided for the slot):

  <isloop items="${slotcontent.content}" var="markupText">

  <isprint value="${markupText.markup}" encoding="off"/>

  </isloop>

   

  Inside the loop the code uses the <isprint>tag:

  <isprint value="${markupText.markup}" encoding="off"/>

  Using the encoding="off" setting allows the HTML snippet to be generated without encoding, so that the browser renders it correctly.

   

  Creating Content Slots - Merchant Tasks

  Creating a Content Slot Configuration

  The merchant creates a content slot configuration by navigating to

  Site > Online Marketing > Content Slots, then finding the specific slot the developer created.

  The merchant selects an existing configuration or clicks New to create a new one.

   

  Here the merchant enters an ID, enables the slot and provides other relevant information. The slot content that follows is the most important piece for the programmer since it defines what data becomes available for the rendering template.

   

  The merchant gave the banner an ID and enabled the slot. The content type HTML was selected, which opens the HTML text area.

   

  Then the ellipsis (省略号) on the Template area was clicked: this opens the Templates dialog shown above, and all the possible rendering templates for this type discovered in all cartridges in the cartridge path. The SiteGenesis storefront cartridge comes with some default templates for every type of content. Furthermore, the templates are located in especially named folders that Business Manager discovers by default: slots/html for the HTML type in the example above. The merchant may choose to reuse an existing rendering template, or use a new one as instructed by the programmer. Without a rendering template there is no way to visualize the slot.

   

  If the merchant selects the Product content type, selects some product IDs, and then has to choose from all the available product-specific rendering templates. Notice that any slots/product templates available in any cartridge in the path become visible.

   

  Finally, the merchant needs to provide a schedule for the slot. This is either the default schedule or based on a marketing campaign

   

  Using Content Link Functions

  Demandware uses attributes of type HTML in many places: content assets, content slots with HTML-type content, product descriptions, etc. You can also add anattribute of type HTML to any system object where you may need to show HTML.These attributes are represented by the class dw.content.MarkupText which wasdiscussed previously.

   

  When using HTML in assets or slots it might be tempting to hardcode hyperlinks to pages or images in the storefront: this is a bad idea since those links are instance-specific (i.e. Staging) and would have to be changed every time after a replication.

   

  To solve this problem, Demandware offers special Content Link Functions that are used only in attributes of type HTML. The content link functions are:

 

• $staticlink$ - Creates a static link to an image

• $url()$ - Creates an absolute (绝对链接) URL that retains the protocol of the outer request. (不包含协议)

• $httpUrl()$ - Creates an absolute URL, but with the http protocol.

• $httpsUrl()$ - Creates an absolute URL, but with the https protocol.

• $include()$ - Can be used to make a remote include call (relevant for caching purposes)

   

  Here is an example of a function used to create a hyperlink to the Page-Show pipeline passing cid=2-day-shipping-popup in the query string:

  href="$url('Page-Show', 'cid', '2-day-shipping-popup')$"