VirtueMart – интернет-магазин на Joomla. Часть 18. Вывод категорий VirtueMart с изображениями на главной станице сайта.

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

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

Категории VirtueMart

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

1) использовать в качестве главной страницы сайта главную страницу VirtueMart;

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

Каждый из этих способов достоин внимания, поэтому я подробно расскажу и о том и о другом.

Использование в качестве главной страницы сайта главной страницы VirtueMart.

Этот метод используют многие web-мастера. Суть его в том, что в главное меню добавляется ссылка на компонент VirtueMart, которая ведет на, так называемую, главную страницу VirtueMart. Данная ссылка ставится на первое место в mainmenu и устанавливается главной станицей по умолчанию. Таким образом, при заходе на сайт, пользователи попадают на главную станицу VirtueMart. Данный способ неплох, но у него есть несколько очевидных недостатков. Во-первых, шаблон главной страницы редактируется в большей степени в коде, а не настройками, хотя кое-что можно настроить зайдя в «VirtueMart» –> «Настройки» –> Вкладка «Сайт» –> Окно «Вид» –> Ссылка «Настройки».

Файл шаблона главной страницы:

1
components\com_virtuemart\themes\[имя шаблона]\templates\common\shopIndex.tpl.php

Файл шаблона категорий главной страницы:

1
components\com_virtuemart\themes\[имя шаблона]\templates\common\categoryChildlist.tpl.php

Во-вторых, иногда требуется вывести на главной странице не только категории, но и какой-нибудь приветствующий текст, либо последние новости или что-то еще. В таком случае идеально подходит компонент главной страницы Joomla, но не VirtueMart.

Использование стороннего модуля, выводящего категории VirtueMart.

Вывод категорий VirtueMart через модуль, конечно, гораздо удобнее. Модуль можно вставить в любую позицию или даже в любое место в статье, показываемой на главной странице. Но когда я стал искать подобный модуль, то был крайне удивлен, что выбирать практически не из чего. Решение такой простой задачи, как вывод категорий товаров VirtueMart с картинками в модуле оказалось совсем не просто найти. Лучшим модулем, который я нашел, был «VirtueMart category list» от www.phoca.cz. Модуль оказался простейшим, но выводил товары не очень красиво. В частности, название категории было справа от изображения, что выглядело ужасно.

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

Расскажу немного о настройках модуля. Все они показаны на следующем рисунке:

Категории ViruteMart

Number of Columns (количество колонок) – здесь задается количество колонок, или количество товаров, показываемых в одной строке;

Display Image (показывать изображение) – здесь можно выбрать отображение уменьшенного изображения для категорий – «Yes(Thumbnail)»(уменьшенные изображения категорий должны существовать), отображение категорий с маленькими картинками папок – «Yes(Category)», или без изображений;

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

Остальные настройки аналогичны всем другим модулям Joomla.

Скачать данный модуль вы можете в конце статьи.

Оформление главной страницы с использованием категорий VirtueMart.

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

Примечания:

1) Под словом «размер» я понимаю разрешение изображения в пикселях (например, 150x150 px);

2) Задать размер для мини-изображений по умолчанию можно в  «Настройки» –> Вкладка «Сайт» –> ширина и высота мини-изображения соответственно.

Второй момент – вывод категорий где-нибудь в тексте главной страницы. Предположим, что основное содержимое главной не изменяется и должно включать в себя категории товаров. Для того, чтобы реализовать подобный функционал нам нужно:

1) Настроить главную страницу таким образом, чтобы на ней была показана только одна статья без всяких дополнительных кнопок и ссылок. Для этого идем в «Главное меню» и кликаем по ссылке «Главная». После этого откроется окно, в правой части которого можно задать все необходимые параметры.

Категории ViruteMart

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

2) Теперь необходимо оставить для отображения на главной странице только один материал. Отображение на главной у всех остальных должно быть отключено. Это делается простой установкой опции в менеджере материалов.

3) Итак, у нас есть одна статья, которая отображается на главной странице сайта, и при этом выглядит как простой текст (т.к. иконки, даты создания и изменения, авторы, и.т.д. мы отключили в пункте 1). Остается лишь наполнить эту страницу необходимой информацией и вывести в ней модуль категорий товаров VirtueMart с картинками. Если с наполнением проблем быть не должно, то с выводом могут возникнуть трудности, т.к. многие не знают как вывести модуль в тексте статьи. Для того, чтобы сделать это, следуем пунктам ниже:

а) в менеджере плагинов нужно опубликовать плагин «loadmodule» или «Содержимое - Загрузка модуля в Материал»;

б) В настройках нашего модуля, в поле «Позиция» мы вписываем(!!!) любое название нашей новой позиции, например «mainpage». Главное, чтобы оно не совпадало с уже существующими позициями модулей. После этого сохраняем изменения.

в) В тексте статьи, в предполагаемом месте вывода списка категорий товаров вписываем

1
{loadposition mainpage}

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

Сохраняем статью.

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

Дополнительные файлы: модуль VirtueMart category list redesigned by Wedal