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:

Jurassic World
EUR 6,99
If I Can Dream
$7.38
Abbey Road
$14.58

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

Driving Buddies (Step into Reading) (Cars movie tie in)
Price: $3.99
(As of: 2017/08/23 6:30 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.
)
47 new from $0.54150 used from $0.01
(* = affiliate link / image source: Amazon partner program)
Kyocera Hydro Air 4G LTE Unlocked GSM 8GB Waterproof Lcd 5.0 5mp Flash Camera
Price: $59.99
(As of: 2017/08/23 5:45 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 $58.452 used from $60.00
(* = affiliate link / image source: Amazon partner program)
Marketing: An Introduction (13th Edition)
Price: $124.99
(As of: 2017/08/23 6: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.
)
You save: $115.81 (48 %)
29 new from $120.99172 used from $60.00
(* = affiliate link / image source: Amazon partner program)
Wireless Camera, Wireless Drive Home Security Monitoring Network HD Video Recording Camera, 1080P, IR Night Vision, Built-in mic
Price: $87.99
(As of: 2017/08/23 8: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.
)
1 new from $87.990 used
(* = affiliate link / image source: Amazon partner program)
Canon IXUS 185 Digital Camera (Black) with 8GB Memory Card and Camera Case
Price: INR 6,750.00
(As of: 2017/08/23 7: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.in/ at the time of purchase will apply to the purchase of this product.
)
15 new from INR 6,690.000 used
(* = affiliate link / image source: Amazon partner program)
Girls Who Code: Learn to Code and Change the World
Price: $12.32
(As of: 2017/08/23 5:45 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: $5.67 (32 %)
23 new from $8.904 used from $12.04
(* = affiliate link / image source: Amazon partner program)
Redmi 4 (Gold, 32 GB)
Price: --
(As of: 2017/08/23 7:30 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.in/ at the time of purchase will apply to the purchase of this product.
)
0 new0 used
(* = affiliate link / image source: Amazon partner program)
Nokia Lumia 521 T-Mobile GSM Windows 8 4G Noncontract Smartphone - White
Price: $64.80
(As of: 2017/08/23 5:45 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.
)
15 new from $64.8026 used from $19.99
(* = affiliate link / image source: Amazon partner program)