Opencart 2.3 Как изменить количества товаров в ряд в категориях с 3 на 4,5?

Question

[Александр Реутский]

Шаблон xds coloring как же добавить количество товаров в ряд?

Answer 1

[Александр Реутский]

Решение по пути /catalog/view/theme/coloring/assets/bootstrap/css ив bootstrap c wigh 33.333333% yf 25%
и
if (cols1 == 2) {
$('#content .product-layout:nth-child(2n+2)').after('');
} else if (cols1 == 1) {
$('#content .product-layout:nth-child(3n+3)').after('');
} else {
$('#content .product-layout:nth-child(4n+4)').after('');
}
в common.js

Comments

[panterr92]

ни в коем случае не меняйте исходные файлы библиотек..
правильно будет отредактировать классы в скрипте по адресу
/catalog/view/theme/ft_frame/javascript/ft_common.js

исходя из количества колонок на странице выдавать конкретные размеры ячеек

function grid_view() {

		var cols = $('#column-right, #column-left').length;

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

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

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

Answer 2

[anxieter]

шаблон демо предлагает немного другой вариант

@media (min-width: 1200px)

#content .col-lg-2:nth-child(6n+1), #content .col-lg-3:nth-child(4n+1), #content .col-lg-4:nth-child(3n+1), #content .col-lg-6:nth-child(2n+1) {
    clear: left;
}

@media (max-width: 991px) and (min-width: 768px)

#content .col-sm-2:nth-child(6n+1), #content .col-sm-3:nth-child(4n+1), #content .col-sm-4:nth-child(3n+1), #content .col-sm-6:nth-child(2n+1) {
    clear: left;
}

Я неодумеваю почему это не вшито в дистрибутив...

Answer 3

[panterr92]

Необходимо отредактировать файл JS по пути
/catalog/view/theme/ft_frame/javascript/ft_common.js

функция function grid_view()

function grid_view() {

		var cols = $('#column-right, #column-left').length;

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

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

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

Отредактируйте какие ячейки из сетки Bootrstrap отображать в зависимости от количества колонок.