Автор Тема: Верстка. Ширина сайта. Колонки.  (Прочитано 1059 раз)

24 Февраль 2015, 16:37:57
  • Старожил
  • ****
  • Сообщений: 357
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Добрый день!
Интересует вопрос по верстке.
Как в стандартном шаблоне престы сделать, чтобы отображалось не 3 товара в ряд, а 4 и увеличить ширину сайта с 1170 до, например 1370, без нарушения остального функционала и верстки.
Спасибо.
24 Февраль 2015, 17:19:16
Ответ #1
  • Ветеран
  • *****
  • Сообщений: 16667
  • Репутация: +14630/-5
  • Сообщество PrestaShop
    • Просмотр профиля
Все меняется классами. Верстка на bootsrap 3, там ширина блоков определена в файле global.css
.col-xs-1,.col-xs-2,.col-xs-3,...
.col-sm-1,.col-sm-2,.col-sm-3,...

Как изменить количество товаров в ряд есть тема на форуме.
25 Февраль 2015, 19:02:04
Ответ #2
  • Старожил
  • ****
  • Сообщений: 357
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Все меняется классами. Верстка на bootsrap 3, там ширина блоков определена в файле global.css
.col-xs-1,.col-xs-2,.col-xs-3,...
.col-sm-1,.col-sm-2,.col-sm-3,...

Как изменить количество товаров в ряд есть тема на форуме.

Если, не сложно можно более подробно по моему вопрсу. Что и где править.
Количество товаров в ряд не нашел темы.
25 Февраль 2015, 19:31:56
Ответ #3
  • Ветеран
  • *****
  • Сообщений: 33325
  • Репутация: +26771/-0
    • Просмотр профиля
Открываете шаблон header.tpl. Меняте классы для главных блоков.
class="col-xs-12 col-sm-12" Размеры смотрите в классе global.css.
Всего 12 колонок, в зависимомти от ширины окна происходит прерасчет ширины.
Bootstrap 3 - Разметка. Система сетки.
27 Февраль 2015, 10:52:47
Ответ #4
  • Партнер
  • Ветеран
  • ****
  • Сообщений: 22816
  • Репутация: +17143/-1
  • Разработка веб-сайтов и веб-программирование
    • Просмотр профиля
Как в стандартном шаблоне престы сделать, чтобы отображалось не 3 товара в ряд, а 4
В шаблоне /themes/default-bootstrap/product-list.tpl
изменить количество товаров в один ряд в переменных nbItemsPerLine, nbItemsPerLineTablet, nbItemsPerLineMobile
{if isset($products) && $products}
{*define numbers of product per line in other page for desktop*}
{if $page_name !='index' && $page_name !='product'}
{assign var='nbItemsPerLine' value=3}
{assign var='nbItemsPerLineTablet' value=2}
{assign var='nbItemsPerLineMobile' value=3}
{else}
{assign var='nbItemsPerLine' value=4}
{assign var='nbItemsPerLineTablet' value=3}
{assign var='nbItemsPerLineMobile' value=2}
{/if}
{*define numbers of product per line in other page for tablet*}
{assign var='nbLi' value=$products|@count}
{math equation="nbLi/nbItemsPerLine" nbLi=$nbLi nbItemsPerLine=$nbItemsPerLine assign=nbLines}
{math equation="nbLi/nbItemsPerLineTablet" nbLi=$nbLi nbItemsPerLineTablet=$nbItemsPerLineTablet assign=nbLinesTablet}
Интернет-магазин под ключ.
Какой выбрать движок для интернет магазина ?
Какой движок лучше ?
Magento или Prestashop ?
Решение всех Ваших вопросов в создании Интернет-магазина.
27 Февраль 2015, 15:05:21
Ответ #5
  • Старожил
  • ****
  • Сообщений: 357
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Как в стандартном шаблоне престы сделать, чтобы отображалось не 3 товара в ряд, а 4
В шаблоне /themes/default-bootstrap/product-list.tpl
изменить количество товаров в один ряд в переменных nbItemsPerLine, nbItemsPerLineTablet, nbItemsPerLineMobile
{if isset($products) && $products}
{*define numbers of product per line in other page for desktop*}
{if $page_name !='index' && $page_name !='product'}
{assign var='nbItemsPerLine' value=3}
{assign var='nbItemsPerLineTablet' value=2}
{assign var='nbItemsPerLineMobile' value=3}
{else}
{assign var='nbItemsPerLine' value=4}
{assign var='nbItemsPerLineTablet' value=3}
{assign var='nbItemsPerLineMobile' value=2}
{/if}
{*define numbers of product per line in other page for tablet*}
{assign var='nbLi' value=$products|@count}
{math equation="nbLi/nbItemsPerLine" nbLi=$nbLi nbItemsPerLine=$nbItemsPerLine assign=nbLines}
{math equation="nbLi/nbItemsPerLineTablet" nbLi=$nbLi nbItemsPerLineTablet=$nbItemsPerLineTablet assign=nbLinesTablet}

Меня интересуют 4 колонки в десктопной версии. Соот я меняю значение в строке
{assign var='nbItemsPerLine' value=3}
на
{assign var='nbItemsPerLine' value=4}
в итоге, в каталоге получаю следующее отображение при выводе сеткой:
Три товара, под ним 1 товар, три товара, под ним 1 товар и т.д.
А мне надо 4 в одну строку.
27 Февраль 2015, 16:28:22
Ответ #6
  • Ветеран
  • *****
  • Сообщений: 1285
  • Репутация: +13/-1
  • Сообщество PrestaShop
    • Просмотр профиля
Еще нужно поменять размер изображений home_default, чтобы помещались 4 в ряд.
После смены размера пересоздать миниатуры и очистить кеш.
27 Февраль 2015, 16:55:22
Ответ #7
  • Старожил
  • ****
  • Сообщений: 357
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Еще нужно поменять размер изображений home_default, чтобы помещались 4 в ряд.
После смены размера пересоздать миниатуры и очистить кеш.

не помогает  - тоже самое отображается, только с меньшими картинками
3
1
3
1
3
1
и т.п.
27 Февраль 2015, 17:33:37
Ответ #8
  • Модератор
  • Ветеран
  • *****
  • Сообщений: 105673
  • Репутация: +39553/-0
    • Просмотр профиля
    • Webstudio UwK
В шаблоне /themes/default-bootstrap/product-list.tpl
изменить количество товаров в один ряд в переменных nbItemsPerLine, nbItemsPerLineTablet, nbItemsPerLineMobile
{if isset($products) && $products}
{*define numbers of product per line in other page for desktop*}
{if $page_name !='index' && $page_name !='product'}
{assign var='nbItemsPerLine' value=3}
{assign var='nbItemsPerLineTablet' value=2}
{assign var='nbItemsPerLineMobile' value=3}
{else}
{assign var='nbItemsPerLine' value=4}
{assign var='nbItemsPerLineTablet' value=3}
{assign var='nbItemsPerLineMobile' value=2}
{/if}
Также найдите такой код
<li class="ajax_block_product{if $page_name == 'index' || $page_name == 'product'} col-xs-12 col-sm-4 col-md-3{else} col-xs-12 col-sm-6 col-md-4{/if}...и замените его на
<li class="ajax_block_product col-xs-12 col-sm-4 col-md-3...
Cоздание интернет сайтов Webstudio UwK