Surrounding container

For Collections and smart collections (see Shortcodes Asa2 Smart Collection) it can be very useful to place HTML code around the list of items. For example if you want to display the list of items in a box or even more important, if you want to design a modern CSS list layout. For this purpose ASA2 has the option to define a "surrounding container" for each template. This container HTML will only get used for collections and smart collections.

item_list

If you want to use a surrounding container, you have to set the placeholder {{ item_list }} in it. This will be replaced with the rendered item list.

INFO

A surrounding container must contain the placeholder {{ item_list }} to be functional.

Example

Single item HTML:

<div class="pin">
	<a href="{{ AmazonURL }}" target="_blank"><img src="{{ LargeImageURL }}" /></a>
	<p><a href="{{ AmazonURL }}" target="_blank">{{ Title }}</a></p>
</div>

Surrounding container HTML:

<div id="wrapper">
	<div id="columns">
		{{ item_list }}
	</div>
</div>

Using the surrounding container with item lists, you are able to create dynamic item lists like the one in the following screenshot: