Представляю вашему вниманию простой, но в то же время универсальный способ вывода материала модулей в две колонки с помощью CSS и jQuery. Использование данного метода не требует модификации PHP файлов и приемлем для всех модулей системы как стандартных так и не стандартных.
Пример использования в модуле новостей
Реализация для версии SLAED CMS 5.* Pro
Открываем файл: plugins/jquery/jquery.slaed.js
В нижней части вставляем:
// Two columns<br />
$(document).ready(function() {<br />
$("div.sl_news").addClass("alt");<br />
$("div.sl_news_clr:even").addClass("alt");<br />
});
Открываем файл: templates/celestial/css/main.css
Для не стандартной темы оформления используйте свой CSS файл.
В нижней части вставляем:
/* Материал в две колонки */<br />
.sl_news.alt {<br />
float: left;<br />
width: 50%; /* Данное значение подбирается индивидуально */<br />
}<br />
.sl_news_clr {<br />
height: 0;<br />
clear: both;<br />
}<br />
.sl_news_clr.alt {<br />
clear: none;<br />
}
Открываем файл: templates/celestial/basic.html
Для не стандартной темы оформления используйте свой HTML файл.
В начале кода указываем:
<div class="sl_news">
В конце кода указываем:
</div><br />
<div class="sl_news_clr"></div>
Получаем примерно такой вид:
<div class="sl_news"><br />
<br />
Содержание и различные теги...<br />
<br />
</div><br />
<div class="sl_news_clr"></div>
Учитывайте что при модификации файла: templates/celestial/basic.html материал будет отображаться в две колонке, во всех модулях которые используют данный шаблон. Если необходимо модифицировать отображения материала в две колонки, например только для модуля магазина потребуется модифицировать стандартный шаблон оформления: basic-shop.html и т.д. для каждого модуля. Как создать шаблон персонально для определённого модуля читайте в данной теме.
Реализация для версии Open SLAED 1.3
Открываем файл: templates/paradise/index.html
Для не стандартной темы оформления используйте свой HTML файл.
Перед </head> вставляем:
<script type="text/javascript"><br />
$(document).ready(function() {<br />
$("div.sl_news").addClass("alt");<br />
$("div.sl_news_clr:even").addClass("alt");<br />
});<br />
</script>
Открываем файл: templates/paradise/css/theme.css
Для не стандартной темы оформления используйте свой CSS файл.
В нижней части вставляем:
/* Материал в две колонки */<br />
.sl_news.alt {<br />
float: left;<br />
width: 50%; /* Данное значение подбирается индивидуально */<br />
}<br />
.sl_news_clr {<br />
height: 0;<br />
clear: both;<br />
}<br />
.sl_news_clr.alt {<br />
clear: none;<br />
}
Открываем файл: templates/paradise/basic.html
Для не стандартной темы оформления используйте свой HTML файл.
В начале кода указываем:
<div class="sl_news">
В конце кода указываем:
</div><br />
<div class="sl_news_clr"></div>
Получаем примерно такой вид:
<div class="sl_news"><br />
<br />
Содержание и различные теги...<br />
<br />
</div><br />
<div class="sl_news_clr"></div>
Учитывайте что при модификации файла: templates/paradise/basic.html материал будет отображаться в две колонке, во всех модулях которые используют данный шаблон. Если необходимо модифицировать отображения материала в две колонки, например только для модуля файлов потребуется создать шаблон оформления: basic-files.html скопировав содержания из basic.html и т.д. для каждого модуля. Как создать шаблон персонально для определённого модуля читайте в данной теме.
Реализация для всех более ранних версий SLAED
Для пользователей более ранних версий системы метод подключения практически не меняется, единственное что потребуется, это подключение библиотеки jQuery.
Для этого в файле index.html вашей темы оформления, перед </head> укажите следующий код:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
Как вариант, вы можете загрузить актуальную версию jQuery в директорию вашего сайта и указать ссылку на него.
О сколько нам открытий чудных,
Готовит просвещенья дух,
И опыт, сын ошибок трудных,
И гений, парадоксов друг...
