Суффикс css класса модуля joomla прекрасный инструмент оформления внешнего вида любого модуля движка. По сути, это дополнение собственного класса к уже имеющемуся дефолтному.
Как это работает на практике, смотрите в этом видео.
Эта отличная возможность не редактировать оригинальные стили модуля, а лишь добавлять свои, не нарушая всей структуры. Вообще cms-joomla славится такими «примочками» и относятся они не только к модулям, но так же и меню, и к отдельно взятой странице.
Во всех случаях у нас есть прекрасная возможность придать свое уникальное оформление отличное от оригинального.
Суффикс css класса модуля в основном используют администраторы разбирающиеся более, менее в свойствах css. Это похоже на альтернативный макет только намного проще.
Как это работает на практике, сейчас разберем.
В любом модуле есть дополнительные настройки в которых есть специальное поле суффикс css класса модуля. В это поле необходимо записать любое придуманное название класса, желательно несущее смысловую нагрузку.
Лучше тестировать на базовых шаблонах системы, где известны практически все классы. Это даст возможность правильно оценить работу, которую в последствии можно перенести на работающий шаблон сайта.
Допустим что нам нужны два модуля разного цвета, синий и черный. Если изменять уже готовые стили, то изменится внешний вид всех модулей. А при добавлении своего класса в поле суффикс css класса модуля, мы просто добавим свои свойства к этому классу.
Я создал два одинаковых html-модуля. К одному добавил суффикс css «box1», к другому «box2»
В таблице стилей шаблона добавил свойства для обеих вариантов.
Синий фон и белый шрифт
.box1 {
background-color: #2D5881;
color: #fff;
}
Результат на скриншоте.
Во втором случае фон черный, а шрифт так же оставил белый.
.box2 {
background-color: #3D3D3D;
color: #fff;
}
Результат.
При использовании редактора joomla, так же можно задавать разные стили отображения для html-модуля. Но важно учитывать и другие свойства, например внутренний отступ. Если такой отступ есть, а он почти всегда присутствует, то и стили заданные в редакторе будут распространяться только в рамках такого отступа.
Другими словами, чтобы задать фон с помощью редактора, он будет только до границы отступа, что не очень красиво.
Поэтому суффикс css класса модуля лучше подходит для оформления блоков на joomla-сайте. Это относится не только к последним версиям joomla, но и к версиям 2.5.
Теперь рассмотрим вариант когда оформленный блок (модуль) перемещается из одной позиции, в другую. Как при этом ведут себя стили.
Суффикс css класса модуля в разных позициях шаблона
Как правило, для разных модулей, которые расположены в разных позициях шаблона, применяются разные классы.
Редкий случай, когда все модули в разных позициях шаблона имеют одинаковый внешний вид. Чаще всего для каждого отдельно взятого блока, предусмотрено индивидуальное оформление.
Для правого сайтбара в шаблоне protostar — один класс (well). Для левого — другой, для других позиций вообще может не быть никакого класса.
По этой причине перемещая модули с одной позиции в другую, могут изменяться и их стили. Например если модуль box1, где мы применяли синий фон, перенести в левую позицию, то все стили исчезнут, и фон будет белым.
Как исправить такую ситуацию?
Для этого в joomla тоже есть «секретная» кнопка, которая находится в тех же дополнительных параметрах в поле «стиль модуля».
В выпадающем списке можно выбрать подходящий вариант. Если в правой позиции был класс well, значит нужно выбрать именно его. В этом случае все стили сохранятся и модуль снова станет синим.
Это далеко не все секреты cms-joomla, которые помогают грамотно и эффективно администрировать систему.
Чаще посещайте рубрику уроки joomla чтобы узнавать о других секретах популярного движка.
