Только пользователям разрешено входить в центр администрирования. Войти
Генератор виджетов
Виджет с категориями магазина
«Виджет» – это интерактивный блок с данными для размещения на сайте. Виджет можно генерировать при помощи специального короткого кода («ShortCode»), который может содержать дополнительные параметры. Полученный код можно вставить на страницы или в Блоки/Меню.Как вставить сгенерированное меню?
- Вы можете воспользоваться кодом автоматической замены, введя [MENU:shop_categories:vertical:products]
Список значений вы можете заполнить при помощи генератора «Виджета с категориями магазина». - Вы можете вставить код сгенерированного меню в блоки/меню или на страницы.
-
Внимание! Если вы используете несколько меню на одной странице, то вам не нужно вставлять Java Script и CSS стиль повторно.
По умолчанию в стандартном наборе функций вашего магазина уже вшит данный JavaScript и CSS стиль. Вы можете повторно вставить код только если вам нужно изменить его дизайн или функции.
В коде можно использовать следующие параметры:
- :vertical - вертикальное меню
- :flexmenu — вертикальное Flex меню (Vertically Flex) — компактное вертикальное меню с фиксированной высотой, которое содержит категории и подкатегории магазина. Дочерние категории отображаются в блоке с фиксированной высотой справа от кнопки родительской категории. Дополнительные параметры: :height-400 — высота блока, :width-300 — ширина блока, :scroll-lock — блокировка прокрутки, :with-overlay — подключение скрипта для создания overlay блока, отделяющего подпункты от основного блока с меню
в таком случае доступно еще 2 параметра :fix-on-top (привязка к верху блока) и :disallow-oveflow (запретиль элеменам выходить за пределы низа блока меню). - :horizontal - горизонтальное меню (Можно отображать и внтури страниц в виде блоков с разным уровнем вложенности. Дополнительный стиль к блоку можно указать задав ID-«hotengine-categories-lists-horizontal»)
- :dropdown - выпадающее меню
- :full - список категорий в раскрытом виде
- :list - стандартный список подкатегорий (отображение такого же списка подкатегорий, как на странице основной выбранной start-X категории. При использовании list используется только параметр start-X)
- :treelevel-X - Где X, это уровень вложенности в категории. Например, если нужно разместить только основные катгории и их дочерние рубрики без вхождения в их последующие подрубрики, то можно использовать зачение «2»
- :products - Показывать количество товаров внутри категории
- :dataattr - Добавить data- разметку с информацией о категории (ID, количество дочерних категорий, количество товаров)
- :googlenav - Добавить Google разметку (itemprop name и url)
- :imageattr - Добавить атрибут с иконкой (Если для категории задана иконка, то к ней будет добавлен специальный атрибут — его можно использовать для отображения этой иконки в меню.)
- :scroll-9999x3 - Scroll эффект для категорий (только в режиме :list) - заменяет способ отображения на блок с горизонтальной прокруткой категорий. Функция активируется только если ширина экрана меньше указанного значения. Пагинация задаётся вторым параметром (количество точек).
Способ добавления параметра
Блок категорий будет прокручиваться при указанных в параметрах значениях, например «:scroll-9999x3», где:- 9999 — максимальная ширина экрана для активации прокрутки;
- 3 — количество точек в пагинации (если не указано, пагинация выключена).
- :carousel - экспериментальная функция owl-carousel, прокрутка с поддержкой touch swipe *
Изменение параметров
По умолчанию размер окна определяется при помощи Javascript.
Вы можете указать множество дополнительных параметров, список которых доступен по этой ссылке: Docs Options.
Для того, чтобы задать параметр воспользуйтесь шаблоном:
:carousel-autoplayTimeout-1000
:carousel-autoplaySpeed-5000
:carousel-autoplay-true
и так далее (:carousel-ПАРАМЕТР-ЗНАЧЕИЕ).
Кроме того, опцию можно указать при помощи JavaScript атрибута carousel-...
data-carousel-autoplayTimeout="1000"
data-carousel-autoplaySpeed="5000"
data-carousel-autoplay="true"
и так далее (data-carouserl-ПАРАМЕТР="значение")
- :add-javascript - если не добавить данный параметр, то будет только список категорий (без javscript и css стилей, которые нужно предварительно вставлять самостоятельно).
Данный параметр удобен в том случае, если вы хотите оформить собственный стиль для меню, но хотите что бы категории вствлялись автоматически. Тогда вам нужно вставить JavaScript, CSS код, и короткий код [MENU...] - :start-X - где Х, это ID той рубрики с которой нужно начать.
Данный параметр полезен в том случае, если у вас сначала идет категори "Магазин" и в ней подкатегории. Тогда вы сможете не показывать в меню вашу главную категорию "Магазин". - :id- - создать объект DIV c указанным ID, внутрь которого будет вставлено меню. Можно использовать для индивидуальной стилизации меню
Генерировать вертикального меню с категориями или вставить в виде кода [MENU:shop_categories:vertical]
Генерировать вертикального меню с категориями и количеством товаров в них или вставить в виде кода [MENU:shop_categories:vertical:products]
Генерировать горизонтального меню с категориями или вставить в виде кода [MENU:shop_categories:horizontal]
Генерировать горизонтального меню с категориями и количеством товаров в них или вставить в виде кода [MENU:shop_categories:horizontal:products]
Генерировать горизонтального выпадающего при наведении меню с категориями или вставить в виде кода [MENU:shop_categories:dropdown]
Генерировать горизонтального меню выпадающего при наведении с категориями и количеством товаров в них или вставить в виде кода [MENU:shop_categories:dropdown:products]
Генерировать список всех категорий (полный список HTML) или вставить в виде кода [MENU:shop_categories:full]
Генерировать список всех категорий (полный список HTML) и количество товаров или вставить в виде кода [MENU:shop_categories:full:products]
JSON (?)
Генерировать вертикального меню с категориями и количеством товаров в них или вставить в виде кода [MENU:shop_categories:vertical:products]
Генерировать горизонтального меню с категориями или вставить в виде кода [MENU:shop_categories:horizontal]
Генерировать горизонтального меню с категориями и количеством товаров в них или вставить в виде кода [MENU:shop_categories:horizontal:products]
Генерировать горизонтального выпадающего при наведении меню с категориями или вставить в виде кода [MENU:shop_categories:dropdown]
Генерировать горизонтального меню выпадающего при наведении с категориями и количеством товаров в них или вставить в виде кода [MENU:shop_categories:dropdown:products]
Генерировать список всех категорий (полный список HTML) или вставить в виде кода [MENU:shop_categories:full]
Генерировать список всех категорий (полный список HTML) и количество товаров или вставить в виде кода [MENU:shop_categories:full:products]
JSON (?)