Markup Tag Syntax

Markup tags are enclosed in double, curly braces, and can be generated by the Widget tool, or
typed directly into HTML content. For example, rather than hard-coding the full path to a
page, you can use a markup tag to represent the store URL. The markup tags featured in the
following examples include:

  • Store URL
  • Media URL
  • Block ID
  • Template Tag
  • Non-Inline CSS Tag
  • Widget Code

Store URL

The Store URL markup tag represents the base URL of your website, and is used as a substitute
for the first part of a full URL, including the domain name. There are two versions of this
markup tag: One that goes directly to your store, and the other with a forward slash at the end
that is used when a path is added.
{{store url=’apparel/shoes/womens’}}

Media URL

The dynamic media URL markup tag represents the location and file name of an image that is
stored on a content delivery network (CDN). The tag can be used to place an image on a page,
block, banner, or email template.
{{media url=’shoe-sale.jpg’}}

Block ID

The Block ID markup tag is one of the easiest to use, and can be used to place a block directly
on a CMS page, or even nested inside another block. You can use this technique to modify a
block for different promotions or languages. The Block ID markup tag references a block by its
{{block id=’block-id’}}

Template Tag

A template tag references a PHTML template file, and can be used to display the block on a
CMS page or static block. The code in the following example can be added to a page or block to
display the Contact Us form.
{{block type=”core/template” name=”contactForm”
“Contact Us” Template Tag
The code in the next example can be added to a page or block to display the a list of products
in a specific category, by category ID.
“Category Product List” Template Tag
{{block type=”catalog/product_list” category_id=”22″

Non-Inline CSS Tag

Because many email clients do not support CSS, this markup tag provides a way to convert the
CSS styles that are used in email and newsletter templates to inline styles. The tag references
the non_inline_styles variable to point to a CSS file on the server for the styles to be converted.
The styles that are non-inline are copied to the tag of each message or newsletter that
is sent. This tag can be used only with templates for transactional email and newsletters. To
learn more, see the developer documentation.
{{var non_inline_styles.css}}

Widget Code

The Widget tool can be used to display lists of products, or to insert complex links, such as one
that goes to a specific product page, based on product ID. The code that is generated includes
the block reference, location of the code module, and corresponding PHTML template. After the
code is generated, you can copy and paste it from one place to another.
The code in the following example can be added to a page or block to display the list of new
{{widget type=”catalog/product_widget_new”
display_type=”new_products” products_count=”10″
“New Products Grid” Code
The code in the next example can be added to a page or block to display a link to a specific
product, by product ID.
{{widget type=”catalog/product_widget_link” anchor_text=”My Product
title=”My Product Link”template=”catalog/product/widget/link/link_
block.phtml” id_path=”product/31″}}
“Link to Product” Code

Leave a Comment

Your email address will not be published. Required fields are marked *