Как выводить товары списком в шаблоне поиска?

[alinalessioYandex]

По умолчанию товары выводятся сеткой. Могу сделать, чтобы выводились списком. Но тогда списком будут выводиться на любой странице, а надо, чтобы в категориях выводились как по умолчанию - сеткой, а на странице поиска - списком. Как прописать условие в common.js чтобы на странице поиска выводилось списком, а на остальных страницах сеткой?

[Tom]

 

<script>
if (!localStorage.getItem('display')) {
localStorage.setItem('display', 'list');
}
</script>

 

[alinalessioYandex]

5 часов назад, Tom сказал:

 

<script>
if (!localStorage.getItem('display')) {
localStorage.setItem('display', 'list');
}
</script>

 

Вставил код, но при этом на странице категорий тоже по умолчанию списком выдает. Может я не правильно использовал код? В else ничего не надо писать? Сейчас первый раз показывает сеткой, а когда переходишь на другую страницу, то показывает списком.

Вот как сделал:

Заменил это:

localStorage.setItem('display', 'grid');

на это:

if (!localStorage.getItem('display')) {
		localStorage.setItem('display', 'list');
		}

Походу я не правильно использовал вашу подсказку )))

Змінено 3 червня 2017 користувачем alinalessioYandex

[Tom]

Цитата

Вставил код,

куда?

[alinalessioYandex]

В common.js

[Tom]

Странно конечно....А что если вставить в category.tpl в самый конец и не вставлять к примеру в search.tpl в той же папке?....

[alinalessioYandex]

5 часов назад, Tom сказал:

Странно конечно....А что если вставить в category.tpl в самый конец и не вставлять к примеру в search.tpl в той же папке?....

Неа. И так не работает. Так просто все сеткой на всех шаблонах.

[alinalessioYandex]

Мне казалось в условие надо вписать, мол, если урл страницы такой-то (где указать что это страница поиска), то выводить по умолчанию списком, а в остальных случаях сеткой. Или это я чего-то не то навыдумывал и есть способ получше? К сожалению, пока тот что предложили не работает.

[jaffagold]

Можно без скриптов только стилями обойтись

на  странице поиска у тэга body есть специфический класс

.product-search

Для начала прописать стили для

.product-search .col-lg-3,  .product-search .col-md-3, .product-search .col-xl-6, .product-search .col-xs-12 {

width: 100%;

}  

А потом немного подправить стили для элементов в карточке товара.

Например имеем:

.product-grid .product-thumb .image {

float: none;

}

а нам надо подсмотереть стили для 

.product-list .product-thumb .image {

float: left;

}

и сделать так

.product-search .product-grid .product-thumb .image {

float: left;

}

и т.д.

( просто скопировать стили для разметки list и прописать их для разметки .product-search .product-grid)

Но в этом случае о переключении вида придется забыть, поэтому переключатели вида тоже желательно скрыть.

 

Но если нужна возможность переключения на Grid

то вот такой вариант правки common.js

красным выделено то, что было

жирным- то что добавлено

Скрытый текст

//
if (!$("body").hasClass("product-search")){
    if (localStorage.getItem('display') == 'list') {
        $('#list-view').trigger('click');
        $('#list-view').addClass('active');
    } else {
        $('#grid-view').trigger('click');
        $('#grid-view').addClass('active');
    }
} else {
$('#content .product-grid > .clearfix').remove();
$('#content .row > .product-grid').attr('class', 'product-layout product-list col-xs-12');
$('#grid-view').removeClass('active');
$('#list-view').addClass('active');
}
//

смысл такой

если у тега body нет класса product-search, то работает стандартная проверка localStorage для установки вида страницы по умолчанию.

Если иначе ( то есть класс такой есть), то переключаем отображение,

но не записываем это в LocalStorage. Тогда, при переходе на обычные cтраницы категорий отображение сохранится как было (Grid)

Змінено 6 червня 2017 користувачем jaffagold