The default Miva Merchant 5 product page attribute layout doesn’t include prices for attributes, so customers may be surprised to learn a total product price one they add the product to the basket.
To add attribute prices on your product page, you only need to add a little bit of HTML and StoreMorph code:
- In the Miva Merchant administration console, click Pages
- Click the Product Display Page (PROD) Page to edit it
- Click the Product Attribute Template tab. This will give you access to the template code used to display attributes in your store. *NOTE: if this tab is not available, you may not be running the latest version of Miva Merchant 5.5 and may need to run all updates.
- The original Product Attribute Template display (not to be confused with the Attribute Templates feature of MM5) contains HTML tables, though recent versions may be div and css based. Each of the types of attributes are represented in this template script. To add prices to the different types of Attributes, you’ll need to change the HTML code for EACH of the “mvt:if” conditions that appear. In this code you will add: &mvt:attribute:formatted_price;
The following attribute types may need to be adjusted in different ways. Checkboxes, text inputs and memo (textarea) inputs only have one price for the attribute. However radio buttons and select type attributes may have different attribute options each with a different price.
For single-price attribute types:
- Checkboxes: find <mvt:if expr=”l.settings:attribute:type EQ ‘checkbox’”>, add the attribute price after the attribute prompt, eg:
&mvt:attribute:prompt; (&mvt:attribute:formatted_price;) - Text Inputs: find <mvt:if expr=”l.settings:attribute:type EQ ‘text’”>, add the attribute price before the attribute input, eg:
(&mvt:attribute:formatted_price;) <input type=”text” name=”Product_Attributes[&mvt:attribute:index;]:value” value=”&mvte:attribute:value;” /> - Memo Input (textarea): find <mvt:elseif expr=”l.settings:attribute:type EQ ‘memo’”>, add the attribute price before the textarea
For attributes with selectable “options”, you’ll need to put the option price within the loop that displays each of the options for the attribute. Find the “foreach” loop that displays the multiple options: <mvt:foreach iterator=”option” array=”attribute:options”>, and add pricing where you want it:
- Radio Input: find <mvt:elseif expr=”l.settings:attribute:type EQ ‘radio’”>, add the attribute price after the prompt:
&mvte:option:prompt; (&mvt:option:price;) - Select Input: find <mvt:elseif expr=”l.settings:attribute:type EQ ’select’”>, add the attribute price inside the Option tag, next to the option prompt:
<option value=”&mvte:option:code;”>&mvte:option:prompt; (&mvt:option:price;)</option>
Now your attributes with prices will display the full pricing within the product page.