Create a new template

To create a new collection, select the section “Templates” from the ASA 2 main menu:

ASA 2 Templates menu

On the templates main page click the button “Create new template”. The template editing page will be loaded.

ASA 2 create template

Template name

ASA 2 template name

A template must have a name. Only alphanumeric characters and underscore are allowed for the template name.

Note

Templates can be referenced by ID or name in shortcodes. See mobile_tpl

Snippet

ASA 2 template snippet option

With ASA 2 you can include one template in another. For more details see: Include other tempates. This makes it possible to prevent template code duplication. For example, you can create the template code for a lightbox image gallery, store it in one template and use this in every other template where you want to have this kind of gallery.

Such pieces of reusable code are called “snippets”. You should check this option, if the template is a snippet. This will keep the temlpate handling cleaner because snippets do not appear in template selection menus like in the product picker.

Template snippets will be labeled in the template overview list:

ASA 2 template snippet option

Item HTML

ASA 2 template item html

The “Item HTML” text box is where you put the HTML code for rendering your Amazon products. To place product information use Placeholders.

Also check out ASA 2 extensive Template Syntax. For example you can use Conditions, Loops and placeholder filters (see Default Filters) to completely customize the output of your templates.

Surrounding container

ASA 2 template sourrounding container

The sourrounding container is optional. It can be used for Collections and smart collections (see [asa2_smart_collection]) to place HTML code around the list of items.

For more details check Surrounding container.

CSS

ASA 2 template css

For each template you can define custom CSS. This will only be loaded once even if the template is used multiple times on a page.

Comment

Optionally you can enter a comment for a template. This is useful for additional notes about the template. For example if you want to share your tempalte, you can write about the intention of the template or how to use it. Comments support some HTML tags. See the form field description.

ASA 2 template comment

Tempalte comments will be shown when you hover over the template name in the list of templates.

ASA 2 template comment

Save

After you filled the template form fields, click the “Save template” button to save the template.

ASA 2 template save button

It will now be listed in the templates list:

Template list

Learn how to Using a template to render a product.