Пишем шаблон для Joomla. Урок 1

16:24 9 нояб. 2015

Пишем шаблон для Joomla.

Joomla — одна из наиболее популярных CMS, тем не менее информации для web-разработчиков в сети не так и много. Одна из проблем с которой стыкаются даже опытные веб-мастера — структура и правила оформления шаблонов меняются от версии к версии. Последней версией движка на момент написания статьи является Joomla 3.4.

И так давайте по порядку разберем как создать шаблон для joomla с нуля. Предполагается, что читатель уже знакомы с HTML, CSS и PHP.

Для начала разберем структуру шаблонов Joomla 3 на примере стандартного. Все шаблоны располагаются в папке templates, однако, кастомные нужно ставить через админ-панель, иначе они не будут отображаться в соответствующем разделе настроек. Возьмем шаблон beez3 и скопируем его в удобное для нас место (например на рабочий стол). На самом деле можно создать все файлы с 0, но я считаю это лишней тратой времени. Да и редактируя существующий код можно много чему научится.

Папка скопирована, теперь давайте посмотрим, что в ней находится

Пишем шаблон для Joomla.

Самый главный файл шаблона - это templateDetails.xml. В нем задаются все настройки шаблоны: название и описание шаблона, авторские права, файлы и папки шаблона, список позиций для модулей и много прочих настроек.

<?xml version="1.0" encoding="utf-8"?>

<!DOCTYPE install PUBLIC "-//Joomla! 2.5//DTD template 1.0//EN" "http://www.joomla.org/xml/dtd/1.6/template-install.dtd">

<extension version="3.1" type="template" client="site">

<name>beez3</name>

<creationDate>25 November 2009</creationDate>

    <author>Angie Radtke</author>

    <authorEmail>a.radtke@derauftritt.de</authorEmail>

    <authorUrl>http://www.der-auftritt.de</authorUrl>

    <copyright>Copyright (C) 2005 - 2014 Open Source Matters, Inc. All rights reserved.</copyright>

    <license>GNU General Public License version 2 or later; see LICENSE.txt</license>

    <version>3.1.0</version>

    <description>TPL_BEEZ3_XML_DESCRIPTION</description>

    <files>

        <folder>css</folder>

        <folder>html</folder>

        <folder>images</folder>

        <folder>javascript</folder>

        <folder>language</folder>

        <filename>index.html</filename>

        <filename>index.php</filename>

        <filename>templateDetails.xml</filename>

        <filename>template_preview.png</filename>

        <filename>template_thumbnail.png</filename>

        <filename>jsstrings.php</filename>

        <filename>favicon.ico</filename>

        <filename>component.php</filename>

        <filename>error.php</filename>

    </files>

...

</extension>

Вот расшифровка некоторых xml-тегов шаблона

  • <name> - имя шаблона
  • <creationDate> - дата создания
  • <author> - имя автора
  • <authorEmail> - email автора
  • <authorUrl> - Адрес сайта автора
  • <copyright> - Копирайт
  • <license> - Лицензия
  • <version> - Версия (Можно указать произвольную версию) 
  • <description> - описание шаблона (выводится в админке)

Прокручиваем вниз и находим блок <positions>

    <positions>

        <position>debug</position>

        <position>position-0</position>

        <position>position-1</position>

        <position>position-2</position>

        <position>position-3</position>

        <position>position-4</position>

        <position>position-5</position>

        <position>position-6</position>

        <position>position-7</position>

        <position>position-8</position>

        <position>position-9</position>

        <position>position-10</position>

        <position>position-11</position>

        <position>position-12</position>

        <position>position-13</position>

        <position>position-14</position>

    </positions>

Удаляем все содержимое positions, а также блоки languages и config. Также удалим папку language и строчку <folder>language</folder>. В итоге у нас должен получится такой вот конфиг.

Как вы уже, наверное, догадались мы создадим очень простой шаблон без модулей, языков конфигов, в следующих статьях мы разберем как все это прописать и управлять настройками шаблона joomla из админки.

<?xml version="1.0" encoding="utf-8"?>

<!DOCTYPE install PUBLIC "-//Joomla! 2.5//DTD template 1.0//EN" "http://www.joomla.org/xml/dtd/1.6/template-install.dtd">

<extension version="3.1" type="template" client="site">

    <name>beez3</name>

    <creationDate>25 November 2009</creationDate>

    <author>Angie Radtke</author>

    <authorEmail>a.radtke@derauftritt.de</authorEmail>

    <authorUrl>http://www.der-auftritt.de</authorUrl>

    <copyright>Copyright (C) 2005 - 2014 Open Source Matters, Inc. All rights reserved.</copyright>

    <license>GNU General Public License version 2 or later; see LICENSE.txt</license>

    <version>3.1.0</version>

    <description>TPL_BEEZ3_XML_DESCRIPTION</description>

    <files>

        <folder>css</folder>

        <folder>html</folder>

        <folder>images</folder>

        <folder>javascript</folder>

        <filename>index.html</filename>

        <filename>index.php</filename>

        <filename>templateDetails.xml</filename>

        <filename>template_preview.png</filename>

        <filename>template_thumbnail.png</filename>

        <filename>jsstrings.php</filename>

        <filename>favicon.ico</filename>

        <filename>component.php</filename>

        <filename>error.php</filename>

    </files>

    <positions>

    </positions>

</extension>

Ну и теперь, чтобы начать все с чистого листа, удалим все содержимое index.php, оставив только:

<?php

defined('_JEXEC') or die();

?>

Папку beez3 в которой мы работает можно переименовать в удобное для вас имя. Теперь шаблон можно установить. Для этого упаковываем его в zip-архив и идем в админку. Там переходим «Расширения» → «Менеджер расширений» → «Загрузить файл пакета» и выбираем наш файл. Перейдя в «Расширения» → «Менеджер шаблонов» можно выбрать наш шаблон, однако пока страницы будут пустыми, так как мы очистили index.php. Дальнейшие действия мы будем проводить с уже установленным шаблоном.


Теги: joomla шаблоны
Категория Web-мастер   |   0 комм.
Нет результатов.