Flat_box_horizontal

The managed template “Flat_box_horizontal” is designed to work with any kind of product. It comes with many options to customize its appearance without having to change the code.

Main features

• General purpose template

• Responsive design

• Adjustable via options without programming skills

• Flat design

Demo page

To see this template in action with different examples, please refer to:

Example

Example shortcode:

[asa2 tpl="Flat_box_horizontal"]B00EI7DPPI[/asa2]

Global Options

On ASA 2’s admin page “Templates” you can open a customization context window for each managed template. Just hover the mouse cursor over a template row and click the link “Customize” to open it. These settings will effect the appearance of this template.

Note

The globally applied options can be dynamically overwritten via shortcode options.

The following screenshot illustrates the options window by means of the “Book” template:

Shortcode Options

In addition to the global options mentioned above, it is also possible to overwrite these settings dynamically in a WordPress shortcode, like this:

// general syntax:
[asa2 option="value"]ASIN[/asa2]

Take a look at other examples.

Complete Options List

Complete list of all options available for the template “Flat_box_horizontal”:

Layout
Option	Type	Values	Description
align	string	"none" (None) "left" (Left) "center" (Center) "right" (Right)	Align
width	string	custom text	Width. A CSS value like "50%" or "200px".
background_color	string	CSS compatible color value, like hex values (#ff0000) or color names (red)	Background color
border_color	string	CSS compatible color value, like hex values (#ff0000) or color names (red)	Border color
border_width	int	0 between 99	Border width. In pixels. 0 for no border.
border_radius	int	0 between 99	Border radius. In pixels. > 0 for rounded corners.
box_hover_effect	string	"none" (None) "scale" (Scale)	Box hover effect
Image
Option	Type	Values	Description
image_size	string	"small" (Small) "medium" (Medium) "large" (Large)	Image size
image_max_width	int	0 between 999	Image max width. In pixels. 0 - 999. 0 for none.
img_link_to_shop_page	string	"shop" (Shop page) "buy" (Buy page) "nothing" (Nothing)	Image links to
Title
Option	Type	Values	Description
title_color	string	CSS compatible color value, like hex values (#ff0000) or color names (red)	Title color. No default. The title will be displayed in the default text color of your page, if none is set here.
title_font_css	string	custom text	Title font style. Utilizes the CSS font property. Example: "15px arial, sans-serif;"
title_length	int	0 between 999	Title max length. Limits the title to a maximum length of characters. 0 for unlimited.
title_link_to_shop_page	string	"shop" (Shop page) "buy" (Buy page) "nothing" (Nothing)	Title links to
Price
Option	Type	Values	Description
price_color	string	CSS compatible color value, like hex values (#ff0000) or color names (red)	Price color. The color in which the price text is displayed.
hide_price	bool	"yes" / "no"	Hide price(s)
price_font_css	string	custom text	Price font style. Utilizes the CSS font property. Example: "15px arial, sans-serif;"
show_price_disclaimer	bool	"yes" / "no"	Show price disclaimer. "Details" link next to date of last update.
last_update_format	string	custom text	Last item update date format. Used in price disclaimer. Supports PHP date function format. Example: d.m.Y H:i:s
show_merchant	bool	"yes" / "no"	Show product merchant (if available)
Button
Option	Type	Values	Description
button_color	string	CSS compatible color value, like hex values (#ff0000) or color names (red)	Button color
button_color_hover	string	CSS compatible color value, like hex values (#ff0000) or color names (red)	Button color hover
button_text_color	string	CSS compatible color value, like hex values (#ff0000) or color names (red)	Button text color
button_border_radius	int	0 between 999	Button border radius. In pixels, > 0 for rounded corners.
button_font_css	string	custom text	Button font style. Utilizes the CSS font property. Example: "15px arial, sans-serif;"
button_target	string	"shop" (Shop page) "buy" (Buy page)	Button target. Decides whether the button should link to the product page or the buy page.
button_max_width	string	custom text	Button max width. CSS value like "50%" or "250px".
hide_button	bool	"yes" / "no"	Hide button
Savings
Option	Type	Values	Description
show_savings	bool	"yes" / "no"	Show savings ribbon
savings_color	string	CSS compatible color value, like hex values (#ff0000) or color names (red)	Savings ribbon font color
savings_bg_color	string	CSS compatible color value, like hex values (#ff0000) or color names (red)	Savings ribbon background color
savings_font_css	string	custom text	Savings ribbon font style. Utilizes the CSS font property. Example: "15px arial, sans-serif;"
savings_text_style	string	"short" (Short version (percentage only)) "long" (Long version (percentage and text))	Savings text variant
Details
Option	Type	Values	Description
show_features	bool	"yes" / "no"	Show product features (if available)
features_length	int	0 between 99	Number of features. How many feature items to show before the "Show more" link. 0 = no limit.
feature_text_length	int	0 between 1000	Feature text max length. Maximum number of letters for each feature before the "..." get displayed. 0 = no limit.
features_font_size	int	1 between 100	Features font size (in percent)
show_description	bool	"yes" / "no"	Show product description (if available)
description_font_size	int	1 between 100	Description font size (in percent)
description_length	int	0 between 1000	Description length. Number of letters before the "show more" link get displayed. 0 = no limit.
Misc
Option	Type	Values	Description
disclaimer	string	"none" (None) "asterisk_and_text" (Asterisk in title link and button. Disclaimer text in each template.) "asterisk_only" (Asterisk in title link and button. No disclaimer text.)	Disclaimer. Shows a disclaimer text.
structured_data	string	"none" (None) "json_ld" (JSON-LD format)	Structured Data. Include structured data at the end of the template
custom_css	string	"none" (None) "json_ld" (JSON-LD format)	Custom CSS. Custom CSS that is applied to all occurrences of this template on a page and is only included once in the source code.

Shortcode Options Examples

// to use a custom button color
[asa2 tpl="Flat_box_horizontal" button_color="green"]B00EI7DPPI[/asa2]

// to set a custom background color to the savings ribbon
[asa2 tpl="Flat_box_horizontal" savings_bg_color="red" button_color="red"]B00EI7DPPI[/asa2]