Это небольшое изменение позволит выводить при большой ширине экрана допустим 3 столбика, 2 при узком экране и 1 при самом маленьком телефонном. Как это работает, можно посмотреть на моем сайте по вязанию. Для этого поиграйте шириной экрана. Может я слишком заморочился, но может кому то и понравится такая штука. Я делал основной упор на адаптивность шаблона, т.к. пользователи у меня в основном как оказывается с телефонов.
Делаем следующим образом, открываем файл \templates\default\content/default_list_tiles.tpl.php. Находим в нем строчки:
<?php if ($index % $columns == 0) { ?>
<div class="clear"></div>
<?php } ?>
Заменяем их на
<?php if ($index % 3 == 0) { ?>
<div class="clear3"></div>
<?php } ?>
<?php if ($index % 2 == 0) { ?>
<div class="clear2"></div>
<?php } ?>
Теперь у нас после каждой 2й записи будет создаваться див с классом clear2, а после каждой 3й как и ранее это было сделано див с классом clear3.
Кстати, такие же изменения можно сделать с файлом для вывода альбомов, albums_list.tpl.php.
Кстати, в выводе плитки не работает почему отображение тегов, видимо косяк в шаблоне, поэтому советую добавить после кода
<?php
$is_tags = $ctype['is_tags'] &&
!empty($ctype['options']['is_tags_in_list']) &&
$item['tags'];
?>
Код
<?php if ($is_tags){ ?>
<div class="tags_bar">
<?php echo html_tags_bar($item['tags']); ?>
</div>
<?php } ?>
Далее открываем файл \templates\default\css/theme-content
И в самом конце добавляем такой код
@media only screen and (min-width: 661px) {
.content_list.tiled .clear3 { clear:both; }
}
@media only screen and (min-width: 421px) and (max-width: 660px) {
.content_list.tiled .clear2 { clear:both; }
.content_list.tiled .tile { width:48%; padding: 1% margin-right: 1%;}
}
@media only screen and (max-width: 420px) {
.content_list.tiled .tile { width:97%; padding: 1.5%; margin-right: 0%;}
}
Где 660- ширина до которой показываем 3 столбика, 420 — 2 столбика, ну и меньше 420 уже показываем 1 столбик. Можете свои стили прописать.
Я все отступы задавал в процентах, т.к. например в дефолте, при узком экране, мало того, что столбики узкие, так еще и отображается только 2 из них, т.к. не все отступы заданы процентах и верстка плывет.
Я думаю, что никому не открыл америки, но решил методом поделиться, до гуру сайтоделанья мне далеко, но может новички найдутся, кому это пригодится.
Из плюсов метода, что делается в основном через стили, раньше я думал, что это придется реализовывавать через джава, а я его вообще не знаю, но вот как то с утра меня осинило, что так можно сделать.
Если кому пригодилось, плюсуйте, мне будет приятно.