суббота, 7 января 2017 г.

Суффикс класса модуля или как сделать каждый модуль Joomla уникальным.

В Joomla есть один очень мощный инструмент стилизации, о котором многие не знают. Он называется «Суффикс CSS-класса модуля». Звучит страшно, особенно для новичков. Но понимая, как работает этот механизм, в сочетании со знанием CSS-стилей, можно отображать модули на странице так, так душе угодно. В этой статье я подробно расскажу про работу с CSS-суффиксом модулей, а также приведу пример его использования в Joomla.
Прежде всего стоит упомянуть, что суффикс класса модуля одинаково может применяться как в Joomla 3, так и в более ранних версиях CMS. Мы рассмотрим пример в Joomla 2.5, т.к. она уже достаточно стабильна, имеет много адаптированных расширений, да и просто нужно двигаться в ногу со временем :-).
Начнем с постановки задания. Предположим, что заказчик хочет, чтобы модули в правой колонках сайта имели следующие особенности:
  1. Располагались не друг под другом, а со сдвигом влево и чередованием;
  2. Чередовались между прямыми и скругленными углами;
  3. Заголовки модулей, как и рамки, обрамляющие их, должны быть в соответствии с цветами радуги.
Если представить всё это схематично, то получится что-то вроде:
Module Class SuffixНа самом деле в такой задачке нет ничего особенного. С нынешними дизайнами она может казаться даже простой. Но если дать ее начинающему web-мастеру, то он как минимум впадет в ступор. Как же  сделать в Joomla такое задание? Легко, если вы умеете использовать CSS-суффиксы модулей. Ниже разберем всё подробно.
Для примера я взял стандартный шаблон Joomla, который  включен по умолчанию сразу после установки CMS.

Комментариев нет:

Отправить комментарий