Пятница, 24 Февраль 2012 02:05

Создаем шаблон для позиции модуля в Joomla 1.5—2.5

Оцените материал
(11 голосов)

В статье о создании шаблона я упомянул о стилях позиций модулей для джумлы. Хотя я и настаиваю на том, что это роскошь для joomla-сайтов, все же замолвлю словечко, поскольку, в тех случаях, когда макет для верстки предоставляется заказчиком, порой невозможно сверстать шаблон со стопроцентным совпадением дизайна без лишения девственности стилей позиций модулей. Пример нестандартной стилизации:

Если бы все браузеры, которыми пользуется интернет-аудитория стран СНГ и Балтии поддерживали в полной мере CSS3, нам бы хватило и обычного стиля xhtml для осуществления такого блока. Но в суровой постсоветской реальности все совсем наоборот. Посетители коммерческих сайтов зачастую выходят в интернет с офисных компьютеров, на которых в крайне редких случаях стоит лиса. Общая статистика, которую я веду лично, показывает, что у не менее 10% посетителей даже нет флэш-плеера или отключено исполнение java-скриптов, а подавляющее большинство заходов из IE7 (ура), на втором месте IE6 (наконец-то он стал на второе место), далее восьмой и девятый. То есть, ни о каком CSS3, флэше и скриптах речи быть не может. CSS2+PNG (GIF, JPG) — золотое правило для коммерческого сайта расчитанного на аудиторию с преимущественной возрастной группой старше 30 лет.

Теперь, когда вы осознали все минусы инноваций в постсоветском пространстве, давайте попробуем разделить наш блок на максимально простые составляющие, структура которых не выходила бы за рамки CSS2:

 

Как видите, весь блок состоит всего из трех частей, которые, в свою очередь, украшены бекграундами состоящими из картинок. На всякий случай, на картинке я написал еще и классы, которые буду использовать в демо-коде. Чтобы все стало совсем понятно. Стиль позиции модуля назовем абстрактно shit.

На следующем этапе, вам нужно в CSS-файлах шаблона написать стили для этих классов модулей. Я же на этом этапе заострять внимание не буду, а перейду сразу к следующему.

Вам нужно открыть папку templates/system, скопировать оттуда папку html, вставить ее в корневую папку своего шаблона и открыть в редакторе файл modules.php, который лежит, как вы догадались, именно в только что скопипастеной папке. Есть еще один вариант. Не копируйте папку, вносите правки в системном шаблоне. Все будет хорошо :)

Далее смотрим структуру файла, находим в нем закономерности, закрываем эту страницу и дальше все делаем самостоятельно. Шутка. Обратите внимание на функции которые начинаются на modChrome. Это и есть начало кода стилизации позиций модулей. Для стиля xhtml это будет выглядеть как modChrome_xhtml. Я хочу сказать, что название стиля задается после нижней черты. Итак, напомню, что стиль наш называется shit. Вставляем где-нибудь в этом файле (можно в самом верху, после defined('_JEXEC') or die;):

Показать/скрыть php код

Посмотреть код
  1. function modChrome_shit($module, &$params, &$attribs) 
  2. {
  3.     if (!empty ($module->content)) : ?>
  4. <div class="mod_header<?php echo htmlspecialchars($params->get('moduleclass_sfx')); ?>"><?php if ($module->showtitle != 0) : ?><?php echo $module->title; ?><?php endif; ?></div>
  5. <div class="mod_body<?php echo htmlspecialchars($params->get('moduleclass_sfx')); ?>"><?php echo $module->content; ?></div>
  6. <div class="mod_footer<?php echo htmlspecialchars($params->get('moduleclass_sfx')); ?>"></div>
  7. <?php endif;
  8. }
 

Попробуем понять что мы сделали. 

  • modChrome_shit — задали название стиля.
  • <?php echo htmlspecialchars($params->get('moduleclass_sfx')); ?> — дали возможность добавлять к нашему классу суффикс.
  • <?php if ($module->showtitle != 0) : ?><?php echo $module->title; ?><?php endif; ?> — заставили показывать или не показывать заголовок в зависимости от настроек модуля.
  • <?php echo $module->content; ?> — вывели содержимое модуля.

Теперь сохраните файл и протестируйте позицию на сайте. Все должно работать. Чтобы внедрить позицию в шаблон, достаточно вставить в нужном месте <jdoc:include type="modules" name="position" style="shit" />.

Спасибо за внимание. 

Прочитано 21983 раз
Твитнуть

Комментарии   

 
Claudio
0 #6 Claudio 04.02.2015 06:55
Vraiment sympa ce site, je trouve votre approche vraiment
intéressante, Bravo pour la rédaction. je partage le lien de suite Pauline de [url= http://www.securiclic.com] expert comptable

My web page ... tarif expert comptable: http://www.sanef-saba.fr
Цитировать
 
 
snusnumrik
0 #5 snusnumrik 11.06.2013 01:19
style= shit --оригинально )
Цитировать
 
 
Сережка
0 #4 Сережка 29.08.2012 01:01
Ещё думал блин, почему хром выдает дивы модулей, а через CSS к ним не пробиться. только потом доехал, что включения в файле генерации модулей нет :lol:
Цитировать
 
 
Сережка
+1 #3 Сережка 29.08.2012 00:59
Спасибо большое, Артем. Очень полезно. Въехал не с 1 раза, потом осознал и уже через историю искал эту статейку. просто бесценно в ситуации с дармоедами горе-дизайнерам и. выдают чудо - верстай как хочешь :D
Цитировать
 
 
Артем
+4 #2 Артем 22.05.2012 12:00
Спасибо. На счет лексики — ничего обещать не буду.
Цитировать
 
 
Burbulis
+10 #1 Burbulis 22.05.2012 09:15
Из всего, что я читал о создании шаблонов под Джумлу, это - лучшее. Автору - спасибо. С одним пожеланием - не надо засорять текст словами "жопа", "насрать" и прочее. И без этого все понятно. :lol:
Цитировать
 

Добавить комментарий

Защитный код
Обновить

joomla 1.7

Не получаются доработки?

Становитесь партнером студии Millor! Быстро и недорого эти ребята помогут решить практически любую проблему.

Хотите подзаработать?

Если да, то вам сюда! Партнерская программа студии MyWebSite. Получи 20% за каждого клиента! Работаем по всей России и СНГ!

Рекламное место свободно.