Перейти к публикации
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...

[РЕШЕНО] Вывод товара списком по умолчанию в opencart 2


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

Как сделать вывод товара в режиме "список" по умолчанию? В гугле только решения для версий ниже 2-ой, которые не подходят
На скрине режим списка

post-695505-0-48784800-1433177639_thumb.png

Изменено пользователем afagorn
Ссылка на комментарий
Поделиться на других сайтах


В 2.0 меняется вид в файле /catalog/view/javascript/common.js

95 строка

95-ая строка указывает на комментарий. Подскажите где именно надо что-то поменять. Я пытался в некоторых местах поменять grid на list, но это не дало результатов

Привожу кусок кода, который относится, судя по комментариям, к режимам вывода товара

 

// Product List
	$('#list-view').click(function() {
		$('#content .product-layout > .clearfix').remove();

		$('#content .product-layout').attr('class', 'product-layout product-list col-xs-12');

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

	// Product Grid
	$('#grid-view').click(function() {
		$('#content .product-layout > .clearfix').remove();

		// What a shame bootstrap does not take into account dynamically loaded columns
		cols = $('#column-right, #column-left').length;

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

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

	if (localStorage.getItem('display') == 'list') {
		$('#list-view').trigger('click');
	} else {
		$('#grid-view').trigger('click');
	}
Ссылка на комментарий
Поделиться на других сайтах


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

заменить на 

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

и кеш почистить в браузере, либо открыть в режиме инкогнито и протестировать

либо crtl + f5 обновить страницу

Изменено пользователем onec1ick
Ссылка на комментарий
Поделиться на других сайтах


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

заменить на 

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

и кеш почистить в браузере, либо открыть в режиме инкогнито и протестировать

либо crtl + f5 обновить страницу

Все сделал как написано, помогло наполовину. При первом открытии сайта в режиме инкогнито товар отображается сеткой, а при следующих обновлениях страницы показывается в режиме список. Как это исправить?

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


Проблема решилась таким образом: я поменял местами вывод режимов, то есть теперь сетка - это список, а список - сетка. Остается только поменять картинки в кнопках изменения режима вывода товара
Измененный код в common.js, который меняет местами режимы
 

// Product List
	$('#grid-view').click(function() {
		$('#content .product-layout > .clearfix').remove();

		$('#content .product-layout').attr('class', 'product-layout product-list col-xs-12');

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

	// Product Grid
	$('#list-view').click(function() { 
		$('#content .product-layout > .clearfix').remove();

		// What a shame bootstrap does not take into account dynamically loaded columns
		cols = $('#column-right, #column-left').length;

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

		 localStorage.setItem('display', 'grid');
	});
Ссылка на комментарий
Поделиться на других сайтах


В моем решении есть ошибка. Режим будет меняться на другой при простом обновлении страницы. Вот кусок кода с правильным изменением

	// Product List
	$('#grid-view').click(function() {
		$('#content .product-layout > .clearfix').remove();

		$('#content .product-layout').attr('class', 'product-layout product-list col-xs-12');

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

	// Product Grid
	$('#list-view').click(function() { 
		$('#content .product-layout > .clearfix').remove();

		// What a shame bootstrap does not take into account dynamically loaded columns
		cols = $('#column-right, #column-left').length;

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

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

	if (localStorage.getItem('display') == 'list') {
		$('#list-view').trigger('click');
	} else {
		$('#grid-view').trigger('click');
	}
Изменено пользователем afagorn
Ссылка на комментарий
Поделиться на других сайтах


  • 6 месяцев спустя...

Ну ребят, ну вы вообще даете)) Код перед глазами у вас, читайте, там же все понятно. После комментария // Product List идет скрипт функции, которая обрабатывает событие - клик по объекту с id="list-view" . После комментария // Product Grid идет скрипт функции, которая обрабатывает событие - клик по объекту с id="grid-view". Обе функции в конце выполняют команды - в куках браузера сохранить своё значение в переменной display Вот этот код: localStorage.setItem('display', 'list'); и localStorage.setItem('display', 'grid'); соответственно. А после этих двух функций идет скрипт проверки: 

  1. if (localStorage.getItem('display') == 'list') {
  2. $('#list-view').trigger('click');
  3. } else {
  4. $('#grid-view').trigger('click');
  5. }

 Перевожу - если в куках браузера в переменной display находится значение равное list  , то выполнить функцию обработки клика по объекту с id="list-view", во всех остальных случаях, выполнить функцию обработки клика по объекту с id="grid-view" Изначально кукисы в браузере отсутствуют, соответственно переменной display нет, это и есть все остальные случаи. Вам всего лишь нужно было поменять код 

  1. if (localStorage.getItem('display') == 'list') {
  2. $('#list-view').trigger('click');
  3. } else {
  4. $('#grid-view').trigger('click');
  5. }

на

  1. if (localStorage.getItem('display') == 'grid') {
  2. $('#grid-view').trigger('click');
  3. } else {
  4. $('#list-view').trigger('click');
  5. }
  • +1 3
Ссылка на комментарий
Поделиться на других сайтах


  • 2 месяца спустя...

opencart 2.1.0.2  -  ни один способ не помог. Что только ни делал, но либо только список и невозможно переключить на сетку, либо все равно сетка по умолчанию. Куки естественно чистил.

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


Решение для версии 2.1.0.2. Подсказали на другом форуме.

Все тот же файл common.js

Начало решение tweenfaster

 

меняем код

    if (localStorage.getItem('display') == 'list') {
    $('#list-view').trigger('click');
    } else {
    $('#grid-view').trigger('click');
    }

на этот

    if (localStorage.getItem('display') == 'grid') {
    $('#grid-view').trigger('click');
    } else {
    $('#list-view').trigger('click');
    }

далее вот как раз то, чего не хватает для 2.1.0.2, чуть ниже ищем:

var productSet =  $('#content .product-layout:not(.product-list), #content .product-layout:not(.product-grid)');

меняем на:

var productSet =  $('#content .product-layout:not(.product-list,.product-grid)');

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

Изменено пользователем rider76
  • +1 1
Ссылка на комментарий
Поделиться на других сайтах


  • 2 недели спустя...

Решение для версии 2.1.0.2. Подсказали на другом форуме.

Все тот же файл common.js

Начало решение tweenfaster

 

меняем код

    if (localStorage.getItem('display') == 'list') {
    $('#list-view').trigger('click');
    } else {
    $('#grid-view').trigger('click');
    }

на этот

    if (localStorage.getItem('display') == 'grid') {
    $('#grid-view').trigger('click');
    } else {
    $('#list-view').trigger('click');
    }

далее вот как раз то, чего не хватает для 2.1.0.2, чуть ниже ищем:

var productSet =  $('#content .product-layout:not(.product-list), #content .product-layout:not(.product-grid)');

меняем на:

var productSet =  $('#content .product-layout:not(.product-list,.product-grid)');

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

Последних строк которые вы написали нет в опенкарте 2 и в оксторе в common.js

  • +1 2
Ссылка на комментарий
Поделиться на других сайтах


Последних строк которые вы написали нет в опенкарте 2 и в оксторе в common.js

в опенкарт 2.0 возможно нету, но есть в 2.1.0.2. До версии 2.1 я предполагаю достаточно решения в начале темы. Для 2.1.0.2 было недостаточно.

  • +1 1
Ссылка на комментарий
Поделиться на других сайтах


  • 6 месяцев спустя...

Подскажите как сделать по умолчанию списком в последней версии окстор? Предыдущий пост не подходит, последних двух строк нет.

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


  • 4 месяца спустя...
В 10.10.2016 в 23:56, termotorg сказал:

Подскажите как сделать по умолчанию списком в последней версии окстор? Предыдущий пост не подходит, последних двух строк нет.

Поддерживаю! Нужен вывод списком, есть ли решение? 

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


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

Только надо куки сайта удалить ( надо объяснять как?), потому что у вас там уже содержится в LocalStorage информация, что надо выводить сеткой.

У вас в этом коде идет проверка содержимого этого самого localStorage.

И если там уже записано grid, то и выводится по записанному (grid)

А если там пусто, то проверка идет по ветви условия else и устанавливает значение list

Изменено пользователем jaffagold
Ссылка на комментарий
Поделиться на других сайтах


  • 2 месяца спустя...

Здравствуйте, перепробовал всё ничего не помогло. Помогите пожалуйста. Нужно что бы стандартно 3-й вид был прайс. Вот код: 

	// Product List
	$('#list-view').click(function() {
		$('#content .product-grid > .clearfix').remove();

		//$('#content .product-layout').attr('class', 'product-layout product-list col-xs-12');
		$('#content .product-grid, #content .product-price').attr('class', 'product-layout product-list col-xs-12');
		$('#content .product-list .cart > a').attr('data-toggle', 'none');
		$('#content .product-list .cart > a').attr('title', '');
		
		var w_list_img = $('.product-list .product-thumb .image img').outerWidth();
		$('.product-list .product-thumb .description').css('min-height', w_list_img-93);
		
		localStorage.setItem('display', 'list');
		$(this).addClass('active');
		$('#grid-view, #price-view').removeClass('active');
	});

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

		if (cols == 2) {
			$('#content .product-list, #content .product-price').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, #content .product-price').attr('class', 'product-layout product-grid col-lg-4 col-md-4 col-sm-6 col-xs-12');
		} else {
			$('#content .product-list, #content .product-price').attr('class', 'product-layout product-grid col-lg-3 col-md-3 col-sm-6 col-xs-12');
		}

		localStorage.setItem('display', 'grid');
		$(this).addClass('active');
		$('#list-view, #price-view').removeClass('active');
	});

	$('#price-view').click(function() {
		$('#content .product-grid > .clearfix').remove();
		$('#content .product-list, #content .product-grid').attr('class', 'product-layout product-price col-xs-12');
		$('#content .product-view .cart > a').attr('data-toggle', 'none');
		$('#content .product-view .cart > a').attr('title', '');

		localStorage.setItem('display', 'price');
		$(this).addClass('active');
		$('#list-view, #grid-view').removeClass('active');
	});
	
	if (localStorage.getItem('display') == 'list') {
		$('#list-view').trigger('click');
	} else if (localStorage.getItem('display') == 'price') {
		$('#price-view').trigger('click');
	} else {
		$('#grid-view').trigger('click');
	}

 

 

Изменено пользователем Zapazuhu
Ссылка на комментарий
Поделиться на других сайтах


Вот смотрите на код

if (localStorage.getItem('display') == 'list') {
		$('#list-view').trigger('click');
	} else if (localStorage.getItem('display') == 'price') {
		$('#price-view').trigger('click');
	} else {
		$('#grid-view').trigger('click');
	}

Если у пользователя в браузере сохранено значение List, То отобразить списком

Если значение price- отобразить прайсом

Если ни то и не другое,( то есть не был пользователь на сайте еще или там записано Grid) , то отобразить сеткой.

Еще подсказки нужны?

 

Изменено пользователем jaffagold
Ссылка на комментарий
Поделиться на других сайтах


jaffagold, в том и дело я настраиваю, а получается следующее. Заходишь он выдаёт прайс и тут же перекидывает автоматом на сетку и чистил кеш толку 0 почему-то не помогает. Список и сетка сохраняют своё значение после обновы страницы(если не редактировать код) а ставишь прайс сразу скидывает на сетку после обновы. После изменения кода обновишь он выдаёт прайс и через долю сек скидывает на сетку ппц запарился уже не пойму в чём дело, если порезать код(чтобы только всё в прайсе) также перекидывает сразу на сетку ну и переключиться уже нельзя. Шаб не стандартный поэтому я другой файл редактирую, реакция есть значит именно он за это отвечает. Может где-то скрипт ещё в шабе стоит на эти действия... порыскал ничего нету

Изменено пользователем oOSozdatel
Ссылка на комментарий
Поделиться на других сайтах


  • 1 месяц спустя...

Долго бился над проблемой почему же не работает. Решение - common.js может быть несколько, если тема не дефолт. Вот редактируя второй файл всё и получилось.

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


Создайте аккаунт или войдите в него для комментирования

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

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас
 Поделиться

  • Сейчас на странице   0 пользователей

    • Нет пользователей, просматривающих эту страницу.
×
×
  • Создать...

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.