
Большинство элементов в Joomla, публикуемых на сайте, отображаются с помощью модулей. Чтобы хорошо владеть управлением дизайном в Joomla, нужно знать, как правильно выводить модули, настраивать и редактировать. Об этом и пойдет речь в сегодняшней статье.
Содержание
Управление модулями Joomla
Управлять модулями можно через менеджер модулей (Расширения->Менеджер модулей).
При нажатии на ссылку с именем модуля, в левой половине отобразятся настройки, одинаковые для всех модулей, а именно:
Заголовок - такое название будет у модуля в менеджере и на сайте;
Показать заголовок - показывать или скрывать заголовок при отображении модуля на сайте;
Включен - будет или не будет модуль отображаться;
Позиция - место на сайте, в котором будет отображаться модуль. У каждого шаблона по умолчанию задано несколько мест, в которых может отображаться модуль. Посмотреть их можно по адресу http://сайт.ru//?tp=1 . По такой ссылке будет показана главная страница сайта с позициями всех модулей. Таким образом можно сориентироваться в том, какой из них куда лучше вывести. У тебя может возникнуть вопрос: а как показать модуль в другом месте, не предусмотренном в шаблоне? Для этого придется произвести в нем (шаблоне) некоторые изменения. Делается это в три простых шага:
1) При помощи Firebug'а найти место в коде, куда бы ты хотел вставить модуль;
2) Открыть шаблон через редактирование HTML и найти код типа:
Например, код для отображения левой колонки сайта обычно выглядит так:
<?php if ($this->countModules('left')): ?>
<jdoc:include type="modules" name="left" style="xhtml" />
<?php endif; ?>
В разных шаблонах возможны отличия в коде (элементы html, стили и др.). Название позиции может быть любым. Можешь придумать его сам. В дальнейшем, для отображения модуля в такой позиции, нужно в пункте Позиция не выбирать название из выпадающего списка, а вписать нужное.
3) Скопировать код из пункта 2. Вписать название позиции и вставить в место из пункта 1.
Готово. Теперь ты можешь выводить модули там, где тебе захочется.
Сортировка - Если несколько модулей выводятся в одной позиции (например, в левой колонке), то при помощи этого пункта можно установить порядок их вывода;
Доступ - указывает, какие пользователи будут видеть модуль, а какие нет (Все - все пользователи; Registred - только заргистрированные; Специальный - особые группы пользователей Joomla);
Меню - здесь можно выбрать пункты различных меню, в которых требуется отображать модуль и в которых - нет.
В правой половине окна отображаются настройки, определяемые самим модулем, а также кэширование и суффикс класса модуля.
Кэширование - способ уменьшения нагрузки на сервер, создаваемой сайтом. Если ты помнишь, страницы сайта генерируются «на лету». Такая генерация требует затраты некоторых ресурсов сервера (также, как если запускаешь программу, увеличивается объем потребляемой оперативной памяти и загрузка ЦП). Если генерируемые страницы содержат большое количество различных модулей и материалов, то их генерация может занимать достаточно продолжительное время (несколько секунд каждая) и создавать большую нагрузку на сервер. Чтобы этого не происходило, предлагается страницы, которые запрашивают чаще всего, не генерировать каждый раз заново, а сохранять и выдавать пользователям уже в готовом виде. Правда у такого подхода есть два недостатка:
1) пользователям выдается страница, сознанная не при их запросе, а раньше, и, значит, возможно, содержащая устаревшую информацию;
2) При большом количестве кэшируемых страниц, объем занимаемого ими места на диске может быть велик.
Второй недостаток сегодня не критичен, зато с первым проблема.
В настройках кэширования задается время хранения кэша. Это время, в течение которого пользователям будет выдаваться устаревшая страница, и через которое произойдет ее новая генерация (при новом запросе). Если посещаемость сайта не большая или он содержит часто обновляемую информацию (например, доска объявления, форум), а также на этапе разработки сайта, кэширование включать не следует. Оно эффективно только при большой посещаемости, т.к. сокращает количество генерируемых страниц в единицу времени. В настройках модуля указано кэширование, применяемое не к странице, а именно к модулю, что очень удобно, поскольку модули со статической информацией можно кэшировать, а с динамической - нет.
Суффикс класса модуля - очень интересная настройка, но ориентированная на продвинутых web-мастеров, знакомых с CSS. По умолчанию все модули сайта выводятся в одном или нескольких стилях. Но кому-то хочется вывести один модуль, в одном оформлении, а другой в другом. Для того чтобы создавать множество стилей оформления модулей и легко применять их используется суффикс класса модуля. Он применяется так:
1) В таблице стилей (CSS) находим все элементы, относящиеся к оформлению модулей (можно посмотреть через Firebug), например, такие:
div.moduletable,
div.moduletable_menu,
div.moduletable_text {
padding: 0 0 20px; margin-bottom: 15px; background: url(/../images/hdot.gif) repeat-x bottom;
}
div.moduletable h3,
div.moduletable_menu h3,
div.moduletable_text h3 {
padding: 0 0 8px; margin: 0; color: #7BA566; font-size: 125%; font-weight: bold; text-transform: uppercase;
}
2) Копируем их и вставляем с добавлением какой-либо приставки (у меня «-1»), при этом меняя стили для требуемого оформления модуля:
div.moduletable-1,
div.moduletable_menu-1,
div.moduletable_text-1 {
padding: 0 0 50px; margin-bottom: 5px; background: red;
}
div.moduletable-1 h3,
div.moduletable_menu-1 h3,
div.moduletable_text-1 h3 {
padding: 0 0 98px; margin: 0; color: #666666; font-size: 125%; font-weight: bold; text-transform: uppercase;
}
3) Теперь при указании в поле Суффикс класса модуля «-1» (без кавычек), к данному модулю применится альтернативный стиль, созданный в пункте 2.
Ну вот и все о модулях. Настраивай, публикуй, экспериментируй. И не забывай про эргономику. Главное, не красота сайта, а удобство его использования.
Давно ищу что-нибудь подобное из теории..
Чаще всего один сумбур или "кликни тут -получишь вот это..."
Устроители сайта Wedal пошли самым мудрым путём..
Постоянно читаю ваш сайт: всё становится понятно шаг за шагом по мере... "познания логики работы Джумлы на примере собственного шаблона". Шаблон подобрал удачно - по позициям модулей, но столкнулся с небольшой нелепостью в навигации шаблона: Зачем-то производитель "связал" горизонтальное и вертикальное меню - получилось дублирование одних и тех же ссылок. Когда заменял контент шаблона на собственный, и менял названия пунктов меню - то изменения происходили одновременно и в горизонтальном и в вертикальном (в админке Джумлы указано только одно меню с этим названием).
Как сделать так чтобы это были 2 разных независимых меню? Если напрямую ничем помочь нельзя, то хотябы с чего начать поиск ответа на этот вопрос?
В менеджере модулей скопироал главное меню (на отображении вебсайта получилось 2 одинаковых), затем существовавшее отключил, и включил копию - стало выглядеть как надо. Осталось переименовать пункты меню, но в менеджере модулей этого не делается. Пошел в менеджер меню, но в разделе "все меню" нового созданного меню не оказалось - облом.
Пошел другим способом: В менеджере меню создал новое, скопировав исходное. Там назвния пунктов меню меняется (и это не отразилось на вертикальной навигации - как я и задумывал!!), но: на веб странице этоновое меню не отобразилось, так как оно не появилось в расширениях в менеджере модулей.
Как сделать новое меню - копию старого, и чтобы оно появилось в модулях? Или я иду не в том направлении?
Работа с меню Joomla устроена таким образом, что за создание и за отображение созданного меню отвечают совершенно разные части Joomla.
Создать и сконфигурировать меню можно через менеджер меню, а вывести на сайт с помощью соответствующего модуля в менеджере модулей. Это, я думаю, вы и так уже поняли.
Но, для каждого созданного меню должен существовать соответствующий модуль меню. Он создается при создании нового меню. Т.е. не нужно копировать существующее меню. Нужно создавать новое. Также можно взять любой из существующих модулей для отображения меню, при этом в его настройках есть опция в которой можно выбрать (из выпадающего списка) какое именно меню он должен отображать.
То, что было сделано в шаблоне, который вы описали, сделано просто для экономии времени. Разработчики ведь просто показывают как выглядит горизонтальное и вертикальное меню. Они создали только одно меню и два модуля, в которых указали выводить это меню в разных позициях.
У вас же, еще раз повторюсь, должно быть 2 разных меню и 2 разных модуля - первый модуль настроен на отображение первого меню, второй - второго.
В менеджере модуля в списке "назначение меню, выбрать из списка" - выбрал своё долгожданное меню. Сохранил изменения, обновил страницу сайта, но почему-то модуль вообще изчез со страницы!! (хотя модуль точно "включён" в менджере модулей)
Не понимаю ситуацию. Хелп!
первое, почему внешний вид нового модуля не соответствовал: модули характеризуются многими настройками, для модулей меню эти настройки сильно могут влиять на внешний вид. В особенности отображение вложенных подпунктов, тип отображения меню и CSS-суффикс модуля и меню. Просто откройте настройки обоих модулей и заполните их в новом по аналогии со старым, тогда все будет отображаться правильно.
Второе, почему исчез модуль - честно говоря, не видя админки сайта, ответить на этот вопрос весьма сложно. Причин может быть много. Может вы не опубликовали модуль, может не создали пункты в новом меню и не опубликовали их, и.т.д.
а вместо этого я выбирал в поле "назначение мею" - ставя флажек в точке "выбрать из списка"... поэтому ничего не получалось.
Но сейчас работает
Это стало понятно, когда я наконец залез через админку в менеджер шаблона. Там есть поле "параметры" (шаблона). Очевидно они специфичны для каждого шаблона. Для моего были доступны опции:
1. Размер шрифта -
2. Цветовая навигация - !!!
3. Отображать инструмент шаблона - !!!
4. Модуль меню
5. Тип меню
Восклицательные знаки я поставил, так как в данном моём комменте о них в основном идёт речь. Первые 2 позиции входят в "инструмент шаблона" (позиция 3), который в моём шаблоне можно либо отображать, либо не отображать. Если отобразить, то появляется модуль из 6-ти опций в верхнем правом углу моего шаблона (я бы добавил скриншот, но видимо тут нельзя). Среди этих опций - 3 варианта цвета и 3 варианта шрифта. Я очень хочу отредактировать функционал этого инструмента: цвета мне не нужны. Вместо этого я хочу 3 выбора языка контента, а размер шрифта - скрыть (сделать 3 опции вместо 6-ти - хотя это не принципиально).
Как это сделать? (можно ли соответственно завязать этот инструмент с иноязычным контентом, либо всё-же нужно качать специальный компонент и его модуль?).
Если это дополнительный модуль, то как его вставить на то место, где установлен "ненужный" мне описываемый инструмент шаблона?
Возможно в этом поможет файербаг. Я скачал ФФ и ФБ как вы советовали и это реально помогло пониманию кода. Я нашел в коде то самое место. Код описывает видимо действие каждой опции модуля через: alt= "blue" (для первой из 6-ти опций, и в результате цветовая гамма шаблона – голубая). Может просто нужно будет заменить "blue" на "english" и создать какую-нибудь директорию в папках шаблона куда будет ссылаться код?
В дополнение скажу что пункты 4, 5 из списка – оказалось элементы редактирования того самого модуля горизонтального меню, который дублировался с вертикальным - как описывалось м моих предыдущих комментах. Именно тут (в менеджере шаблона!!!) для данного модуля указывалось, какое именно меню там отображать.
Таким образом, у некоторых шаблонов есть некоторые личные модули, которые не поддаются стандартному редактированию через возможности Джумлы? или я чего-то не пойму?
Также попадаются в шаблонах скрипты, отображающие меню в каком-либо месте, используя структуру главного меню Joomla. Т.е. как раз то, о чем вы писали. Получается вроде бы и модуль не выводишь, а меню все равно появляется. Это очень противная штука, путающая начинающих веб-мастеров. Вот вы сколько времени потеряли, пока поняли то к чему. И другие потеряют столько же, а может вообще плюнут на это дело и уйдут на другой движок под предлогом того, что Joomla слишком сложна, хотя дело не в Joomla, а в слишком "крутом" шаблоне.
Резюме: использовать такие шаблоны для серьезных проектов стоит только тогда, когда хорошо знаешь PHP. В остальных случаях лучше брать простые шаблоны и постепенно надстраивать их.
Видимо я слишком много написал в предыдущем комменте и главный вопрос осталя незамеченным :)
И всё-таки: как мне настроить шаблон так, чтобы он был на разных языках?
Спасибо, компонент скачал, установил, даже русифицировал (точнее всё-таки нашел русскую версию где-то). Нашел в нём как создаются переводы, и перевёл одну статью. Но непонятно как отобразить перевод сайта. Я ожидал что для всего сайта появится 2 кнопки: русский флаг и британский флаг - чтобы нажать на один, и заработают все статьи на русском, нажать на другой - все статьи будут отображать английский перевод... но где этот модуль с флагами и как его отобразить - непонятно. Подскажите пожалуйста.
Я хочу создать для своего шаблона позицию. В ваших примерах как работать с шаблоном вы объясняете как изменить шаблон неджумла для шаблона джумла. Можете ли вы подсказать порядок действий именно для случая видоизменения шаблона джумла - добовления новой позиции. В каком css файле (или html файле) сделать изменения? Я готов изучать HTML и CSS, но не зачем это делать с азов - можно учиться именно на решении конкретных задач. Подскажите какой именно раздел нужно изучить чтобы добавить новую позицию в шаблоне джумла.
Для решения проблемы мне на помощь пришел фаербаг. С его помощью я:
1. нашел место в коде, где было меню джумфиша с флагами, скапировал его код,
2. нашел то место в коде куда я хотел вставить эти флаги и вставил их в код нужного модуля
3. всё заработало: флаги на нужном месте, и являются рабочими ссылками.
Но тут есть НО:
1. Редактор файербага - видимо служит для демонстрации, и все изменения в коде не сохраняются. Подскажите пожалуйста: может всё дело в настройках файербага и с его помощью всё-же можно будет сохранять изменения в шаблоне?
2. Если редактор фаейрбага - только для демонстрации, то как найти то самое место в коде вручную? Я пробовал пользоваться поиском фрагмета кода в файлах в директории локалхоста, но там файлов нет - видимо всё в базе данных... - подскажите как редактировать CSS или HTML код вручную: надо всего лишь добавить несколько абзацев, но где это самое место?
1. Обнаружил с помощью него такую штуку в шаблоне как "clearfix" класс модуля (position:absolute) - он был определён в моём шаблоне для того самого "инструмента шаблона" (позиция 3) - о котором я писал выше.
2. Обнаружил что этот "инструмент" вписан в разделе тегов "BEGIN HEADER" файла template.css.
3. Просто предположил что туда же надо вписать и модуль Джумфиша, с тем же clearfix параметром (position: absolute)
4. Фаербагом нашел модуль джумфиша - он оказался тоже в CSS файле, но в директории специально для модулей (в дереве папок своего сайта, но в директории не "templates"-> мой шаблон, а "modules"-> джумламодуль)
5. Скопировал название модуля, и вставил его вслед за модулем "инструмента" - в разделе тегов "BEGIN HEADER" файла template.css, получилась такая штука:
#jv-tools {
position: absolute;
top: 4px;
right: 0;
}
#jflanguageselection {
position: absolute;
top: 4px;
right: 0;
}
- гда первые 5 строчек - то что было, а вторые 5 строчек - то что я создал по аналогии.
6. ...и О ЧУДО!!! всё заработало - модуль на нужном месте.
Я это пишу к тому что:
Люди!!! Совершенно реально получить положительный результат, самостоятельно меняя CSS и HTML код совершенно не зная его языка его описания - главное понять некую логику описания кода для самого частного случая, над которым вы ломаете голову - и всё получится. У меня получилось - хотя CSS и HTML я абсолютно не знаю. Для этого надо: в левой руке файербаг, в правой - папка вашего сайта - где все css файлы расположены в подпапках тех "джумла-кирпичиков" (как выражался автор этого чудесного сайта), которые вы меняете (если меняете модуль - значит ищите ваш CSS файл в директории "modules", если шаблон - значит в директории "templates" - вот она - логика джумлы в "раскладывании" элементов по полочкам.
Далее, что касается кирпичиков. Не всегда все именно так, но в целом правильно. Подробнее почитать и изучить можно в серии про создание шаблона Joomla. После ее изучения работать с CMS станет гораздо проще. Это 100%.
У меня вопрос по дизайну внешнего вида модулей, например модуля меню.
Часто, чтобы красиво оформить внешней вид меню, сделать красивые закругления, сверху и по бокам, необходимо вставить модуль меню в ячейку таблицы. А в соседние ячейки таблицы, можно вставлять нужные изображения, и др. элементы дизайна .
Например, я использовал модуль меню SWmenu Pro, затем хотел доработать его внешний вид, вставить модуль меню в ячейку таблицы, но возникла проблема, с обнаружением места нахождения кода который нужно вставить в эту ячейку.
В связи с этим у меня два вопроса :
1.Где искать этот код модуля, в каком файле и как он выглядит?
2. Как правильно вставить нужный модуль, в ячейку таблицы?
Я для поиска стороннего модуля меню использовал фаербаг, через него видно все, что нужно поменять, но физически найти эти файлы не удалось, для поиска использовал даже Total Commandr , через поиск весь локальный сайт обшарил.
Странная ситуация, глазами нужный код через фаербаг видишь, а физически найти его не можешь.
Помогите пож. разобраться в этоми вопросами, чтобы даже новичку было понятно, как и что делать.
А вообще, забудьте вы уже про закругление картинками. На дворе 21 век. Используйте CSS3 для скругления. А для ослов-динозавров CSS PIE, например.
Модуль удалось загнать в закругленную рамку,
с помощью задания следующего стиля :
.module.roundblock{border: 1px solid;
border-radius: 8px 8px 8px 8px;
border-color:#C6C6C6; !important;}
А у таблицы таким образом скруглить углы не получается,
Хотя делал все по той же схеме, вот стиль :
.roundblock {border: 1px solid; border-radius: 8px 8px 8px 8px;
border-color:#C6C6C6; !important;}
Помогите пожалуйста разобраться со скруглением таблиц,
очень нужно.