Модуль OnOffer - красиво рассказать о группах товаров

Идея модуля возникла из современных тенденций - всё чаще в конкурентной борьбе онлайн магазины испытывают необходимость захватить внимание посетителя. Существуют разные подходы, и один из них - специально подготовленные, запоминающиеся страницы с краткими рекомендациями что и где находится в нашем магазине. Такой задаче и служит этот модуль.

Купить модуль

1100 грн

Ссылки

Живое демо модуля demo.imperacms.com/onoffer?theme=modules

На демо сайте на широких мониторах слева появляется небольшое окно, где можете переключить фоны страницы. Это даст вам представление о той тональности фона, которая подойдёт именно вашему сайту. Поскольку модуль полностью управляем, то вы сможете заменить картинку фона на свою. Это делается в админпанели на странице дизайн > Файлы картинок, и далее файлы mod-onoffer-bg*.png, где звёздочка означает номер соответствующего фона.

Вот скриншот, как страница модуля с демо сайта выглядит на мониторе.

Как работать с модулем?

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

Затем перейдите в меню страницы > Специальные страницы и нажмите ссылку добавить. В этой новой странице укажите поле "Тип контента" равным "Статическая страница". Далее в поле "Шаблоном" укажите файл модуля mod-onoffer.htm. Потом:

• Введите название страницы - оно станет основным заголовком.
• Введите текст страницы - он станет текстом под основным заголовком.
• Введите текст в поле "SEO текст" - он станет текстом в подвале страницы.

Как грузить картинки?

Когда вы создали страницу, как было описано выше, теперь начните добавлять в неё желаемые фотографии.

• Первая фото - та что появится в шапке сайта. Её оптимальная высота - 220 пикселей.
• Вторая фото - это баннер под текстом заголовка. Высота - 150 пикселей.
• Третья и все далее - те что выведутся в виде подзаголовков. Их высота - 320 пикселей.

Где вводить текст около картинок?

При добавлении фотографий обратите внимание, что там есть поля "Название (alt)" и "Описание фото".

• Если заполнить поле "Название (alt)" - оно станет текстом подзаголовка над картинкой.
• Поле "Описание фото" - станет текстом с боку от картинки.
• Если же перед текстом вставить URL страницы, он станет кнопкой.

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

Несколько советов! Используйте снимки профессиональных фотографов. Их можно приобрести в фото-банках по цене от 1$ за фото. Также существуют фото-банки с бесплатными, но при этом качественными фотографиями. Старайтесь подбирать фото в единой тональности, чтобы страница выглядела как разворот дорогого и модного журнала.

Файлы модуля

Структура папок напоминает структуру шаблона, чтобы модуль мог быть установлен в любой шаблон.

• css
  • mod-onoffer.css - стили модуля
• html
  • mod-onoffer.htm - страница модуля
• images
  • mod-onoffer-demo - папка с демо картинками (можете удалить на реальном сайте)
    • top.jpg - верхняя картинка (в шапке страницы)
    • banner.jpg - картинка баннера
    • group-1.jpg - картинка секции 1
    • group-2.jpg - картинка секции 2
    • group-3.jpg - картинка секции 3
    • group-4.jpg - картинка секции 4
    • group-5.jpg - картинка секции 5
    • group-6.jpg - картинка секции 6
    • about.jpg - нижняя картинка (в подвале страницы)
  • mod-onoffer-bg2.png - картинка фона 2
  • mod-onoffer-bg3.png - картинка фона 3
  • mod-onoffer-bg4.png - картинка фона 4
  • mod-onoffer-bg5.png - картинка фона 5
  • mod-onoffer-bg6.png - картинка фона 6
  • mod-onoffer-nophoto.png - картинка "нет фотографии" для шапки страницы
• js
  • модуль вообще не использует сторонних скриптов

Обсуждение

«Игорь | 10 авг 14:10

Подскажите, вверху модуля есть меню Главная-Каталог-Бренды, а справа похоже номер телефона. Так вот в описании я не нашел где его задавать. Или в код надо лезть?

Ответить

«Impera CMS | 10 авг 18:40

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

То поле с телефоном управляется с помощью конфигурационной настройки phone1. То есть зайдите в админпанель на страницу "настройки > Конфигурационный файл", смотрите параметр phone1 (если у вас нет такого, создайте и введите в нём нужный телефон).

Ответить

«Игорь | 10 авг 21:44

Спасибо. Как всегда удобно.

Ответить

«Стас | 11 авг 18:06

Очень простынка большая выпадает, если брендов около 60. Как уменьшить по вертикали? Может колонками или скрол приделать.

Ответить

«Андрей | 12 авг 08:30

Сколлинг я бы сделал так.
.menu .submenu {
overflow-y: auto;
max-height: 19em;
padding-right: 1em;
}
Это надо добавить в конец mod-onoffer.css.
Будет видно 6 выпавших элементов и скроллер вертикальный.
Max-height я посчитал по формуле 3n+1 эмфазы.

Ответить

«Стас | 12 авг 11:15

О! Спасибо, то что надо.

Ответить

«Наталья | 24 авг 18:54

Как менять порядок блоков?

Ответить

«Антон | 28 ноя 10:10

В файле mod-onoffer.htm дивы местами поменять.

Ответить

«Ирина | 15 дек 20:44

Больше бы таких модулей. бесплатных)

Ответить

Написать комментарий

Ваш комментарий:

Как вас назвать:Код с картинки: Отправить

Нажатием кнопки "Отправить" даю согласие на обработку моих данных службами сайта.

Допустимые теги:опционально парные: [shot=image-url]alt[/shot] [link=page-url]txt[/link]
всегда парные: [quote]src[/quote] [code]src[/code]
одинарные: [youtube=video-url]
и символы: « »

Другие обсуждения »