AntonEssential
@AntonEssential

Как сделать такой каталог?

Добрый день.
В недрах интернета нашел магази тыц, в разделе какталог на который ведет линк организован вывод подкатегорий, категории оформленны с каким то рондомом, некоторые позиции длинные некоторые короткие, что то слева что то справа, сверстать статично такой макет не проблема.
Хочу сделать что то похожее, но не совсем понятно как это делать, а именно вопрос при переносе на cms, ведь позиции будут выводится в цикел и получается, DOM оборачиваю циклом php, но тогда оно будет все повторяться один и тот же блок, либо они статично сверстали и в каждый блок вывели подкатегории, но тогда это какой то велосипед.
В общем не понимаю я как это сделано, возможно подскажите что почитать.
  • Вопрос задан
  • 2356 просмотров
Решения вопроса 5
@Sali_cat
В базе создаешь еще 1ну колонку. Она будет для размеров блоков.

Типо так, выводишь из базы всю инфу
<div class="class <?=$tip;?>"></div>
ну а в css прописываешь уже свои размеры.
к примеру будет это вот так выглядеть
<div class="class  size1">тут другая инф.</div>
<div class="class  size1">тут другая инф.</div>
<div class="class  size2">тут другая инф.</div>
<div class="class  size1">тут другая инф.</div>
<div class="class  size1">тут другая инф.</div>
<div class="class  size3">тут другая инф.</div>

итд. css наверное понял
size1 к примеру 25%
size2 50%
size3 100%
Ответ написан
Taraflex
@Taraflex
Ищу работу. Контакты в профиле.
Ответ написан
Комментировать
@maet
Backed разработчик
Какая разница, чем ты выводишь DOM? Тебе надо стилизовать это грамотно, а тут уже дело за тобой. В теории каждой категории в CMS можно присваивать опр. класс или ID и с помощью CSS уже играться с ними.
Ответ написан
sayber
@sayber Куратор тега PHP
Да, я программирую на PHP и еще асинхронно!
Способов много.
Но судя по картинкам: Если изображение товара по вертикале больше то блок вертикальный, соответственно если горизонт. то горизонтальный блок.
Но какой там алгоритм я хз. Они используют таблицы.
Ответ написан
Комментировать
@mr_ko
Javascript, Node.js. React.js, Vue.js, Wordpress
Эта структура формируется на РНР. В таблице colspan и rowspan прописаны сразу в HTML, если бы менялись с помощью javascrip то их бы не было бы в коде при просмотре crtl + U.
Как альтернативу можно использовать скрипт предложенный @Taraflex. Там будет достаточно вывести товары в div разных габаритов, а скрипт сам их отсортирует.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы