Обзор Droptables. Создание прайс листа в Joomla. Как настроить табличный вывод каталога в JBZoo? Внешний вид списка всех категорий joomla 3

Для пользователей Joomla, “список категорий” - это знакомый тип меню, который позволяет пользователям отображать категории ии подкатегории в формате списка. Однако, страница выглядит слишком просто и очень красиво, например, с шаблоном Protostar.

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

ШАГ 1: Создание категории, подкатегории и статей

Во-первых, перейдите в Материалы > Менеджер категорий > Создать категорию, чтобы, конечно же, создать новую категорию, а также несколько подкатегорий. На вкладке “параметры” каждой подкатегории, вы должны выбрать изображения для них.

ШАГ 2: Некоторые изменения в настройках материалов

На этом шаге вам нужно зайти в Система > Общие настройки > Материалы или же вы можете перейти в Материалы > Менеджер материалов > Настройки. В разделе"Категории", необходимо изменить некоторые параметры, как показано ниже:

Сообщение об отсутствии материалов: Скрыть

Кол-во материалов в категории: Показать

ШАГ 3: Создайте новый пункт меню

Перейдите в Меню > Главное меню и создайте новый пункт меню с типом “Список всех категорий” (Материалы > Список всех категорий). Затем, выберите категорию с подкатегориями, которую вы только что создали.

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

ШАГ 4: Создайте переопределение

Чтобы создать новое переопределение, перейдите в Расширения > Менеджер шаблонов > Шаблоны. Затем откройте шаблон, который вы хотите добавить новое переопределение. В этой статье мы возьмем стандартный шаблон Joomla 3 “Protostar” в качестве примера.

После этого вы получите сообщение о том, что в папке HTML-кода шаблона Jooml-ой были созданы все необходимые файлы для замены.

Для редактирования файла, который вы хотите изменить, пожалуйста, перейдите на вкладку “Редактор”, затем выберите html > com_content > category. Выберите файл “default_children.php” и вы увидите данный файл в текстовом редакторе.

Вам нужно добавить следующий код между строк 44 и 45 для того, чтобы вывести изображения подкатегорий на страницах сайта:

params)->image . "" />"; ?>

Сохраните изменения и обновите страницу сайта, и у вас появится список всех категорий, который отображается так:

Выглядит более привлекательным, чем до этого, не так ли?

ШАГ 5: Украсим еще больше!

Protostar представляет собой шаблон, который базируется на Bootstrap 2, так что мы можем использовать классы CSS от bootstrap для улучшения вывода изображений. Вы можете добавить класс "img-polaroid" в код:

params)->image . "" />"; ?>

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

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

Огромное спасибо за чтение:)

В очередном, 42 уроке создания сайта Joomla, посмотрим, для чего нужен модуль, как создать и как настроить модуль «Список материалов категории».

Для чего нужен

Рассматриваемый модуль относится к группе модулей «Материалы». Всего в этой группе 6 модулей.

Модуль «Список материалов категории» нужен для показа на сайте в любой позиции для модулей, списка статей (материалов) из выбранной категории или несколько выбранных категорий.

Каталог модуля

Папка с этим модулем носит название . В его каталоге лежат:

• Каталог tmpl ;

Файлы helper.php; mod_articles_category.php; mod_articles_ category.xml .

Сам каталог вы найдете в каталоге .

Как создать

Чтобы создать модуль Список материалов категории пройдите простые шаги:

• Авторизуйтесь в административной части сайта с правами необходимыми для создания модулей. Например, суперадминистратор;
• Из верхнего меню войдите на вкладку «Модули»;
• На странице со списком уже созданных модулей нажмите кнопку «Создать». Она зеленого цвета;
• В списке модулей выберете модуль с названием «Материалы - Список материалов категории»;
• Заполните настройки модуля, выберете позицию модуля на сайте и сохраните его;
• После чистки кэша (если вы его используете), модуль будет виден на сайте в указанной позиции.

Настройки

Посмотрим настройки нашего модуля. Они несложные. На вкладке создания модуля 8 вкладок :

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

Модуль

Интересная настройка, имеющая два параметра режима отображения:

• Обычный: Модуль просто создается и показывается, где указано;
• Динамичный: При таком режиме, система сама принимает решение, где показывать этот модуль.

Привязка к пунктам меню

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

Например, чтобы показать модуль ТОЛЬКО на главной странице, нужно выбрать Привязку модуля - «Только на указанных страницах» и выбрать из списка меню главную страницу.

Параметры фильтрации

class="eliadunit">

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

Также есть возможность убрать из списка «Избранные материалы», включить или убрать дочерние категории, указать количество статей в списке.

Сортировка

Параметров сортировка ранжируют список материалов по заголовку и еще 9 вариантам. Можно указать прямую или обратную сортировки.

Группировка

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

Параметры отображения

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

При желании вы можете дополнить список датой выхода материала, категорией, количеством просмотров, автором, вводным текстом, ссылкой «Подробнее».

Дополнительные параметры

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

Параметр «Размер Bootstrap» разобьёт список на колонки. Значение «0» нет колонок.

Права

Если ваш сайт многопользовательский, то нужно выставить права пользователей по вашей схеме прав на управление сайтом.

После настроек не забываем проверить на вкладке «Модуль» позицию модуля, показать или скрыть его название, которое обязательно, написать для себя примечание.

Вывод

В этой статье вы посмотрели последний модуль из группы «Материалы» под названием Список материалов категории Joomla сайта.

В одной из статей мы создавали материал и пункт меню для его вывода. Такой подход оправдан, если добавляется отдельная страница сайта, такая как «О нас» или «Прайс-лист».

Если же ресурс представляет собой блог или информационный портал, то создавать для каждого поста отдельный пункт меню в нём неприемлемо. На этот случай в Joomla существуют категории. Они представляют собой рубрики, их можно выводить в меню. В одну категорию помещается неограниченное количество статей, однако один пост может относиться только к одной категории (для множественной классификации существуют метки).

Особняком стоит раздел Избранное. Это единственная категория, в которой посты могут находиться помимо основной. Избранными записями можно управлять, открыв пункт Материалы -> Избранные материалы панели управления движком.

1. В панели управления CMS откройте Материалы -> Менеджер категорий и нажмите кнопку Создать в левом верхнем углу появившейся страницы (либо сразу выполните команду меню Материалы -> Менеджер категорий -> Создать материал ).

Здесь же, в менеджере, можно удалить лишние категории. Для этого достаточно выделить их и щёлкнуть на кнопке В корзину .

2. Заполните поля формы и нажмите Сохранить . После сохранения вы можете перенести в новую категорию ранее созданный материал. Для этого откройте его, выберите новый раздел в раскрывающемся списке Категория и нажмите Сохранить .

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

Вне вкладок расположено всего два элемента.

• Заголовок. Название раздела.
• Алиас. Псевдоним, использующийся для формирования URL-адресов страниц сайта. Его можно не заполнять, так как вполне вменяемые алиасы Joomla создаёт сама по себе.

Остальные настройки распределены по вкладкам.

Категория

Основная вкладка, большинство администраторов используют при создании разделов только её.

• Описание. Сюда можно вставить всё, что угодно: от коротенького пояснения до полноценной страницы с картинками, видеоматериалами и музыкой.
• Родитель. Из раскрывающегося списка можно выбрать раздел, которому создаваемая категория будет принадлежать. Так создаётся иерархическая структура с уровнями вложенности. Чтобы категория никому не принадлежала, оставьте в списке значение Нет родителя .
• Состояние. В зависимости от выбранного значения после сохранения категория будет опубликована (вариант Опубликовано ), добавлена вместо публикации в черновики (Не опубликовано ), помещена в архив (В архиве ) или в Корзину (В корзине ). Чаще всего этот раскрывающийся список не трогают, оставляя в нём значение по умолчанию - Опубликовано .
• Доступ. Определяет, кто сможет просматривать раздел. По умолчанию задано значение Public (доступно всем).
• Язык. Язык категории, можно оставить значение Все, тем более что русского языка часто даже нет в списке.
• Метки. Теги, которые привычней добавлять к материалам, а не к категориям. В принципе метки - тоже своего рода категории, только для одного материала их можно указать множество. В дальнейшем, когда пользователь щёлкнет на одну из меток, он увидит страницу со списком всех материалов, помеченных ею. Для просмотра всех меток и управления ими перейдите на страницу Компоненты -> Метки .

Публикация

Эта вкладка располагает следующими элементами.

• Дата создания. Поле, хранящее время добавления элемента. В редакторе материала помимо этого есть также поля Начало публикации и Завершение публикации, с помощью которых можно, во-первых, настроить отложенную публикацию, чтобы запись появилась на сайте в обозначенное время без вашего участия, во-вторых, настроить его снятие с публикации в автоматическом режиме (может использоваться, например, для страницы срочного конкурса или акции).
• Автор. Здесь можно переназначить автора публикации. В редакторе материалов есть также поле Псевдоним автора, куда можно ввести произвольное имя для отображения на сайте.
• Дата модификации. Поле хранит время, когда категория была изменена.
• Изменил. Имя внёсшего правки пользователя. Для материалов доступно также поле Версия, позволяющее узнать, сколько раз редактировалась страница.
• Кол-во просмотров. Число просмотров раздела.
• ID. Идентификационный номер категории, который система присваивает автоматически.
• Мета-тег Description. Позволяет вставить описание категории для SEO-продвижения.
• Мета-тег Keywords. Поле для ключевых слов.
• Мета-тег Robots. Из раскрывающегося списка можно выбрать директивы для файла robots.txt, влияющие на индексацию раздела поисковиками. Варианты списка - комбинации, дающие команду либо индексировать и документ, и размещённые в нём ссылки (Index, Follow ), либо ничего не индексировать (No index, no follow ), либо индексировать или одно, или другое (два оставшихся варианта).

Права доступа

Эта вкладка полностью посвящена настройкам доступа к категории (в редакторе материалов тоже такая есть). Здесь можно открыть или закрыть доступ персонально каждой группе пользователей.

Параметры

Здесь разместились все оставшиеся настройки, не попавшие на другие вкладки.

• Альтернативный макет . В раскрывающемся списке можно задать настройки отображения раздела.
• Изображение . К категории можно прикрепить картинку.
• Альтернативный текст . Тег alt изображения.

2012 г.

• 01.07.2012 Новость 3
• 23.02.2012 Новость 2
• 07.04.2012 Новость 1

2011 г.

• Новость 2
• Новость 1

2010 г.

2009 г.

Вот как-то так… То есть, выводим название категории, а в ней ссылки на материалы. Раскрашивать и украшать не стал — и так видно, что за затея.

Сздаем пункт меню «Материалы » Список всех категорий» и указываем корневую категорию, которая содержит нужные подкатегории с материалами. Получим пока просто список категорий.

Открываем

или /components/com_content/views/categories/tmpl/default_items.php

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

Самая суть вот в этом куске:

getQuery(true); //echo $item->id; $query = "SELECT * FROM `#__content` WHERE `catid`=".$item->id." AND `state`>0"; $db->setQuery($query); $res= $db->

"; //print_r ($concert); echo $concert->title; echo "

"; } ?>

Номер строки проставлять не стал, это можно вставить почти куда угодно — тут хватит даже начальнах знаний PHP. Собственно, тут мы подключаемся к базе, выполняем запрос, в котором нам нужны все поля (мне нужны все поля, кому надо определенные — курим SELECT), но только принадлежащие id категории ($item->id), опубликованные и не в корзине (`state`>0).

Чтобы все это выглядело красиво — я затолкал вывод заголовков новостей в список (потом в CSS уже как захочется можно его украсить).

Я неспроста оставил //print_r ($concert); заремареным. Если его раскомментировать — увидим (да и так это видно), что $concert — это объект, в котором находятся все наши поля. доступ к ним осуществляется аналогично. Есть маленькая тонкость. В базе нигде не прописана ссылка. Заметили? Ссылку делаем так:

Echo "index.php?option=com_content&view=article&id=".$concert->id;

Если совсем разжевать и в рот положить — получится так:

id; ?>">title; ?>

Есть вариант вогнать туда роутер (что предпочтительнее):

Echo "id))."">".$concert->title."";

Это, конечно, костылик, но большего обычно требуется редко, тем более, если мы сделаем это в файле /templates/ШАБЛОН/html/com_content/categories/default_items.php — не такой это и костыль получится.

Для тех, кто вообще далек — вот код (если что-то попрет не туда — не ругаться, а начинать думать!)

items[$this->parent->id]) > 0 && $this->maxLevelcat != 0) : ?>

items[$this->parent->id] as $id => $item) : ?> params->get("show_empty_categories_cat") || $item->numitems || count($item->getChildren())) : if (!isset($this->items[$this->parent->id][$id + 1])) { $class = " class="last""; } ?> > id));?>"> escape($item->title); ?> params->get("show_subcat_desc_cat") == 1) :?> description) : ?>
description, "", "com_content.categories"); ?>
params->get("show_cat_num_articles_cat") == 1) :?>

numitems; ?>

getChildren()) > 0) : $this->items[$item->id] = $item->getChildren(); $this->parent = $item; $this->maxLevelcat--; echo $this->loadTemplate("items"); $this->parent = $item->getParent(); $this->maxLevelcat++; endif; ?>
getQuery(true); //echo $item->id; $query = "SELECT * FROM `#__content` WHERE `catid`=".$item->id." AND `state`>0"; $db->setQuery($query); $res= $db->loadObjectList(); foreach ($res as $concert) { echo "
• "; //print_r ($concert); //echo $concert->title; echo "id))."">".$concert->title.""; echo "
"; } ?>

Что такое переопределение или шаблонизация в 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 для придания уникальности блогу категорий.