Display reference number near product image in PrestaShop 1.7

Hi there, Im looking for a PS v1.7 module that will display the product reference number on the main product page for each item - and to auto change when using product attributes. Do you have such a module - or is there some code I can use? I have tried many methods, but nothing that work successfully. 

What i am looking for, is to replicate that same code and make it appear directly underneath the short description. In the attached image - i have highlighted the example. Thing is, when you select an alternative size, the product reference does not change?

I would like to replicate the code which works great in the Product Details video you provided - but i can't find it anywhere??

Move product's reference number near the image and refresh it with combination change

In this case it will be required to move this section from tabs to new position.
open themes/classic/templates/catalog/product.tpl and move the code:

                 {block name='product_details'}
                   {include file='catalog/_partials/product-details.tpl'}
                 {/block}

right below the:

            {block name='product_description_short'}
              <div id="product-description-short-{$product.id}" itemprop="description">{$product.description_short nofilter}</div>
            {/block}

it should be like:

            {block name='product_description_short'}
              <div id="product-description-short-{$product.id}" itemprop="description">{$product.description_short nofilter}</div>
            {/block}
            {include file='catalog/_partials/product-details.tpl'}

then open file /themes/classic/templates/catalog/_partials/product-details.tpl and change its contents to:

<div class=""
     id="product-details"
     data-product="{$product.embedded_attributes|json_encode}"
  >
  {block name='product_reference'}

    {if isset($product.reference_to_display)}
      <div class="product-reference">
        <label class="label">{l s='Reference' d='Shop.Theme.Catalog'} </label>
        <span itemprop="sku">{$product.reference_to_display}</span>
      </div>
    {/if}
  {/block}
</div>

everything i wrote is based on "classic" theme, anyway - the same steps should be applicable to other themes too.

Share on Google Plus

About VEKIA

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.