Перейти к содержанию
qub

Grid или list view для разных категорий

Рекомендуемые сообщения

Opencart 2.1.0.2

 

Доброе время суток господа.

Подскажите пожалуйста как реализовать чтобы в одной категории был grid по умолчанию, а в другой list.

 

Может ли кто нибудь нагородить простой js типо:

 

$document ready

Если page url=xxx,yyy,zzz

то click list view by default

Else

grid view

 

Заранее спасибо!

 

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Неужели ни у кого не возникало такой необходимости?

Отправлено с моего Redmi Note 2 через Tapatalk

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

в контроллере     header.php   перед

return $this->load->view('common/header', $data);

добавляем

                $parts = explode('_', (string) $this->request->get['path']);
                $category_id = (int) array_pop($parts);
                  if ($category_id == 57) {
                $data['script_local'] = "<script>localStorage.setItem('display', 'list');</script>";
                } else {
                    $data['script_local'] = "<script>localStorage.setItem('display', 'grid');</script>";
                }

заменить  57 - на нужную категорию

шаблон header.tpl   перед

<script src="catalog/view/javascript/common.js" type="text/javascript"></script>

вставляем

<?php if(isset($script_local)) {echo $script_local;}?>

 

Изменено пользователем fanatic
  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Спасибо! Но есть вопрос:
Тут изменение идёт через куки и при первой загрузке страницы куки переписываются в нужной категории, но тип отображения остаётся старым. После обновления страницы уже из новых кукисов меняется тип отображения.
Я решение ещё не успел протестировать вживую, просто пытался понять логику.

К слову я думал о чём то более простом типо js скрипта который виртуально кликает grid or list в зависимости от урла.

Прошу прощения, что не протестировал пишу тут возможно глупости.

Спасибо за ответ!

Отправлено с моего Redmi Note 2 через Tapatalk

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

посмотрите код установки разметки в common.js 

Grid View, List View и чуть ниже по коду localStorage. Вот именно там идет проверка содержимого localStorage

И это значение меняется заранее.

Остается открытым вопрос, как его вернуть в предыдущее состояние при переходе на стандартную страницу каталога.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Яваскриптом можно анализировать класс тега "body":

<body class="common-home">
  ...
<body class="product-category-25_32">
...
  и так далее

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
12 часов назад, qub сказал:

Тут изменение идёт через куки

нет.  через localStorage

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

Остается открытым вопрос, как его вернуть в предыдущее состояние при переходе на стандартную страницу каталога.

в if  добавляем нужное значение в хранилище,  в else  очищаем.  и при заходе в другую категорию будет функционал по умолчанию

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

А если из category.php (там ведь определяется штатно category_id) по условию совпадения ID категории передавать служебную переменную непосредственно в category.tpl? Там проверять ее значение и там исполнять скрипт (имитировать нажатие на кнопку)?

Сработает?

Тогда не затрагивается LocalStorage.

Изменено пользователем jaffagold

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
А если из category.php (там ведь определяется штатно category_id) по условию совпадения ID категории передавать служебную переменную непосредственно в category.tpl? Там проверять ее значение и там исполнять скрипт (имитировать нажатие на кнопку)?
Сработает?
Тогда не затрагивается LocalStorage.

Я вот о таком коде и мечтал. Мне кажется, что это было бы самое близкое к центру проблемы решение.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
1 час назад, jaffagold сказал:

(имитировать нажатие на кнопку)?

 

1 час назад, jaffagold сказал:

Тогда не затрагивается LocalStorage.

