Как вам помочь ?
Шаблон "Profit"
В данной статье мы рассмотрим настройки блоков шаблона "Profit":
- Блок "Профит карусель (Шаблон Profit)"
- Блок "Профит преимущества (Шаблон Profit)"
- Блок "Профит СБ с некоторыми категориями (Шаблон Profit)"
Внимание!
Шаблон "Profit" может быть установлен только на магазин версии 5.0.21 и выше. Если Ваш магазин версии ниже, пожалуйста, обновите магазин до последней актуальной версии на момент установки шаблона.
Блок "Профит карусель (Шаблон Profit)"
Рисунок 1.
Баннер на главной странице шаблона "Profit" имеет особенность - он настраивается в статическом блоке, а не в разделе "Дизайн" - "Карусель". Для редактирования блока перейдите в раздел "Дизайн" - "Старницы и блоки" - "Блоки", найдите в списке блок с названием "Профит карусель (Шаблон Profit)" и с ключом доступа "ProfitCarousel" (рис.2), после чего перейдите в его редактирование:
Рисунок 2.
Нажмите на кнопку "Источник", чтобы перейти в редактирование HTML-кода (рис.3):
Рисунок 3.
Теперь рассмотрим, какие параметры вы можете изменять для настройки баннера на главной странице:
Ссылка на изображение (рис. 4).
Рисунок 4.
В какую сторону скрывается текст на слайде при анимации (найдите в коде класс data-hide-transition) (рис. 5). Возможные варианты: up, down, left, right.
Рисунок 5.
Из какой стороны появляется текст при анимации (найдите в коде класс data-show-transition) (рис. 6). Возможные варианты: up, down, left, right.
Рисунок 6.
Стиль текстового элемента на конкретном слайде (размер шрифта - font-size, междустрочный интервал - line-height, цвет - color, толщина шрифта - font-weight) (рис.7).
Рисунок 7.
Время задержки анимации на конкретном элементе (в милисекундах), атрибут data-show-delay (рис.8).
Рисунок 8.
Стили для кнопок на баннере (для всех слайдов) (рис. 9).
Рисунок 9.
Стили:
- font-size - размер шрифта
- color - цвет шрифта
- height - высота блока
- line-height - междустрочный интервал
- width - ширина блока
- background - цвет фона блока
- text-align - выравнивание шрифта
- border - граница блока
Прочие атрибуты не рекомендуется изменять.
Блок "Профит преимущества (Шаблон Profit)
Рисунок 10.
Для редактирования блока перейдите в раздел "Дизайн" - "Страницы и блоки" - "Блоки", найдите в списке блок с названием "Профит преимущества (Шаблон Profit)" и с ключом доступа "ProfitAdvantages" (рис. 11), после чего перейдите в его редактирование:
Рисунок 11.
Нажмите на кнопку "Источник", чтобы перейти в редактирование HTML-кода (рис.12).
Рисунок 12.
Теперь рассмотрим, какие параметры вы можете изменять для настройки данного блока:
Высота самого блока и видео в нём (рис.13). Рекомендуемая минимальная ширина видео - 1920 пикселей (для корректного отображения на большинстве мониторов).
Рисунок 13.
Ссылка на видео (рис.14).
Рисунок 14.
Внимание!
Для корректного отображения в большинстве браузеров видео должно быть загружено минимум в 3 форматах - .webm, .mp4, .ogg (рис. 14). Желательно загружать видео размером до 3-5 мегабайт. Если размер видеофайла будет слишком большим, это может значительно замедлить загрузку страницы, что негативно повлияет как на ранжирование в поисковых системах, так и на удобство для пользователей.
Ссылка на изображение блока (рис.15).
Рисунок 15.
Текст блока (рис.16).
Рисунок 16.
Стили блока. Найдите класс advantage-main, затем атрибут style (рис.17).
Рисунок 17.
Стили изображения в блоке. Найдите тег img, затем атрибут style (рис.18).
Рисунок 18.
Стили для текста под изображением. Найдите тег span, затем атрибут style (рис.19).
Рисунок 19.
Блок "Профит СБ с некоторыми категориями (Шаблон Profit)"
Рисунок 20.
Для редактирования блока перейдите в раздел "Дизайн" - "Страницы и блоки" - "Блоки", найдите в списке блок с названием "Профит СБ с некоторыми категориями (Шаблон Profit)" и с ключом доступа "ProfitSBwithSomeCategories" (рис.21), после чего перейдите в его редактирование:
Рисунок 21.
Нажмите на кнопку "Источник", чтобы перейти в редактирование HTML-кода (рис.22).
Рисунок 22.
Теперь рассмотрим, какие параметры вы можете изменять для настройки данного блока:
Размер и цвет заголовка в блоке (рис.23).
Рисунок 23.
Размер и цвет текста под заголовком блока (рис.24).
Рисунок 24.
Кнопка "подробнее" - изменить можно размер текста, цвет кнопки, размеры кнопки (рис.25).
Рисунок 25.
Кнопка "подробнее" - при наведении (размер, цвет) (рис.26).
Рисунок 26.
При наведении на блок меняется цвет заголовка и появляется прозрачность блока у картинки (рис.27).
Рисунок 27.
В самом блоке можно изменить заголовок (рис.28 п.1), текст под заголовком (рис.28 п.2), текст кнопки (рис.28 п.3).
Рисунок 28.
Фоновое изображение у блока (рис.29), предварительно загрузите его на сайт.
Рисунок 29.
Ссылка куда ведет кнопка подробнее и весь блок (рис.30).
Рисунок 30.
Внимание!
Описанные статические блоки доступны только для десктопной версии, в мобильной версии шаблон стандартный.
Готово. На этом настройка двух блоков на главной странице шаблона "Profit" завершена.
Другие статьи по теме
Тэги: шаблон, профит, profit, оформление, баннер,template, редактирование блоков шаблона, блок с преимуществами,профит, ghjabn