Расширенные Баннеры Документация

Установка – вверх

1. Загрузка

1. Скачайте модуль
2. Перейдите в Панель Администратора > Модули > Управление модулями
3. Нажмите на [+] чтобы открыть диалоговое окно загрузки
4. Выберите удобный для вас способ:
   – Загрузить: zip архив храниться на вашем компьютере
   – Сервер: zip архив храниться на вашем сервере
   – URL: у вас есть прямая ссылка на zip архив
5. После того как вы выбрали zip архив для соответствующей версии CS-Cart, пожалуйста, нажмите кнопку Загрузить и установить
6. Очистите кэш, выберите Администрирование > Хранилище данных > Очистить кэш

2. Активация лицензии

1. Откройте страницу настроек модуля Панель Администратора > Модули > Управление модулями >
   [TH] Extended Banners
2. Во вкладке Активация введите Номер лицензии
3. Сохраните настройки и вернитесь на страницу Управление модулями
4. В строке с названием модуля, выберите Вкл.
5. Очистите кэш, выберите Администрирование > Хранилище данных > Очистить кэш

Далее необходимо создать и настроить баннеры и создать блок в макетах
При необходимости внешний вид карусели можно изменить в настройках модуля

Так же примеры баннеров вы можете посмотреть в админке демо

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

Типы баннеров – вверх

Начиная с 1.06 баннеры распологаются Маркетинг > Расширенные Баннеры
Модуль добавляет следующие типы баннеров:

• Текст и Графика
• Текст и Фон
• Текст и Фон (Основа изображение)
• Текст и Видео Фон
• Текст и Видео Фон (Основа видео)

Для всех баннеров вы можете задать собственный класс и стилизовать его

Текст и Графика

Этот вид баннеров лучше всего подходит для презентации продуктов

Баннер состоит из 4 ключевых элементов:

• Основного изображения
• Фонового изображения (загружать не обязательно, тогда у баннера будет прозрачный фон)
• Секции с текстом (заголовок, подзаголовок и текст). Не требуется заполнять все поля
• Кнопки (появляется тогда когда заполнены поля Текст кнопки и URL)

Для десктопа меняется порядок вывода основного изображения и текстовой секции
Фон текста отображается только для мобильного вида

Для демо мы использовали такие размеры картинок:

• 564x564px – основное изображение
• 1200x564px – фоновое изображение

Для своих баннеров вы можете использовать другие размеры

Текст и Фон

Этот вид баннеров лучше всего подходит для маркетинговых целей: презентации сильных сторон компании, показа категорий, акций и дополнительной информации

Баннер состоит из 3 ключевых элементов:

• Фонового изображения
• Секции с текстом (заголовок, подзаголовок ). Не требуется заполнять все поля
• Кнопки (появляется тогда когда заполнены поля Текст кнопки и URL)

Вы можете изменять позицию текста изменяя выравнивание
Фон для текста применяется для всех разрешений

Для демо мы использовали такие размеры:

• 1200x564px – фоновое изображение
• 576px – минимальная высота баннера для ПК
• 450px – минимальная высота баннера для планшета
• 185px – высота секции с изображением для телефона

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

Текст и Фон (Основа изображение)

Этот вид баннеров лучше всего подходит для маркетинговых целей: презентации сильных сторон компании, показа категорий, акций и дополнительной информации

Баннер состоит из 3 ключевых элементов:

• Фонового изображения
• Секции с текстом (заголовок, подзаголовок ). Не требуется заполнять все поля
• Кнопки (появляется тогда когда заполнены поля Текст кнопки и URL)

Вы можете изменять позицию текста изменяя выравнивание
Фон для текста применяется для всех разрешений

Для демо мы использовали такие размеры:

• 1200x564px – фоновое изображение

Для своих баннеров вы можете использовать другие размеры, изображение для фона задает размеры баннера

Текст и Видео Фон

Этот вид баннеров лучше всего подходит для маркетинговых целей: презентации сильных сторон компании, показа категорий, акций и дополнительной информации

Баннер состоит из 4 ключевых элементов:

• Ссылок на видео (формат mp4 обязателен, остальные вспомогательные)
• Фонового изображения (отображается для мобильных устройств, можно использовать анимированные gif)
• Секции с текстом (заголовок, подзаголовок ). Не требуется заполнять все поля
• Кнопки (появляется тогда когда заполнены поля Текст кнопки и URL)

Важно: Фоновое изображение является обязательным

Вы можете изменять позицию текста изменяя выравнивание
Фон для текста применяется для всех разрешений

