Что такое альтернативные макеты различных компонентов CMS Joomla 3 мы уже знаем, об этом была написана не одна статья посвященная переопределению . На сей раз, я хочу рассказать Вам о том, как создать собственный макет или шаблон для вывода материалов определённой категории с привязкой его к типу пункта меню в панели управления.

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

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

Как быть в таком случае? Ответ на данный вопрос, как и его решение, достаточно прост - создать собственный макет или если хотите шаблон для вывода материалов категории и привязать его к типу пункта меню в панели управления. Если ничего не понятно, то посмотрите на скриншот, где показаны стандартные типы пункта меню для вывода материалов:

Теперь надеюсь все понятно, именно про данные пункты меню в панели управления я и говорю. Создавать таких пунктов меню (собственных шаблонов для вывода материалов) можно сколько угодно и для каждой категории определять свой собственный стиль оформления. Согласитесь это удобно.

С чего начать создание собственного шаблона для материалов категории

Шаблон или макет для материалов это не то же самое что шаблон для сайта целиком, прошу не путать. Если Вы читали статью «Переопределение макета блога категории в Joomla 3 » то уже знаете, что за вывод материалов в виде блога категории отвечают два основных файла blog.php , blog_item.php расположенные в папке . Кроме того в этой же папке находятся файлы отвечающие за вывод материалов категории в виде списка - default.php , default_item.php .

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

Для начала копируем вышеуказанные файлы (в моем случае blog.php , blog_item.php ), а так же файл blog.xml из папки components/com_content/views/category/tmpl в папку templates/имя_вашего_шаблона/html/com_content/category . Теперь следует дать данным файлам новое название. Я решил назвать данные файлы так: new-blog.php , new-blog_item.php , new-blog.xml . Обратите внимание, что символ подчеркивания может быть только у одного файла и только в одном экземпляре.

Файлы созданы и находятся на своем месте, отлично, теперь необходимо внести некоторые изменения в файл с инструкциями new-blog.xml . Для этого открываем его и смотрим на его содержимое, в самом начале файла Вы можете наблюдать следующий код (строки с 1 по 8):

Все что нам потребуется это внести изменения в константы и заменить в них фразу BLOG на NEW-BLOG. В итоге Ваш код должен получиться следующим (строка с 3 по 8):

Сохраняем файл, он нам больше не пригодиться. Теперь можно перейти в панель управления и посмотреть, что у нас получилось. В менеджере меню открываем один из пунктов для редактирования и жмем на кнопку «Выбрать» напротив типа пункта меню. Вот что у нас должно получиться:

Переопределение языковых констант

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

Для решения подобной задачи можно воспользоваться несколькими способами, самый простой это перейти в раздел панели управления «Менеджер языков: Переопределение констант» (Расширения -> Языки -> Переопределение констант). С помощью фильтра выбираем раздел «Панель управления» и жмем кнопку «Создать».

