Любой движок создавался с одной целью, облегчить жизнь тем, кто не знает языков программирования. Ну, посудите сами. Сейчас каждый желающий может взять joomla, установить её за пару шагов, после этого скачать один из шаблонов и вот у него уже полноценный сайт. Всё это возможно благодаря структуре самого движка. Разработчики внесли немало усилий для того чтобы сайт можно было собрать из разных частей, как мозаику. Многим для работы недостаточно движка и выбранного шаблона, они дополнительно ставят компоненты, плагины и другие расширения. Всё это к тому, что Joomla как и другие CMS имеет некие правила, благодаря которым мы чётко знаем какие действия к чему приведут, при этом нам не требуются знания HTML, CSS и PHP. С этими правилами приходится считаться и при разработке собственных шаблонов, так как программист вынужден запоминать какой файл, за что отвечает.

Так вот, структура шаблона должна иметь перечень определённых файлов, благодаря которым он будет работать имена на нашем движке, а негде то либо. В них прописываются особые строчки кода, которые помогают движку определить способности шаблона, его владельца и принадлежность к той или иной версии Joomla. Стоит так же упомянуть, что шаблоны для joomla, это скорее визуальное отображение возможностей движка. То есть, сам по себе шаблон мало что умеет, основную работу по сайту всё же выполняет CMS.

Для того чтобы шаблон работал на Joomla 3.5.x он обязан иметь следующее:

img 01

index.php - этот файл как и в случае с html генерирует страницу. Только в php он отвечает за создание практически всех страниц сайта. В нём, как правило, подключают стили и скрипты.
css - здесь хранятся файлы с расширением css, которые определяют внешний вид элементов на сайте. На самом деле эта папка не обязательна для создания, она для удобства.

template.css - находится в папке css и формирует внешний облик страниц. Проще говоря, отвечает за дизайн.

templateDetails.xml - содержит информацию о шаблоне: описание, версия, автор и другое (подробнее ниже по тексту).

Собственно это всё что нужно для того чтобы увидеть главную страницу. Остальное считается не обязательным и предназначено улучшить внешний вид сайта или расширить его возможности.

Так же могут встречаться:

img 02

html - эта папка хранит шаблоны модулей и компонентов.

img или images - как правило используется для системных значков, но и полноценные изображения тоже встречаются.

js или javascript - лежат файлы с расширением js. Могут отвечать за анимацию в дизайне или за выполнение определённых действий.

php - дополнительные файлы с расширением php.

language - файлы локализации. Они нужны для перевода с одного языка на другой.

less -  файлы с расширением less, предназначены для упрощения создания стилей.

error.php - как и index.php генерирует страницу, но отвечает за вывод ошибки.

component.php - макет для страницы печати.

template_preview.png - скриншот шаблона или его привью.

template_thumbnail.png - скриншот шаблона, но маленького размера.

favicon.ico - маленькая иконка, отображается во вкладках браузера.

Это не весь список, встречаются и другие папки с файлами.

Файл templateDetails.xml

Рассмотрим подробней templateDetails.xml, а так же его возможности. Кстати, он обязательно должен иметь именно такое название, с учётом больших и маленьких букв.

img 03

Содержит теги:

extension - здесь Joomla определяет, что это шаблон и для какой версии движка создан.

name - имя шаблона.

version - его версия.

creationDate - дата создания.

author - имя автора.

authorEmail - электронный ящик автора.

copyright - авторские права.

description - описание шаблона.

files - перечень файлов и папок.
- filename - имена файлов (пишутся внутри files).
- folder - имена папок (пишутся внутри files).

positions - позиции под модули. Благодаря этому тегу, есть возможность добавить свои позиции на сайте.

languages - локализация шаблона. Тут находится ссылка на файл с переводом.

config - дополнительные параметры для менеджера шаблонов.

А вот на теге config остановимся, так как всё что заключено в него, предназначено для создания настроек. Вот как выглядят параметры шаблона protostar, их немного:

img 04

Это стандартные типы полей. На самом деле их гораздо больше, сам движок предлагает массу вариантов, а по желанию можно написать свои собственные. Мы рассмотрим примеры создания стандартных полей и вывод их на сайте. Просматривать всё не станем, так как их много и вывод осуществляется по схожему принципу.

