Columns layout

On this page, ASA’s managed template “Columns_layout” is used. It is specialized for displaying multiple products in colums. It works perfectly with ASA 2 collections or smart collections. It is customizable in general and per shortcode.

Main features

  • Specialized for rendering multiple products in columns
  • Responsive design
  • Adjustable columns count per screen width
  • Customizable without programming skills

Example

This first example is built with the following shortcode:

If I Can Dream
$9.37

Customization

On ASA 2’s admin page “Templates” you can customize the general options of template “Columns_layout“. These settings will effect every usage of this template.

Columns_layout customization

 

Shortcode options

Besides the general settings, it is possible to overwrite template options per shortcode.

For example, to show 6 columns on large devices instead the generally configured amount, this shortcode would make the difference:

Or to render 2 columns on extra small devices instead of the generally configured amount, use option “cols_sm”:

Following you find a list of all available shortcode options for template “Columns_layout”:

Option Type Values Description
item_tpl string custom text Name of the template to use for rendering the single items.
cols_xs int 1 between 99 Number of columns on extra small devices (Phones, <768px)
cols_sm int 1 between 99 Number of columns on small devices (Tablets, ≥768px)
cols_md int 1 between 99 Number of columns on medium devices (Desktops, ≥992px)
cols_lg int 1 between 99 Number of columns on large devices (Desktops, ≥1200px)
gap_xs int 0 between 999 Columns gap in pixels on extra small devices (Phones, <768px)
gap_sm int 0 between 999 Columns gap in pixels on small devices (Tablets, ≥768px)
gap_md int 0 between 999 Columns gap in pixels on medium devices (Desktops, ≥992px)
gap_lg int 0 between 999 Columns gap in pixels on large devices (Desktops, ≥1200px)

More examples

Samsung Galaxy Grand Prime Dual Sim Factory Unlocked Phone, International Version Retail Packaging, Gold
Price: $177.99
(As of: 2017/06/26 12:20 pm - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on http://www.amazon.com/ at the time of purchase will apply to the purchase of this product.
)
3 new from $169.996 used from $119.90
(* = affiliate link / image source: Amazon partner program)
LEGO Star Wars 75055: Imperial Star Destroyer
Price: $327.85
(As of: 2017/06/26 12:20 pm - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on http://www.amazon.com/ at the time of purchase will apply to the purchase of this product.
)
33 new from $309.890 used
(* = affiliate link / image source: Amazon partner program)
Baby Einstein Take Along Tunes Musical Toy
Price: $7.74
(As of: 2017/06/26 12:19 pm - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on http://www.amazon.com/ at the time of purchase will apply to the purchase of this product.
)
You save: $2.25 (23 %)
40 new from $7.741 used from $6.35
(* = affiliate link / image source: Amazon partner program)
Indiana Jones: The Complete Adventures [Blu-ray]
Price: $34.99
(As of: 2017/06/26 12:20 pm - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on http://www.amazon.com/ at the time of purchase will apply to the purchase of this product.
)
You save: $7.01 (17 %)
34 new from $33.9717 used from $24.00
(* = affiliate link / image source: Amazon partner program)
Canon EOS Rebel T5 EF-S 18-55mm IS II Digital SLR Kit
Price: $374.95
(As of: 2017/06/26 12:17 pm - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on http://www.amazon.com/ at the time of purchase will apply to the purchase of this product.
)
You save: $174.05 (32 %)
37 new from $350.0038 used from $299.00
(* = affiliate link / image source: Amazon partner program)
Behringer DJX750 Pro Mixer 5-Kanal DJ Mixer
Price: EUR 210,00
(As of: 2017/06/26 12:20 pm - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on http://www.amazon.de/ at the time of purchase will apply to the purchase of this product.
)
9 new from EUR 199,004 used from EUR 169,79
(* = affiliate link / image source: Amazon partner program)
7Trees Good Quality "7Trees" Foldable Wooden Lap-Desk Laptop Table - Folding & Height Adjustable Legs - 5 Angle Adjustable Table-Top - Accessory Side Drawer
Price: --
(As of: 2017/06/26 12:00 pm - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on http://www.amazon.in/ at the time of purchase will apply to the purchase of this product.
)
0 new0 used
(* = affiliate link / image source: Amazon partner program)
Xiaomi Redmi Note 3 (Gold, 16GB)
Price: --
(As of: 2017/06/26 12:00 pm - Details
×
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on http://www.amazon.in/ at the time of purchase will apply to the purchase of this product.
)
0 new0 used
(* = affiliate link / image source: Amazon partner program)