Columns layout

On this page, ASA’s managed template “Columns_layout” is used. It is specialized for displaying multiple products in columns. 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:


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

You can use any template to render the single items. Use option “item_tpl” to set a custom item template.


The Knot Ultimate Wedding Planner & Organizer [binder edition]: Worksheets, Checklists, Etiquette, Calendars, and Answers to Frequently Asked Questions
Price: $22.36
(As of: 2017/10/16 10:15 am - 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 https://www.amazon.com/ at the time of purchase will apply to the purchase of this product.
)
You save: $7.63 (25 %)
37 new from $15.9532 used from $6.58
(* = affiliate link / image source: Amazon partner program)
Starfinder Roleplaying Game: Starfinder Core Rulebook
Price: $53.99
(As of: 2017/10/16 11:15 am - 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 https://www.amazon.com/ at the time of purchase will apply to the purchase of this product.
)
You save: $6.00 (10 %)
8 new from $53.990 used
(* = affiliate link / image source: Amazon partner program)
Naturally, Delicious: 100 Recipes for Healthy Eats That Make You Happy
Price: $20.40
(As of: 2017/10/16 11:15 am - 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 https://www.amazon.com/ at the time of purchase will apply to the purchase of this product.
)
You save: $9.60 (32 %)
40 new from $15.3934 used from $14.99
(* = affiliate link / image source: Amazon partner program)
Timex Unisex "Weekender" Watch With Leather Band
Price: $35.83 - $65.00
(As of: 2017/10/16 10:00 am - 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 https://www.amazon.com/ at the time of purchase will apply to the purchase of this product.
)
0 new0 used
(* = affiliate link / image source: Amazon partner program)
Steve Jobs: Die autorisierte Biografie des Apple-Gründers
Preis: EUR 12,99
(Stand von: 2018/08/20 8:15 am - Details
×
Produktpreise und -verfügbarkeit sind zum angegebenen Datum / Uhrzeit korrekt und können sich ändern. Alle Preis- und Verfügbarkeitsinformationen auf https://www.amazon.de/ zum Zeitpunkt des Kaufs gelten für den Kauf dieses Produkts.
)
39 neu von EUR 9,9522 gebraucht von EUR 2,99
(* = Affiliate-Link / Bildquelle: Amazon-Partnerprogramm)
BRAINEFFECT MOOD - Pflanzlicher Stimmungsaufheller - Für mehr Wohlbefinden - 90 Kapseln - 100% Natürlich mit L-Tryptophan, Vitamin B und Pflanzenextrakten - Ohne Zusatzstoffe / Magnesiumstearat - vegan
Preis: EUR 40,90
(Stand von: 2018/08/20 10:15 am - Details
×
Produktpreise und -verfügbarkeit sind zum angegebenen Datum / Uhrzeit korrekt und können sich ändern. Alle Preis- und Verfügbarkeitsinformationen auf https://www.amazon.de/ zum Zeitpunkt des Kaufs gelten für den Kauf dieses Produkts.
)
Sie sparen: EUR 2,00 (5 %)
1 neu von EUR 40,900 gebraucht
(* = Affiliate-Link / Bildquelle: Amazon-Partnerprogramm)
Stagg 3m High Quality XLR to XLR Plug Microphone Cable
Price: £4.20
(As of: 2018/08/20 12:45 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 https://www.amazon.co.uk/ at the time of purchase will apply to the purchase of this product.
)
You save: £0.79 (16 %)
37 new from £2.650 used
(* = affiliate link / image source: Amazon partner program)
Berrisom - My Lip Tint Pack - Virgin Red - Lipstick - Lipgloss - Make Up
Price: $7.15
(As of: 2016/11/02 1:00 am - 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 https://www.amazon.com/ at the time of purchase will apply to the purchase of this product.
)
5 new from $7.150 used
(* = affiliate link / image source: Amazon partner program)