Как добавить иконки характеристик в товарах

Практически в каждом интернет магазине можно встретить иконки характеристик товаров

Однако, в стандартных бесплатных движках ( CMS ) этой функции нет — к сожалению.

на примере CMS Prestashop — одного из самых мощных и популярных движков за последнее время, вы узнаете как добавить иконки для Характеристик товаров.

Учитывая что в стандартном функционале иконки не предусмотрены, а модуль для Prestashop — писать долго и нудно, будем допиливать ручками ( необходимо добавить несколько строчек).

и так приступаем…. :

---

все действия с иконками характеристик товаров производились в Prestashop 1.6.10 (alfa), уверен — на более ранних версиях будет работать так же.

Вдохновение этой статьи, получило начало с официального форума Prestashop (ссылка).

• 1.

Находим в папке с нашей темой файл  product.tpl

• 2.

Ищем код, где бы мы хотели отобразить иконки характеристик : например я поставил в конце короткого описания товара, в файле product.tpl перед <!— end short_description_block —>

• 3.

В Папке с темой находим папку /img и создаём для наших иконок отдельную папку, например /icons , в которую в будущем мы поместим иконки наших характеристик для Prestashop

• 4.

Изначально планировалось что каждая картинка будет называться как и характеристика товара, но из-за того что наши характеристики кириллические — у нас прибавляется головняк с именами файлов, которые не всегда корректно работают, поэтому от этого способа пришлось отказаться и вместо значений характеристик товара, я воспользовался ID значений из Prestashop — которые из себя представляют только цифры.

Исходя из вышеизложенного не трудно догадаться что все наши файлы с иконками характеристик будут иметь имена ID значения характеристики => имя файла, например 1.jpg 2.jpg …

• 5.

{foreach from=$features item=feature}
<tr>
{if isset($feature.value)}
<td><img src="{$img_dir}icons/{$feature.id_feature}.png"/> </td>
{/if}
</tr>
{/foreach}

• 6.

Иконки выводятся в том же порядке, что и характеристики товаров, если в паке с иконками значений не будет необходимых файлов с изображениями, то мы увидим стандартную картинку Prestashop для товаров без изображения.

Смотрим исходный код страницы и видим как нам назвать наши иконки.

на этих фото всё видно и надеюсь понятно