1. Главная
  2. Блоги
  3. Блог Tinnka

Отображение изображений таксономии во views "кирпичиками"

Главные вкладки

Drupal Commerce 7
Есть таксономический справочник с категориями товаров. Для каждой категории с справочнике указаны:

  1. Название
  2. Описание
  3. Изображение
  4. Признак "Отображать на главной"

На главной странице нужно отображать информацию по всем категориям с установленным признаком "Отображать на главной".
Сейчас реализовано с помощью вьюшки с отображением категорий в виде сетки, по 2 блока на строку.

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

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

ВложениеРазмер
Иконка изображения Первая страница 692 КБ

Комментарии

Аватар пользователя Studio VIZA Studio VIZA 7 марта 2017 в 20:48
1

Регионы создайте, в таком виде как на скрине, потом клонируйте блоки во вьюхе по количеству регионов, задайте критерии фильтрации(в какой именно регион идёт блок) Это самое простое.

Можно ещё панелями, но там "с лёту" обычно не выходит, нужны навыки.

Сорри если неверно понял вопрос.

Аватар пользователя Alex787 Alex787 8 марта 2017 в 2:08

Может строки обычными дивами вывести? А к вложенным div задать половину по умолчанию и float: left, а к каждому третьему тогда применить :nth-child(3n) с шириной 100%
Что то вроде:

#ttt {
width: 100%;
margin: 2px;
padding: 2px;
}
#ttt .block {
width: 47%;
float: left;
padding: 5px;
border: 1px solid black;
text-align: center;
margin: 10px;
}
#ttt .block:nth-child(3n) {
width: 96%;
}

Ну и добавить "красивостей" и если необходимо - ко всяким таблетам/айпадам адаптацию..

Логотип drupal.ru

Содержимое сайта публикуется на условиях CreativeCommons Attribution-ShareAlike 3.0 или более поздней версии. Программные коды в тексте статей — на условиях GNU GPL v2 или более поздней версии.

Документация по совместной работе с репозиторием drupal.ru – https://docs.drupal.ru/code

Drupal – торговая марка Дриса Бёйтарта

12+

AltStyle によって変換されたページ (->オリジナル) /