Универсальный шаблон для Zoo (beta)

Очень гибкое и функциональное бесплатное приложение для Zoo 2 CCK

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

• можно переопределить вывод практически любой его части.
• учтены возможности кэширования
• есть всевозможные настройки шаблонов и приложения в целом
• ... и много интересных вкусностей в одном флаконе ;)

А теперь обо всем по подробнее...

Те кто знаком с Zoo не понаслышке, знают что это довольно гибкий и мощный компонент, который в принципе может собой заменить стандартный com_content (Менеджер материалов), различные CCK, каталоги и даже чуть-чуть форум (самую малость).

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

И так, по порядку, чем я руководствовался при разработке JBUniversal App Zoo

1. Никаких лишний файлов

Удалены css, js, картинки и прочий мусор, который в реальном проекте будет только мешать.

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

2. Включены всевозможные файлы шаблонов

Сюда входят лейауты категорий, анонсов, feed, главная страница, комментарии, отправка материалов, буквенный индекс и прочее, прочее...

3. Всевозможные настройки шаблонов

Подсмотрел из разных приложений от http://www.yootheme.com/ настройки и собрал лучшие моменты в своем универсальном шаблоне. Сюда вошли такие моменты как деление элементов по столбцам, их порядок. Подкатегории, элементы подкатегорий, количество элементов категории и прочее...

4. Больше гибкости и минимум затрат при разработке

Все очень просто. По умолчанию все выводится с помощью шаблонов _dafault.php. А вдруг нам нужно чтобы лейаут определенной категории был индивидуальный? Тогда просто подсовываем в нужное место файл с названием, в котором фигурирует псевдоним этой категории. Автоматически будет подхватываться именно он. Подробнее этот процесс описывается ниже.

5. Ускорение за счет динамического кэширования

Практически каждый блок кэшируется по отдельности, что приводит к очень быстрой загрузке сайта в целом. Природа тормозов Zoo кроется в способе хранения данных и обработке их перед выводом. Все хранится в xml (паника!). Но с верным подходом к этому вопросу можно все ускорить в разы.

Да, это добавляет гибкости, но и изрядную долю тормозов. Например главная страниц Joomla-book.ru генерируется около 2 секунд, а при правильном кэшировании всего то 0.15 сек, поэтому сайт летает ;)

В моем универсальном приложении для Zoo каждый лейаут кэшируется отдельно, при этом кеш будет автоматически сброшен при изменении контента (автообновление пока работает не для всего). В итоге скорость работы увеличиваем в 2-5 раз, в зависимости от сложности сайта.

6. Шаблоны можно переопределять вручную

В панели управления предусмотрена возможность определять шаблон явно, отключая автоматический выбор.

7. Множество классов CSS

Для того чтобы меньше пришлось менять HTML, все контейнеры имеют различные классы, таким образом можно легко решать большинство задач верстки, только меняя файлы стилей.

8. Встроенный профайлер

В режиме отладки, будет сразу видно какой момент наиболее узкий в плане производительности.

9. SEO-frendly

Продвижение штука важная, поэтому не забываем о нужных опциях (мета, заголовки, ...)

10. Мало кода и по делу

Плохо когда программа сильно "расплывается", в исходниках проглядываются "не коробочные функции", большие условия, switch... Попытаемся написать все кратко, лаконично и полностью полагаясь на богатство Zoo API.

Структура файлов приложения?

Рассмотрим структуру приложения

• config/ - дополнительные настройки приложения
  • alphaindex.xml - алфавитный индекс
  • comments.xml - настройки комментариев
• elements/ - собственные элементы приложения
• language/ - файлы локализаций
  • en-GB
  • ru-RU
