Не все страницы вашего сайта на Joomla могут иметь одинаковый дизайн и выглядеть одинаково. Некоторые сайты имеют радикально различные цветовые схемы и расположение основных блоков для различных разделов сайта. И Joomla позволяет вам делать это.
В этом уроке мы покажем вам, как использовать различные шаблоны или различные стили одного и того же шаблона, для различных разделов вашего сайта на Joomla.
Шаг 1: Общая информация о шаблонах в Joomla
Joomla имеет три основных шаблона предустановленных по умолчанию: Atomic, Beez5 и Beez2.
Эти три шаблона отмечены как «Site» в столбце «Location» и предназначены для публичной части сайта. Шаблоны Bluestork и Hathor помечены как «Administrator» и предназначены только для админки. Вы можете также установить другие шаблоны сторонних разработчиков или разработать или создать свой собственный шаблон.
Один из шаблонов всегда отмечен как используемый по умолчанию для внешнего сайта и один для админки. Чтобы узнать, какой из них используется по умолчанию, найдите золотую звездочку в колонке «По умолчанию», как показано на рисунке ниже:
Вы можете изменить шаблон по умолчанию в любой момент, просто нажав на одну из пустых звездочек, и тогда она станет золотой, а соответствующий шаблон используемым по умолчанию.
При первой установке Joomla по умолчанию устанавливается шаблон Beez2. Если нажать на название шаблона, вы можете редактировать настройки шаблона.
Как вы можете видеть в этом примере, этот шаблон используется по умолчанию для всех страниц и не требует установки его для каждого пункта меню..
Шаг 2. Вывод различных шаблонов на разных страницах
Давайте взглянем на настройки других шаблонов и посмотрим, как назначить его для определенной категории.
- Откройте Менеджер шаблонов
- Отметьте шаблон Beez5.
- Нажмите кнопку Изменить.
- CMS устанавливает различные шаблоны на разных страницах, основываясь исключительно на ссылках меню. Перейдите в раздел «Привязка к меню», и вы можете выбрать, для каких ссылок меню этот шаблон будет использоваться.
- Для пункта «По умолчанию» установлено значение «Нет», потому что у нас уже установлен другой шаблон по умолчанию.
- Отметьте флажок напротив нужного пункта меню.
- Сохраните эту привязку к меню, а затем проверьте ваш сайт.
- После сохранения вы увидите, что у вас есть шаблон Beez_20, установленный по умолчанию.
- А шаблон Beez5 назначен (Assigned) на отдельный пункт меню и обозначен зеленой галочкой.
Вот так главная страница выглядит с шаблоном по умолчанию — Beez2:
А вот так выглядит категория на которую назначили шаблон Beez5:
Стоит напомнить вам, что изменение шаблона не влияет на содержание. Тем не менее, это изменит заголовок, логотип, оформление и позиции модулей. Это означает, что вы не можете просто сменить шаблон, не проделав некоторую дополнительную работу.
Вам нужно будет изменить логотип для обоих шаблонов и позиции модулей в соответствии с вашей общей структурой сайта.
Шаг 3. Объяснение различных позиций модулей в разных шаблонах
Позиции модулей Beez5 (вверху) и Beez2 (ниже) почти одинаковы, так что это не вызовет больших проблем при изменении дизайна. Однако есть и различия.
Одним из наиболее очевидных различий между двумя шаблонами является позиция модулей вокруг логотипа. В Beez5 модули position-1 и position-0 находятся ниже логотипа:
В Beez 2 модуль position-0 находится над логотипом, а position-1 — ниже:
Это довольно незначительное различие, но хороший пример того, как шаблоны могут отличаться по своим позициям модулей. В данном случае это довольно простой пример, потому что все модули имеют одинаковые имена.
Но что делать, если позиции модулей совершенно разные, в разных местах под разными именами?
- Вернитесь в Менеджер шаблонов и привяжите шаблон Atomic к другой категории.
- Вы увидите, что он имеет совершенно другие позиции модулей, их вы можете посмотреть на картинке ниже:
На этой странице имеются только следующие позиции модулей:
- atomic-topmenu
- atomic-topquote
- atomic-search
- atomic-sidebar
- atomic-bottomleft
- atomic-bottommiddle
Если вы хотите, чтобы этот шаблон был на вашем сайте, в дополнение к Beez2, то вы должны проделать больше работы.
Шаг 4. Добавляем модуль меню для нового шаблона
- Выбираем в меню Расширения > Менеджер модулей и жмем кнопку Создать.
- Выбираем Меню.
- Привязываем новый модуль к позиции atomic-sidebar.
- Новая функция в Joomla 2.5 — поле Примечание. Это поможет вам не запутаться в модулях, при большом их количестве.
- Теперь мы привязываем модуль к определенным страницам.
- Выбираем «Только на выбранных страницах».
- Устанавливаем флажок рядом с пунктом меню, который вам нужен.
- Теперь у меня меню находится в боковой панели. Вы можете видеть, что это горизонтальное меню и места для него там маловато. Мы должны попробовать найти для него лучшую позицию.
- Перейдите в Менеджер модулей и переместите меню в позицию atomic-topmenu. Теперь меню должно выглядеть как на картинке ниже:
Я привел этот пример просто для иллюстрации того, с какого рода проблемами вы можете столкнуться, когда начинаете добавление шаблонов без предварительного исследования.
Вы так же можете использовать копию имеющегося у вас шаблона в качестве темы для альтернативного раздела или страницы. Большим преимуществом является то, что все будет в одном месте, и вам нужно внести только необходимые изменения с CSS и это позволит избежать серьезных переделываний.
Шаг 5. Стили шаблона vs Различные шаблоны
Вместо того, чтобы использовать совершенно разные шаблоны для разных страниц на вашем сайте, можно просто создать различные варианты вашего шаблона по умолчанию. Это новая возможность в Joomla 2.5. Она позволяет создавать различные варианты дизайна на каждой странице без необходимости проходить все шаги, что мы изложили выше.
- Переходим в Менеджер шаблонов.
- Установите флажок рядом с шаблоном, для которого вы хотите создать копию. В данном случае мы будем использовать Beez2.
- Нажмите на иконку «Дублировать».
- Установите флажок рядом с Beez2-Default (2).
- Нажмите кнопку «Изменить».
- Beez2 поставляется с двумя цветовыми схемами, Personal и Nature. Выберите Nature из выпадающего списка.
- Привяжите шаблон к категории в секции «Привязка к меню».
- Обратите внимание, что там есть и другие опции, вы можете изменить также логотип, название сайта, и положение навигации.
- Теперь у вас есть один сайт с двумя разными стилями одного шаблона, привязанными к различным пунктам меню.
- Вы также можете привязывать шаблон при создании пунктов меню.
- Когда вы находитесь в Менеджере меню, можно установить понравившийся вариант шаблона для этого пункта меню (см. ниже).
