Изменение отображения характеристик в карточке товара

Коллеги, доброго времени суток!

Каким образом можно поменять стиль отображения основных характеристик товара? Те, что отображаются рядом с его фото, не внизу в доп характеристиках.

А именно мне нужно выделить жирно один параметр, так как он очень важный. Какие могут быть решения? Заранее спасибо.

Необходимо посмотреть, если у данной характеристики есть уникальный класс или ID - можно применить css именно к данной характеристике.

Можно добавить проверку на ID в следующий шаблон

design/themes/ТЕМА/templates/views/products/components/product_features_short_list.tpl

Есть графа код характеристики. Если бы был класс, то вообще вопроса бы не возникло.

Вот хороший вариант. Или добавить class=“short-feature-{$feature.feature_id}”
И как раз будут классы по каждой строке характеристик.

Не знаю какая у вас версия, и актуален ли вопрос, но один из советов может звучать так: вывести и отобразить те или иные характеристики можно чуть отредактировав шаблон “Карточки Товара”.

1. Один из вариантов, которому много лет, но рабочий по сей день.

{hook name="products:brand"}
    <div class="my-class">
    	{include file="views/products/components/product_features_short_list.tpl" features=$product.header_features}
    </div>
{/hook}

С помощью Хука вы просто выводите нужную характеристику в своем блоке, в котором уже путем CSS можете задать свои стили.

2. Второй вариант тоже стар, и более топорный, но имеет место быть:

<div>
	<ul>
    	<li>{$product.product_features.37.description}: {$product.product_features.37.subfeatures.53.value}</li>
	</ul>
</div>

* где цифры это идентификаторы характеристики, (со своим названием, описанием, и значением), которые можно посмотреть через fn_print.

Таким образом вы просто отображаете нужную характеристику в блоке, которому, соответственно можно задать свой стиль посредством CSS.

3. Третий вариант, это некая модификация второго. Смотрите:

<div>
    {foreach from=$product.product_features name=features_list item="feature"}
    <ul>
    	{if $feature.subfeatures.73.value == "Y"}
     	<li><span class="my-class"></span></li>
    	{/if}
    	{if $feature.subfeatures.74.value == "Y"}
     	<li><span class="my-class"></span></li>
    	{/if}
    </ul>
    {/foreach}
</div>

* где цифры это идентификаторы характеристики, (со своим названием, описанием, и значением), которые можно посмотреть через fn_print.

Таким образом вы просто отображаете нужную характеристику, и если она выбрана =Y, то элемент списка отображается, если нет =N - то элемент списка не отображается. Особенность и “Фишка” в том, что данную характеристику можно отобразить сторонним контеном (через СSS или JS), например картинкой-фоном.

Надеюсь поможет. ))

Удачи!

1 лайк