• joomla/ - системные файлы 
• templates/ - шаблоны приложения
  • default/
    • renderer/ - лейауты приложения
      • category/ - инфо категории
      • frontpage/ - инфо титульной страницы
      • item/ - элемент
        • news/ - лейауты элемента для определенного типа "news"
          • - //-
        • page/
          • - // -
        • feed.php - лейаут для RSS и ATOM
        • full.php - детальная информация элемента
        • metadata.xml - мета-инфо о лейаутах элемента
        • positions.config - файл хранения настроек (создается самим Zoo)
        • positions.xml - название позиций в  лейаутах элемента
        • related.php - лейаут связанных элементов
        • subcategory_item.php - лейаут элемента подкатегории
        • submission.php - лейаут редактирования/добавления элемента
      • item_columns/ - колонки элементов
      • items/ - список элементов
      • subcategories/ - подкатегории
      • subcayegory/ - подкатегория
      • subcategory_columns/ - колонки подкатегорий
      • tag/ - шаблон тега
    • __layout_columns.php - логика деления на колонки
    • __layout_include.php - логика подключения шаблона
    • _administration.php - шаблон администрирования
    • _alphaindex.php - шаблон для буквенного индекса
    • _category.php - категория
    • _comment.php - комментарий
    • _comments.php - комментарии
    • _frontpage.php - титульная страница
    • _item.php - элемент
    • _item_columns.php - колонка
    • _items.php - список элементов
    • _mysubmissions.php - подачи материалов пользователя
    • _pagination.php - постраничная навигация
    • _respond.php - форма комментирования
    • _subcategories.php - подкатегории
    • _subcategory.php - подкатегория
    • _subcategory_columns.php - колонки подкатегорий
    • _submission.php -подача материала
    • _tag.php - шаблона тега
    • alphaindex.php - шаблон буквенного индекса
    • category.php - категория (точка входа)
    • frontpage.php - титульная страница (точка входа)
    • item.php - элемент (точка входа)
    • mail.comment.admin.php - текст письма админу при новом комментарии
    • mail.comment.reply.php - текст письма пользователю при ответе на его комментарий
    • mail.submission.new.php - текст письма админу при новой подаче
    • mysubmissions.php - подачи пользователя (точка входа)
    • submission.php - шаблон одной подачи (точка входа)
    • tag.php - элементы по определенному тегу(точка входа)
    • template.xml - мета-инфо и настройки шаблона default.xml в приложении
• types/ - типы элементов
  • news.xml
  • page.xml
• application.xml - Мета-инфо и настройки приложения
• application.php - класс инициализации приложения
• application_info.png - большая картинка приложения
• application.png - малая картинка приложения

Каким образом работает шаблон?

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

• alphaindex.php - для просмотра отфильтрованных элементов по буквенному индексу
• category.php - определенная категория
• frontpage.php - титульная страница приложения
• item.php - детальный просмотр элемента каталога
• mysubmissions.php - список отправленных элементов определенного пользователя
• submission.php - форма отправки элемента
• tag.php - элементы с определенным тегом

Внутри этого файла происходят базовые действия, которые необходимы именно для этого вида.  Рассмотрим работы на примере category.php, который является одним из самых сложных вариантов.

Все что описано ниже будет касаться в основном шаблона категории, но так работает в принципе все приложение Zoo.

1. В зависимости от выбранных настроек устанавливаются мета данные, полезные для SEO.

2. Далее выбирается ключ для кэширования, который составляется из текущего алиаса категории, страницы (из постраничной навигации) и еще пары мелочей, таким образом для каждой категории  у нас создается свой кеш.

3. В зависимости от настроек, категория включает в себя различные подшаблоны (информация о категории, список подкатегорий, элементы и прочее)

4. Весь файл размечен профайлером, для будущей отладки.

Включение подшаблонов

Подшаблоны (лейауты, разметки) подключаются с помощью конструкции 

echo $this->partial('category', compact('items'));

где submission - название включаемого шаблона, fields - название переменной, которая будет передана в шаблон.

Этот код будет искать в папке шаблона файл _category.php, который должен содержать следующий код

$layout_filename = basename(__FILE__);
include(dirname(__FILE__) .DS. '__layout_include.php');

Он передает управление файлу __layout_include.php предварительно объявив переменную $layout_filename. Далее файл __layout_include.php на основе переданной ему данных, структуры директорий будет выбирать какую разметку (лейаут) загрузить. Выбор происходит следующим образом

// определяем название шаблона
preg_match('#\_(.*?)\.php#i', $layout_filename, $layout_name);
$layout_name = $layout_name[1];
$layout_path = dirname(__FILE__) .DS. 'renderer' .DS. $layout_name;