затрагивается


	// Product List
	$('#list-view').click(function() {
		$('#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');

		localStorage.setItem('display', 'list');
	});

	// Product Grid
	$('#grid-view').click(function() {
		// What a shame bootstrap does not take into account dynamically loaded columns
		var cols = $('#column-right, #column-left').length;

		if (cols == 2) {
			$('#content .product-list').attr('class', 'product-layout product-grid col-lg-6 col-md-6 col-sm-12 col-xs-12');
		} else if (cols == 1) {
			$('#content .product-list').attr('class', 'product-layout product-grid col-lg-4 col-md-4 col-sm-6 col-xs-12');
		} else {
			$('#content .product-list').attr('class', 'product-layout product-grid col-lg-3 col-md-3 col-sm-6 col-xs-12');
		}

		$('#list-view').removeClass('active');
		$('#grid-view').addClass('active');

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

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

То есть localStorage это именно та переменная которая не просто строит куки но и меняет в реалтайме макет? И если на странице изменить её то макет сразу изменится?

Или всё таки add и remove class это основные двигатели смены макета отображения?

 

Я вижу код примерно так:

 

Categiries.tpl:

If categiry id=15,16,17{

Remove.class=grid;

Add.class=list;

Button.active=list;

Localstorage=list;}

Else{

Remove.class=list;

Add.class=grid;

Button.active=grid;

Localstorage=grid};

 

 К слову localstorage можно вообще не трогать, пускай будет дефольным для движка. Есть смысл именно в нужных категориях вызывать add и remove class.

С другой стороны как будет работать pagination без locastorage - загадка

 

 

 

 

 

 

 

 

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Там ведь помимо класса Grid/List и active есть еще классы разметки Bootstrap. И все это уже написано.

Вот только что вам выложили листинг куска стандартного common.js,который отвечает за переключение разметок и работу с locaStorage...

Там и клики, и смена класса active, и запись в localStorage выбора посетителя.

Не мудрите.. Весь код вам уже дали. Он должен работать. Осталось только проверить.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
49 минут назад, qub сказал:

 

То есть localStorage это именно та переменная которая не просто строит куки но и меняет в реалтайме макет?

 

 да не строит она куки.  это локальное хранилище.  в него записывается значение как выводить товары    'display'  = 'list'  или 'display' = 'grid'

1 час назад, qub сказал:

И если на странице изменить её то макет сразу изменится?

нет

проверка хранилища происходит один раз, при загрузке страницы.  в зависимости от значения  в хранилище, происходит программное нажатие кнопки, и срабатывает уже скрипт(выше в моем сообщении), меняющий разметку

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
16 минут назад, jaffagold сказал:

Там и клики, и смена класса active, и запись в localStorage выбора посетителя.

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
В 06.05.2017 в 20:13, fanatic сказал:

в контроллере     header.php   перед

добавляем

заменить  57 - на нужную категорию

шаблон header.tpl   перед

вставляем

Внёс все изменения! Работает в категориях отменно. Правда на других страницах кроме станиц категорий создаёт ошибку:

Notice: Undefined index: path in /var/www/u0135691/public_html/system/storage/modification/catalog/controller/common/header.php on line 416

Я так понимаю что он на других страницах не может получить корректный categoty.path отсюда и ошибка.

А как можно внедрить if на проверку что это категория а не другая страница?

СПАСИБО!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Разобрался на примере соседнего кода в контроллере!

Конечный код:

// grid or list view 
if (isset($this->request->get['path'])){
    $parts = explode('_', (string) $this->request->get['path']);
    $category_id = (int) array_pop($parts);
    if ($category_id == 18 or $category_id == 17) {
        $data['script_local'] = "<script>localStorage.setItem('display', 'grid');</script>";
    } else {
        $data['script_local'] = "<script>localStorage.setItem('display', 'list');</script>";
    }
}
// end if of view

Спасибо!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Скажите пожалуйста а есть ли возможность там же обращаться с переменным

"сортировка" и "количество товаров на странице" через localstorage?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
1 час назад, qub сказал:

через localstorage?

нет, сортировка и количество реализованы по другому.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

при выборе, идет переход по ссылки с определенными параметрами   ?sort=p.price&order=ASC&limit=25

Изменено пользователем fanatic

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×