Все четыре языковые константы нам переопределять нет смысла, достаточно будет переопределить константу с заголовком типа пункта меню (TITLE) и с кратким описанием (DESC), данные константы у нас расположены в строках 3 и 6 файла new-blog.xml :

  • COM_CONTENT_CATEGORY_VIEW_NEW-BLOG_TITLE
  • COM_CONTENT_CATEGORY_VIEW_NEW-BLOG_DESC

    • Прописываем данные константы, даем им свое название и сохраняем, результат должен быть примерно таким:

    Более подробно про переопределение языковых констант и локализацию Joomla 3 я расскажу в следующей статье, а сейчас давайте посмотрим, что у нас получилось. Снова переходим в редактор пункта меню и смотрим, как отображается наш новый тип пункта меню:

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

    Что такое переопределение или шаблонизация в Joomla мы познакомились в предыдущей статье . Там же мы говорили о том, как переопределить макет модуля последних новостей. Данная же статья будет посвящена блогу категорий, точнее переопределению стандартного макета блога категорий под нужды конкретного сайта.

    Что такое блог категории думаю объяснять не стоит, но на всякий случай чтобы стало понятнее посмотрите на скриншот с небольшим примером того как могут выглядеть материалы выведенные в виде блога:

    Статью я решил построить следующим образом - для начала мы поговорим о том, для чего может потребоваться переопределять макет блога категории, затем рассмотрим код стандартного файла отвечающего за вывод блога категорий. После чего сократим данный файл, удалив из него весь ненужный для нас код тем самым пусть незначительно, но ускорим скорость загрузки страницы. И в заключении внесем определенные корректировки и изменим стандартный вид при выводе материалов категории.

    Зачем переопределять макет блога категории?

    Ответ на данный вопрос достаточно простой – чтобы сократить размер страницы либо кардинально поменять внешний облик макета блога категории на страницах сайта.

    С внешним видом все понятно, а как влияет переопределение на размер страницы? Все просто, допустим нам необходимо чтобы в блоге, материалы выводились следующим образом – изображение, заголовок, краткий текст, кнопка подробнее и более для нас ничего не интересно. Но стандартный файл, отвечающий за макет блога категории, содержит гораздо больше кода, чем может потребоваться для большинства сайтов, следовательно, его размер можно значительно сократить.

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

    Файлы, отвечающие за макет блога категории
    • blog.php – основной макет для всей страницы целиком, включает заголовок пункта меню, заголовок и описание категории, метки категории, материалы в виде блога и пагинацию (тип пункта меню «Блог категории»). Кроме того для отображения каждого конкретного материала используется дополнительный файл blog_item.php.
    • blog_item.php – отвечает за макет материала в блоге. Выводит заголовок материала, рейтинг, краткое содержание, кнопку подробнее и так далее.
    • blog_children.php – отвечает за вывод подкатегорий.
    • blog_links.php – выводит заголовки материалов в виде обычных ссылок. Количество подобных ссылок можно указывать в параметрах макета блога.
    • default_articles.php – отвечает за вывод материалов в виде списка (тип пункта меню «Список материалов категории»), но в данный момент он нам не интересен.

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

    Стандартные файлы, отвечающие за макет блога категории и их код

    Прежде чем начать переопределение макета блога категории не лишним будет разобраться в коде оригинальных файлов, это поможет избежать ошибок при внесении в них изменений. Но для начала давайте скопируем оригинальные файлы (нам потребуются файлы blog.php и blog_item.php) с вышеупомянутой папки в папку /templates/имя_шаблона/html/com_content/category.

    Файл blog.php отвечающий за макет блога категории в Joomla 3.8.1

    Как я уже говорил файл blog.php отвечает за макет блога категории целиком – за отображение заголовка пункта меню (если используется), заголовка категории, списка материалов, меток, пагинацию и так далее.

    Давайте откроем данный файл (с папки html/com_content/category текущего шаблона) и посмотрим на его код. В самом начале (строки с 1 по 30) идет информация по лицензии и авторских правах, следом за ней строка, отвечающая за безопасность и объявление переменных.

    Далее начинается код, отвечающий за вывод контента. Первые 5 строчек отвечают за вывод заголовка страницы, если быть точнее, то в качестве такого заголовка будет выступать заголовок пункта меню (если установлено «показать»). Чтобы было понятнее, я решил внести комментарии в код и показать его в виде скриншотов:

    Следом за метками идет (опять же если установлено в настройках) описание и изображение категории:

    Теперь начинается проверка на наличие в данной категории материалов, если материалов нет, то будет выведено соответствующее сообщение:

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

    В начале идет код, отвечающий за вывод материалов во всю ширину, их количество указывается в настройках макета блога:

    Следующий блок кода отвечает за вывод материалов в колонках, количество таких материалов и количество колонок так же указывается в настройках макета блога Joomla:

    Завершается файл blog.php кодом, который отвечает за вывод материалов в виде обычных ссылок, которые идут после главных материалов, а в самом конце файла идет код, отвечающий за пагинацию (навигация по страницам):

    Файл blog_item.php отвечающий за внешний вид материалов в блоге

    Следующий файл, который формирует макет страницы блога, называется blog_item.php. С помощью данного файла задается внешний облик материалов – выводится изображение вступительного текста, сам текст, кнопка подробнее, дополнительная информация, такая как дата создания, автор и прочее.

    Как и в предыдущем файле в самом начале файла blog_item.php содержится информация об авторских правах, и объявляются необходимые переменные. Далее идет основной код, отвечающий за внешний вид материала.
    Чтобы разобраться, что к чему смотрите на скриншот:

    На скриншоте показан не полный код, но все что ниже нас не интересует. Для того чтобы изменить внешний облик выводимых материалов мы будем работать исключительно с этими строками кода. Файлы blog_children.php и blog_links.php рассматривать более детально не вижу смысла, их переопределяют крайне редко.

    На этом, пожалуй, я закончу статью, она получилась довольно большой. В следующей части статьи я расскажу, как редактировать макет блога категорий и в частности файлы blog.php и blog_item.php для придания уникальности блогу категорий.

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

    В этой статье мы пройдем пошаговую инструкцию по настройке табличного вывода каталога (или одной категории).

    1. Создайте новый тип материала

    При этом укажите псевдоним типа материала английскими буквами без пробелов. В нашем случае это будет table-item .

    Наполните тип необходимыми вам элементами. Например, следующим образом:

    2. Создание отдельных шаблонов для материала

    Допустим, мы хотим, чтобы каждая строка таблицы имела свою детальную страницу. Поэтому нам нужны два шаблона teaser и full .

    Teaser - шаблон анонса, который будет отвечать за одну строку из таблицы.

    Full - шаблон детальной страницы материала.

    Откройте папку:

    media/zoo/applications/jbuniversal/templates/catalog/renderer/item

    Создайте в ней новую папку с именем table-item и перейдите в нее /table-item/

    Скопируйте в нее файлы как показано ниже:

    /full.php ==> /table-item/full.php
    /teaser.php ==> /table-item/teaser.php
    /metadata.xml ==> /table-item/metadata.xml
    /positions.xml ==> /table-item/positions.xml

    Отредактируйте файлы следующим образом:

    Title Image Properties Text Meta Table cell #1 Table cell #2 Table cell #3 Table cell #4 Table cell #5

    3. Настройте вывод шаблонов teaser и full

    В данном примере рассмотрим только teaser . Full на ваше усмотрение.

    4. Создать каталог

    Теперь нам понадобится новый каталог.

    При создании укажите удобный псевдоним латиницей (например table-app ). Не забудьте выбрать шаблон catalog .

    Отключим обрамление каждого материала

    5. Настройка шаблонов приложения

    Откройте директорию шаблона колонки media/zoo/applications/jbuniversal/templates/catalog/renderer/item_columns

    И создайте там файл table-app.php следующего содержания:

    Таблица ID Название Картинка Поле 1 Поле 2 Поле 3
    jQuery(function ($) { $(".jsTableSorter").tablesorter({}); });