Внешний вид сортировки товаров

Здраствуйте,
сделал чтоб сортировка товара не была в випадашке как по дефолту, а кнопками :
http://prntscr.com/jucth0
шаблон выглядит так :
<div class="container-sort-items">
<div class="sort-title"><span>{__('sorting_custom')}</span></div>
<a id="" class="active-sort-item">{__("sort_by_$search.sort_by_$search.sort_order")}</a>
<ul id="" class="wrap-sort-items">
{foreach from=$sorting key="option" item="value"}
{if $search.sort_by == $option}
{assign var="sort_order" value=$search.sort_order_rev}
{else}
{if $value.default_order}
{assign var="sort_order" value=$value.default_order}
{else}
{assign var="sort_order" value="asc"}
{/if}
{/if}
{foreach from=$sorting_orders item="sort_order"}
{if $search.sort_by != $option || $search.sort_order_rev == $sort_order}
{assign var="sort_class" value="sort-by-$class_pref``$option-$sort_order"}
{assign var="sort_key" value="$option-$sort_order"}
{if !$avail_sorting || $avail_sorting[$sort_key] == 'Y'}
<li class="{$sort_class} sort-item">
<a class="{$ajax_class} sort-item__a" data-ca-target-id="{$pagination_id}" href="{"$curl&sort_by=$option&sort_order=$sort_order"|fn_url}" rel="nofollow">{__("sort_by_$option_$sort_order")}</a>
</li>
{/if}
{/if}
{/foreach}{/foreach}</ul>
</div>

и теперь когда я выбираю одну из сортировок, она становится активной и перемещается в левую часть блока с зеленым фоном,
как можно изменить шаблон чтобы она не перемещалась а оставалась на месте и там становилась активной?

У нас так работает:

<div class="ty-sort-block">
{foreach from=$sorting key="option" item="value"}
{if $search.sort_by == $option}
{assign var="sort_order" value=$search.sort_order_rev}
{else}
{if $value.default_order}
{assign var="sort_order" value=$value.default_order}
{else}
{assign var="sort_order" value="asc"}
{/if}
{/if}
{foreach from=$sorting_orders item="sort_order"}

                {assign var="sort_class" value="sort-by-`$class_pref``$option`-`$sort_order`"}
                {assign var="sort_key" value="`$option`-`$sort_order`"}
                {if !$avail_sorting || $avail_sorting[$sort_key] == 'Y'}
                
                <div class="{$sort_class} ty-sort-dropdown__content-item{if $search.sort_by == $option} sort-active{/if}">
                    <a class="{$ajax_class} ty-sort-dropdown__content-item-a" data-ca-target-id="{$pagination_id}" href="{"`$curl`&sort_by=`$option`&sort_order=`$sort_order`"|fn_url}" rel="nofollow">{__("sort_by_`$option`_`$sort_order`")}</a>
                </div>
                {/if}
            
        {/foreach}
    {/foreach}

</div>

1 лайк

именно это мне и надо))
спасибо большое)
а для сортировки по количеству тоже подойдет такой шаблон?

у менЯ там есть сортировка по : По алфавиту, Сначала дороже, Сначала дешевле, По популярности
и когда я вибираю “Сначала дешевле” или “Сначала дороже”, то обе сортировки становятся активними

{if $search.sort_by == $option }

$option для “сначала дороже” и “сначала дешевле” одинаковый —= “price”
где можна поменять значения?
а то два айтема становятся активними

все, сделал,
добавил проверку
{if $search.sort_by == $option && $search.sort_order == $sort_order} active-sort-item{/if}
и работает)

2 лайка

Ну все, гуд :slight_smile:

Подскажите плиз куда этот код всунуть чтобы заработало? Спасибо…

Шаблон сортировки в стандартной теме находится в design/themes/responsive/templates/common/sorting.tpl

Как правильно изменять файл https://www.cs-cart.ru/docs/latest/developer_guide/addons/hooking/tpl_hooks.html#id3

1 лайк