Шаблон "Joy"

В данной статье мы рассмотрим особенности шаблона и оформление блоков на главной странице :

• Особенности шаблона
• Вывод меню в фиксированной шапке
• Горизонтальный блок слева от 'Успей купить' большой (Шаблон Joy)
• Вертикальный блок справа от 'Успей купить' малый (Шаблон Joy)
• Текст между товарами и новостями (Шаблон Joy)
• Блоки под каруселью
• Карточка товара
• Категории

Внимание!

Шаблон "Joy" может быть установлен только на магазин версии 8.5.6 и выше. Если Ваш магазин версии ниже, пожалуйста, обновите магазин до версии 8.5.6 и выше до начала работ с шаблоном.

Особенности шаблона

Стильный и минималистичный дизайн.

Режим отображения главной страницы "Одна колонка", но тем не менее каталог может находится слева от карусели, как при отображении в 2 колонки (рис. 1), если включить настройку "Отображать меню возле карусели на главной" в разделе "Дизайн" - "Параметры" - "Главная страница" (рис.2).

Рисунок 1.

Рисунок 2.

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

Список желания и сравнение добавлены иконками справа от корзины (рис.3).

Рисунок 3.

Новый внешний вид маркеров, "Добавить в сравнение" и "Избранное" выведено на карточке товара справа от фото (рис.4).

Рисунок 4.

Компактное отображение карточек товаров за счет скрытия кнопки "Добавить в корзину", которая выводится при наведении (рис.5 п.1). Также есть возможность вывести в превью свойства (рис.5 п.2) и рейтинг (рис.5 п.3)

Рисунок 5.

Для этого необходимо активировать настройки "Отображать свойства в представлении товара" и "Отображать рейтинг в представлении товара" в разделе "Дизайн" - "Параметры" - "Категории товаров" (рис.6).

Рисунок 6.

Отображение карточки товара в каталоге можно сразу отображать полностью, а не только при наведении (рис.7).

Рисунок 7.

Для этого необходимо деактивировать настройку "Выводить блок со свойствами и кнопкой 'Купить' при наведении (при выкл. настройке блок выводится всегда)", пункт меню "Дизайн", далее "Параметры", раздел "Категории товаров" (рис.8)

Рисунок 8.

По умолчанию включена настройка "Отображать рейтинг в виде сердечек". Изменить рейтиг на стандартный  можно через настройки дизайна, пункт "Параметры", далее "Категории товаров", раздел "Дополнительные настройки шаблона" (рис.9) отключить функцию "Отображать рейтинг в виде сердечек".

Рисунок 9.

Вид рейтинга изменится (рис.10).

Рисунок 10.

Вывод меню в фиксированной шапке

Верхнее главное меню, авторизация, корзина зафиксированы и двигаются с прокруткой экрана. Также на выбор двигается либо логотип (рис.11), либо каталог (рис.13).
Если включена настройка "Выводить меню в фиксированной шапке" в разделе "Дизайн" - "Параметры" -"Основное" (рис.12), то будет выводится именно каталог (рис.13) и фиксироваться в верхней строке прокрутки.
Если данная настройка отключена, то по умолчанию выводится логотип (рис.11).

Рисунок 11.

Рисунок 12.

Рисунок 13.

Горизонтальный блок слева от 'Успей купить' большой (Шаблон Joy)

Рисунок 14.

Для редактирования блока переходим в раздел "Дизайн" - "Страницы и блоки" - "Блоки", находим в списке блок с названием "Горизонтальный блок слева от "Успей купить" большой" с ключом доступа " JoyBannerByIntimeBig" (рис.15). 

Рисунок 15.

Переходим в редактирование блока, далее режим "Источник" добавляем  код, заменив ссылку на изображение своей (рис.16).

<a href="#"><img src="Templates/Joy/images/7.jpg" style="border-radius: .25rem;" /></a>

Рисунок 16.

Вертикальный блок справа от "Успей купить" малый (Шаблон Joy)

Рисунок 17. 

Для редактирования блока переходим в раздел "Дизайн" - "Страницы и блоки" - "Блоки", находим в списке блок с названием "Вертикальный блок справа от 'Успей купить' малый (Шаблон Joy)" с ключом доступа "JoyBannerByIntimeSmall". В редактировании блока переходим в режим "Источник" и произведим изменение изображения (рис.18 п.3) и ссылки для перехода при клике на изображение (рис.18 п.2).

Рисунок 18.

Текст между товарами и новостями (Шаблон Joy)

Рисунок 19.

Для редактирования блока переходим в раздел "Дизайн" - "Страницы и блоки" - "Блоки", находим в списке блок с названием "Текст между товарами и новостями (Шаблон Joy)" с ключом доступа "JoyOnMain" (рис. 20). В редактировании блока переходим в режим "Источник" (рис. 20 п.1) и производим изменение изображения (рис.20 п.2) и ссылки для перехода при клике на изображение (рис.20 п.3).

Рисунок 20.

Блоки под каруселью

Рисунок 21.

За блоки под каруселью отвечает три статических блока: "Малый блок под каруселью 1 (Шаблон Joy)", "Малый блок под каруселью 2 (Шаблон Joy)" и "Малый блок под каруселью 3 (Шаблон Joy)"- это три статических блока равной ширины для баннеров под каруселью. Растягиваются в зависимости от количества выведенных (отображается только 1 – занимает 100% экрана, 2 – 50%, 3 – 33% от экрана).

При наведении на изображение блока есть анимация (полупрозрачная заставка идущая от углов к центру и наоборот).

Внимание

Если при редактировании блока  "Малый блок под каруселью 1 (Шаблон Joy)" удалить код из css стилей или отключить активность у блока, то анимация не будет работать на других изображениях в блоках.

Карточка товара

Изменился внешний вид карточки товара. Теперь дерево категорий доступно внутри карточки товара (рис.22). Блок характеристик вынесен отдельно и перенесен вниз, под основной блок товара (рис.23).

Рисунок 22.

Рисунок 23.

Вместо стандартного символа валюты руб. можно вывести значок рубля (рис.24). Для этого необходимо в разделе "Дизайн" - "Параметры" -"Основное" активировать настройку "Знак рубля в представлении и карточке товара" (рис.25).

Рисунок 24.

Рисунок 25.

Категории

Доступна возможность самостоятельно определять сколько категорий в меню будет выводится, для этого необходимо в настройках шаблона прописать количество, пункт меню "Дизайн", далее "Параметры", раздел "Основные" (рис.26).

Рисунок 26.

Тогда в меню будет выведено заданное количество категорий, остальные будут скрыты, отобразятся по клике "Смотреть все категории" (рис.27).

Рисунок 27.

Готово. В данной инструкции мы рассмотрели основные настройки шаблона "Joy".