Tweak Library
Note: We have updated our folder structure in Neto 6 and this has not been updated on all tweaks yet. More info.

USPs (Product Page)

The following USPs (unique selling points), which boost customer confidence:

  • Free Shipping Australia-Wide
  • Australia Owned & Operated
  • Money Back Guarantee
  • 1 Year Warranty
  • 30 Day Returns

Industries

  • Computers & Electronics
  • Fitness & Supplements

Wireframe

USPs Product Page

Coding Instructions

There are two ways of doing this:

  1. Having each USP set up as a unique custom product field, so that they can be turned on/off for the customer.

  2. Setting the USPs up as a content zone, which means that all of them will show on all products.

Adding the USPs as custom product fields

Step 1. Set up the custom product fields

Go to admin > customisable fields > product fields, and create a new custom product field for each USP, using the below options and text layout for each.

The USPs are:

  • Free Shipping USP
  • Australia Owned & Operated USP
  • Money Back Guarantee USP
  • 1 Year Warranty USP
  • 30 Day Returns USP

Brand Logo

Step 2. Add the code into the product template

Open up the product template here: /assets/themes/THEME-NAME/products/template.html

Paste the following code directly underneath the ajax include line for the header:

 ([%load_ajax_template id:'_header'%]):
<div class="row">
    [%if [@misc1@]%]
        <div class="col-xs-12 col-sm-6">
            <p><span class="fa fa-truck">&nbsp;</span>Free Shipping Australia-wide</p>
        </div>
    [%/if%]
    [%if [@misc2@]%]
        <div class="col-xs-12 col-sm-6">
            <p><span class="fa fa-flag">&nbsp;</span>Australia Owned & Operated</p>
        </div>
    [%/if%]
    [%if [@misc3@]%]
        <div class="col-xs-12 col-sm-6">
            <p><span class="fa fa-dollar">&nbsp;</span>Money Back Guarantee</p>
        </div>
    [%/if%]
    [%if [@misc4@]%]
        <div class="col-xs-12 col-sm-6">
            <p><span class="fa fa-thumbs-o-up">&nbsp;</span>1 Year Warranty</p>
        </div>
    [%/if%]
    [%if [@misc5@]%]
        <div class="col-xs-12 col-sm-6">
            <p><span class="fa fa-exchange">&nbsp;</span>30 Day Returns</p>
        </div>
    [%/if%]
</div>

If the custom field numbers that you've set up in the backend don't correspond to the above [@misc@] fields, change the numbers. For example, the free shipping USP may be set up as misc3 in the back-end, in which case [%if [@misc1@]%] will need to be changed to [%if [@misc3@]%] for the that section in the code.

Step 3. Change the product fields, to test the code

Create a new test product in the system and change all of the new custom fields under the "Other" section to "true" (below), in order to test whether they work.

Change Product Fields

Final Result

USPs Final Result

html document

Adding the USPs as a content zone

Step 1. Create the content zone

Go to content > content zones in the cPanel and create a new content zone with the below info, using this code:

<div class="row">
    <div class="col-xs-12 col-sm-6">
        <p><span class="fa fa-truck">&nbsp;</span>Free Shipping Australia-wide</p>
    </div>
    <div class="col-xs-12 col-sm-6">
        <p><span class="fa fa-flag">&nbsp;</span>Australia Owned & Operated</p>
    </div>
    <div class="col-xs-12 col-sm-6">
        <p><span class="fa fa-dollar">&nbsp;</span>Money Back Guarantee</p>
    </div>
    <div class="col-xs-12 col-sm-6">
        <p><span class="fa fa-thumbs-o-up">&nbsp;</span>1 Year Warranty</p>
    </div>
    <div class="col-xs-12 col-sm-6">
        <p><span class="fa fa-exchange">&nbsp;</span>30 Day Returns</p>
    </div>
</div>

Add New Content Zone

Step 2. Add the content_zone into the product page

Open the product template: /assets/themes/THEME-NAME/products/template.html

Paste the following code directly underneath the ajax include line for the header ([%load_ajax_template id:'_header'%]):

[%content_zone id:'product_page_usps'/%]

Final Result

USPs Final Result


2 related articles found: