Custom Product Attributes

Knowledgebase Articles: Custom Product Attributes

Custom attributes for products offers an effective way to extend your product data structure, and provide customers will be meaningful detailed information, in an easily digestable and recognisable format. Custom attributes can not only be displayed on your site, but they can be passed to 3rd party systems, like Product Comparison sites and Google Merchant Center, as additional product information.

To add a custom attribute to a product, login to your PowaWEB site, go to Catalogue > Manage Products > Edit Product > Custom Attributes, click on Add Attribute and enter its Name and Value. Tick the 'Display on Website' check box if a new attribute should be displayed on the Product Details page. It will be displayed under the Product Full Description in the format: AttributeName: AttributeValue
Alternatively, custom attributes can be added to all products in bulk by means of the Import Products functionality. 

Once an attribute is added, its Name and Value can be edited by double-clicking on the corresponding cell. To change position of attributes, use the Move Up/Move Down buttons.

A custom attribute name should be unique within the list of custom attributes for a product. 




The Product Details Page


See also What custom attributes can be passed to Google Merchant Center

Note for developers: An attribute name and value can be accessed via jQuery, therefore the display of an attribute can be customized.

A sample script, which provides ability to display product's custom attributes in the page section, to which the script was added:

<div id="content">
</div>
<script>

function handleGetProductAttribute(response)
{
    var responseText = processHtmlResponse(response);
    var result = JSON.parse(responseText);

    if (COMMONS.isDefined(result['productAttributeData']))
    {
        var attributeData = JSON.parse(result['productAttributeData']);
        var attributeList = attributeData['attributes'];

var html = "<div class=\"productAttributes\">";

        for (var key in attributeList) {
if (attributeList[key]['display']=='true')

{
html = html + '<div class="productAttribute">';
html = html + "<label>" + attributeList[key]['name'] + ": </label><b>" + attributeList[key]['value'] + '</b>';
html = html + "</div>";
}
        }
html = html + '</div>';

setHTML('content', html);
    }
}

getProductAttribute('%product_sku%', handleGetProductAttribute);
</script>

Important note for developers and shop owners who use bespoke templates:

This functionality is only available for templates that have the generic template version id=6 or greater. Please see Template Version Control for more information on the generic template version.
 

 

Have more questions? Submit a request

0 Comments

Article is closed for comments.