Пишем настройки для менеджера шаблонов

Нет не чего сложного в создании настроек, достаточно внимательно изучить код. Вот простой пример вывода логотипа (он есть в стандартном шаблоне protostar):

1. Пишем следующий код между тегами fieldset в файле templateDetails.xml:

XML код:
  1. <field name="logoFile" class="" type="media" default=""
  2. label="Логотип"
  3. description="Загрузить свой логотип для сайта" />

img 05

2. Теперь вставляем это в любое место index.php между тегами body:

PHP код:
  1. <?php if ($this->params->get('logoFile')){
  2. $logo = '<img src="' . JUri::root() . $this->params->get('logoFile') . '"/>';}?>
  3. <?php echo $logo; ?>

img 06

3. Добавляем картинку в менеджере:

img 07

Вот и всё, проверяем на сайте.

Теперь стоит детально рассмотреть код, который использовали в templateDetails.xml:

XML код:
  1. <field name="logoFile" class="" type="media" default=""
  2. label="Логотип"
  3. description="Загрузить свой логотип для сайта" />

name - название поля. На него ссылается код, который вставляли в index.php.

class - класс поля. Здесь можно добавить стили. К примеру, создать анимацию кнопок при помощи CSS3.

type - тип поля. Задаёт тип настроек, в нашем случае это media (открывает каталог файлов).

default - настройка по умолчанию. Тут может быть всё что угодно, в зависимости от того, какой тип поля. Если идёт речь о цвете, то можно написать так: default=”#000”.

label - название в менеджере шаблонов.

description - описание, которое появляется при наведении курсора.

Давайте посмотрим, что же мы написали в index.php:

PHP код:
  1. <?php if ($this->params->get('logoFile')){
  2. $logo = '<img src="' . JUri::root() . $this->params->get('logoFile') . '"/>';}?>
  3. <?php echo $logo; ?>

В первой строчки запрашивается параметр name - название поля, у нас это logoFile (вы можете использовать своё). Если он есть, то во второй строчки формируется ссылка для изображения. Ссылка в свою очередь заключена в переменную $Logo. Третья строка предназначена для того чтобы вывести объект, это делается при помощи echo.

Давайте разберём ещё один пример, но немного сложнее. Создадим два типа поля - первое предназначено для выбора положения (да или нет), а второе это форма, где будем писать текст. То есть у нас появиться radio кнопка, благодаря которой мы сможем выбирать, показывать текст на сайте или нет.

1. Пишем этот код в файл templateDetails.xml:

XML код:
  1. <field name="buttonYesNo" type="radio" default="1"
  2. label="Показать"
  3. description="ДА - показать на сайте, НЕТ - не показывать">
  4. <option value="1">Да</option>
  5. <option value="0">Нет</option>
  6. </field>
  7.  
  8. <field name="buttontextarea" class="" type="textarea" default=""
  9. label="Текст"
  10. description="Напишите текст, который хотите отобразить на сайте." />

Как и в первом случае, вставляем между fieldset.

img 08

radio - это радио кнопка. В нашем случае мы делаем выбор между двумя параметрами value находящиеся в теги option.
class - взяли стандартные стили из движка (btn-group btn-group-yesno).
default - для того чтобы по умолчанию показывать текст на сайте ставим 1.
option - добавляем два значения 1 и 0. Единицы присваиваем имя ДА, нулю НЕТ.
textarea - создаёт область для ввода многострочного текста.

2. В index.php находим удобное место для этого:

PHP код:
  1. <?php if ($this->params->get('buttonYesNo')) : ?>
  2. <?php echo $this->params->get('buttontextarea'); ?>
  3. <?php endif; ?>

img 09

Здесь всё просто, buttontextarea заключен в buttonYesNo. Поэтому buttontextarea отобразиться только в том случае, если buttonYesNo имеет значение 1.

3. Пишем текст в менеджере, сохраняем и смотрим, что получилось на сайте:

img 10

Список всех стандартных типов полей можно найти на официальном сайте joomla: https://docs.joomla.org/Standard_form_field_types


 
4.5 1 1 1 1 1 (Оценок: 234)
4.5 234
Опубликовано: 10-06-2016

Вы не зарегистрированы, чтобы оставлять комментарии.