Show important product features to your customers directly in product lists (categories), do not make them open individual product pages to view all details!
Plugin “Product features in lists” will enable you to display product features (also SKUs, tags, categories, subpages) in the following parts of your online storefront:
— in product categories
— in search results
— in static and dynamic product sets
— in the shopping cart
— in recommended product lists (upselling & cross-selling)
Plugin's functionality
- Custom text (input)
- HTML (textarea)
- Yes/No toggle (boolean)
- Color
- Weight
- Length
- Value
- Range
- Value × Value [× Value]
- Select
- Checkboxes (multiple choice)
- Divider
and additional important product properties:
- SKUs
- Tags (can be set up to appear as links)
- Category names (can be set up to appear as links)
- Links to products' subpages
Plugin usage guidelines
To display feature values in product lists, you need to add a call of plugin method shown below to the template file which is used to generate product lists in your design theme:
{shopListfeaturesPlugin::display($p, $products)}
How to correctly add plugin method call
{foreach $products as $p}
...
{shopListfeaturesPlugin::display($p, $products)}
...
{/foreach}
{foreach $products as $p}
...
{/foreach}
1. Select feature which you want to display in product lists and categories
Upon plugin installation, open backend section “Plugins” and select plugin “Product features in lists”. On the page, select one of your online storefronts, enable the desired features, and save the settings. If you have more than one storefront, then you need to repeat this step for each of them. Note that you can create multiple sets of product features, which you can display in different parts of your storefront.
2. Add a method call to design theme templates
If you have created multiple feature sets for each storefront, then add appropriate set ID next to plugin method call as shown below:
{shopListfeaturesPlugin::display($p, $products, 3)}
If set ID is not specified, then 1st set is used by default.
Immediately upon adding the call of plugin's method to a template, check how product features are displayed in the storefront. If necessary, adjust its appearance using CSS (see section “How to modify design of product features table” below).
Product sets/categories
Add a call of plugin's method to the template which is used to generate product lists (e.g., list-thumbs.html in basic design themes of Shop-Script):
{shopListfeaturesPlugin::display($p, $products)}
Recommended products
Add the following line to template file of recommended products e.g., list-thumbs-mini.html):
{shopListfeaturesPlugin::display($p, $products)}
Shopping cart items
Add the following line to template file of the shopping cart (cart.html):
{shopListfeaturesPlugin::display($item, $cart.items)}
The pictures above show approximate locations where a call of plugin's method can be added to template files of basic design theme “Default”. In other design themes, the plugin is installed in a similar fashion.
How to modify design of product features table
These tips are useful if you are using default HTML template.
Use the following CSS selectors:
.listfeatures.features { } /* product features table */
.listfeatures.features .name { } /* feature names */
.listfeatures.features .value { } /* feature values */
If you have specified a CSS class name in a feature's options (e.g., myclass), then you can change that individual feature's appearance using CSS selectors similar to these:
.listfeatures.features .myclass .name { } /* feature name */
.listfeatures.features .myclass .value { } /* feature value */
Useful hints on order pages and in notifications.
7 days free