// набираем список возможных вариантов названий шаблона в порядке приоритета (первый важнее)
$tmplFullPaths = array();
$tmplFullPaths[] = $this->params->get('config.layout_'.$layout_name, '_default');
$tmplFullPaths[] = $this->application->alias . (($alias !== null) ? '.'.$alias : '');
$tmplFullPaths[] = $this->application->alias;
$tmplFullPaths[] = $alias;
$tmplFullPaths[] = '_default';

// перебираем все варианты, до тех пор пока не найдем подходящий
$isIncluded = false;
foreach($tmplFullPaths as $tmplFullPath) {
    $tmplFullPath = $layout_path .DS. $tmplFullPath .'.php';
    if (JFile::exists($tmplFullPath)) {
        $isIncluded = true;
        include($tmplFullPath);
        break;
    }
}

// если выбрать не получилось, то выдаем фатальную ошибку
if ($isIncluded == false) {
    $error_text = $this->getLayout().':'.$layout_name.':'.($layout_theme ? $layout_theme : 'default');
    JError::raiseError( 500, JText::_('Error Displaying Layout').' ("'.$error_text.'" not found!)');
}

Порядок поиска шаблона следующий

1. Явно из настроек категории (приложения)
2. по псевдониму приложения
3. по внутренней переменной $alias
4. "_default.php"

Таким образом чтобы заменить шаблон категории, нужно просто положить файл с нужным названием в нужное место.

Как выбирается шаблон элемента?

Допустим у нас есть тип элемента "news" и есть категория, в которой отображаются последние новости. Получается что будет загружаться teaser разметка для всех элементов.

Отрисовка одного элемента будет проходить следующими этапами

_item.php - точка входа, тут будет попытка найти шаблон в папке renderer/item/<ИМЯ ТИПА - "news">/teaser.php, если нет, то берется renderer/item/teaser.php

Практически все элементы каталога будут отрисованны именно так.

Приятные мелочи...

Разбиение по колонкам - как для категорий так и для элементов происходит с помощью файла __layout_columns.php путем добавления классов width100, width50, width33, width25

Все шаблоны, что можно было - переопределены своим.

По большому счету можно весь сайт сделать на одном приложении

Пакеты локализации так же работают для панели управления, переопределены программно.

Вах.. Как это теперь можно использовать?

Очень просто. Например мы хотим блог или страницу новостей. Создаем элементы новостей, присвоим им категорию "Новости", в которой отключим все опции для категорий и подкатегорий, а элементы выведем по дате в 1 колонку.

Или включим все опции у категории, в которой убираем вывод элементов, подкатегории делим на два столбика и получаем что-то вроде раздела FAQ.

При включенных всех опциях будет что-то вроде каталога как на сайте www.yootheme.com.

Известные проблемы...

• Работает только в последних версиях Zoo 2.4.x
• Возможно есть различия в работе между Joomla 1.5.x-1.6.x
• Есть незначительные ошибки в локализации 
• В настройках заявлено больше количество сортировок для категорий, работают не все. чтобы активировать необходимо заменить функцию в файле /components/com_zoo/controllers/default.php:_getItemOrder() 
  на ту что лежит /universal/controllers/default.php (это файл пока не используется)
• Пока нет своих базовых CSS файлов (например для классов width50, width25...)
• ...мелкие баги

Описывайте все баги в комментариях, будем править и улучшать ;)

...в планах

• Фиксы багов и выход в stable
• Прозрачное расширение дефолтных контроллеров своими
• Дополнение некоторыми своими элементами...

Внимание!

Это приложение для Zoo является экспериментальным. Использовать его можно на свой страх и риск. Автор приложения признает, что там есть ошибки (возможно даже и критичные), но ваши данные и безопасность сайта от этого не пострадают.

• JB UniversalApp ваши предложения/исправления...
• Обсуждение на Joomlaforum.ru
• Схема шаблона категории
• Сравнение товаров в каталоге JBZoo
• Шаблоны формы поиска (фильтра) для Zoo
• Шаблоны вывода материалов и настройка позиций
• Zoo Widgetkit — элемент для отображения виджетов