Masonry [DLE 9.x - 10.x]

Название: Masonry
Автор: Gameer & Sander
CMS: DLE 9.x - 10.x

Описание:
В этой статье расскажу как правильно использовать Masonry, на своем сайте. В этом мне помог Sander.

Что ж такое Masonry? Это javascript библиотека для создания мозаики, или что-то в этом вроде. Он работает за счет размещения элементов в оптимальной позиции, на основе имеющейся вертикального пространства.

И так приступим:
Качаем Masonry. Кидаем скрипт в папку js и подключаем его

<script src="{THEME}/js/masonry.pkgd.min.js"></script>

Открываем файл engine/modules/show.short.php находим:

$db->free( $sql_result );

После вставить:

$tpl->result['content'] = "<div id=\"container\" class=\"js-masonry\" data-masonry-options='{ \"columnWidth\": 200, \"itemSelector\": \".item\" }'>>".$tpl->result['content']."</div>";

Теперь о настройках:
columnWidth: 200 - это ширина блока. Настраиваем под себя.
itemSelector: .item - это класс блока который начинается в short-story.tpl к примеру у меня он такой



и вместо item ставлю block_news

Скачать масонри последней версии можно всегда здесь http://masonry.desandro.com/

Установка завершена, настройки сделаны. Больше никаких действий не нужно и css кода писать тоже.