Для демо мы использовали такие размеры:

• 1200x564px – фоновое изображение и видео
• 576px – минимальная высота баннера для ПК
• 450px – минимальная высота баннера для планшета
• 185px – высота секции с изображением для телефона

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

Инструкция по добавлению видео в CS-Cart

Текст и Видео Фон (Основа видео)

Этот вид баннеров лучше всего подходит для маркетинговых целей: презентации сильных сторон компании, показа категорий, акций и дополнительной информации.

Баннер состоит из 4 ключевых элементов:

• Ссылок на видео (формат mp4 обязателен, остальные вспомогательные)
• Фонового изображения (отображается для мобильных устройств, можно использовать анимированные gif)
• Секции с текстом (заголовок, подзаголовок ). Не требуется заполнять все поля
• Кнопки (появляется тогда когда заполнены поля Текст кнопки и URL)

Важно: Фоновое изображение является обязательным

Вы можете изменять позицию текста изменяя выравнивание
Фон для текста применяется для всех разрешений

Для демо мы использовали такие размеры:

• 1200x564px – видео
• 1200x564px – фоновое изображение

Для своих баннеров вы можете использовать другие размеры, видео и изображение для фона задают размеры баннера

Настройки блока – вверх

Для того что бы новые банеры отображались, в блоке необходимо выбрать шаблон Расширенная Карусель. Либо создать новый блок с таким шаблоном.

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

Настройки модуля – вверх

В настройках модуля вы можете изменить размер текста для различных разрешений экрана. Это делается в соответствующих вкладках.

Так же, вы можете настроить элементы управления каруселью.
Возможно настроить цвета и размеры стрелок и точек. Вы можете изменить стрелки на свои, для этого замените svg код на свой или иконочный шрифт.
В svg коде после символов { должен стоять пробел.
Если необходимо убрать фон для стрелок, то в поле цвета укажите none.

Изменение CSS – вверх

Файлы стилей не должен быть изменены, это может привести к некорректной работе модуля. Если необходимо переопределить или добавить стили, пожалуйста, используйте Редактор тем

1. Перейдите в Дизайн > Темы
2. Нажмите кнопку Редактор тем рядом с активным макетом
3. В новой вкладке, вы увидите свой магазин с панелью Редактор тем
4. В выпадающем списке РЕДАКТИРОВАТЬ выберете Пользовательские CSS
5. В текстовое поле вы можете добавить свои стили
6. После редактирования сохраните изменения, нажав Сохранить и нажмите [X] чтобы закрыть редактор

K) Обновление модуля – вверх

Начиная с версии 1.05 обновления устанавливаются через Центр обновлений

Администрирование > Центр обновлений

• сделайте полный бекап магазина
• закройте магазин
• установите модуль поверх старой версии не удаляя предыдущую
• обновите кэш
• по необходимости внесите изменения, которые могут быть стерты при обновлении, если вы изменяли файлы модуля напрямую
• проверьте что все удачно обновилось
• откройте магазин

Для обновления языковых переменных и настроек модуля:

• Перейдите в девелоперский режим
• Для этого в файле local_conf.php добавьте define(‘DEVELOPMENT’, true);
  В случае отсутствия файла создайте его
• Обновите кэш
• На странице модулей в выпадающем списке напротив модуля выберите “Обновить”
• Вернитесь в обычный режим магазина

Список изменений

1.06 (23 Aug 2021)
Переместили баннеры модуля в отдельный раздел, для лучшей совместимости с продуктами других компаний
Новый путь:  Маркетинг > Расширенные Баннеры

1.05 (12 Jun 2021)
На мобильных устройствах видео фон проигрывается сразу
Интегрировали систему обновления через Центр Обновлений

1.04 (09 Dec 2020)
Обновили модуль для совместимости с CS-Cart 4.12.1
Требуется переустановка модуля для CS-Cart Multivendor Ultimate

1.03 (11 Jun 2020)
Добавили вертикальное выравнивание текста и изменение отступов для видов:
- Текст и Фон (Основа изображение)
- Текст и Видео Фон (Основа видео)
- Текст и Фон
- Текст и Видео Фон

1.02 (12 May 2020)
Добавили два новых вида:
- Текст и Фон (Основа изображение)
- Текст и Видео Фон (Основа видео)
Добавили у баннера поле для ввода пользовательского CSS-класса

1.01 (07 May 2020)
Увеличили отступы для текста
Изменили стили
Исправили совместимость с ThinTheme

1.00 (04 May 2020)
Релиз