Документация к готовому решению LeShop для интернет-магазинов на UMI.CMS

Начальные настройки сайта

Почтовые настройки     Регистрация пользователей     Слайдер на главной странице     Плитка на главной странице

Почтовые настройки

В системе UMI.CMS есть три модуля, отвечающих за почтовые настройки. Чтобы почта не попадала в спам, обязательно указывайте адрес в домене сайта. Пример: admin@yourdomain.ru, sale@yourdomain.ru.

ПЕРВЫЙ: В модуле Конфигурация во вкладке Почта есть три поля:

(1) E-mail администратора — на этот адрес будут приходить уведомления об ошибках.
(2) E-mail отправителя — адрес для всей исходящей почты с вашего сайта. Это могут быть новостные рассылки, уведомления о поступившем товаре или снижении цены, подтверждение заказа и т.п.
(3) Имя отправителя — получив письмо, адресат увидит эти данные в поле "От кого".

Изображение: Почтовые настройки в модуле Конфигурация

ВТОРОЙ: Настройки модуля Интернет-магазина, открывающиеся при клике на соответствующую кнопку в правом верхнем углу (путь к настройкам yourdomain.ru/admin/emarket/mail_config/).

(1) E-mail от — этот адрес будет виден адресатам, получающим письма интернет-магазина. Необходимо указывать валидный e-mail адрес.

(2) Имя от — это имя будет присутствовать в поле "От кого" во всех письмах модуля интернет-магазина.

(3) E-mail менеджера — здесь можно указать электронный адрес ответственного менеджера. Ответственный менеджер — администратор, отвечающий за работу с заказами. Ему будут приходить уведомления по почте о каждом заказе, сделанном с сайта, и изменениях статусов.

Изображение: Настройка почтовых адресов в модуле Интернет-магазин

ТРЕТИЙ: Модуль Конструктор форм. Во вкладке Списки адресов можно задать перечень адресов. Адреса могут быть перечислены через запятую.

Изображение: Конструктор форм — список e-mail адресов

В следующей вкладке Формы необходимо к каждой форме привязать адрес получателя. Если адрес к форме не привязан, будет возникать ошибка.

Изображение: Привязка адреса к форме

Регистрация пользователей на сайте

В настройках модуля Пользователи можно поставить/снять галочку «Регистрация пользователей без активации».

Регистрация на сайте с подтверждением по e-mail или без подтверждения

Если галочка снята, пользователю сразу после регистрации приходит письмо-подтверждение, шаблон которого можно отредактировать в модуле LeShop вкладке E-mail.

Настройка письма о регистрации пользователей

Слайдер на главной странице

Возможно 2 типа отображения слайдера на главной:

  • с шириной изображения на весь экран;
  • с шириной изображения по ширине контента.

Также возможно 2 варианта использования слайдера:

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

Изображение: Отображение слайдера на Главной странице готового решения LeShop

Настройки слайдера находятся в модуле LeShop > вкладке Настройки шаблона > подраздел Слайдер. Здесь задаются общие данные для всех слайдов: Заголовок (1), Подзаголовок (2), Текст (3), Ссылка кнопки (4), Текст на кнопке (5).

Также доступна настройка смены интервала между слайдами в секундах (6).

Слайдеру фиксированному по высоте можно задать собственную высоту (7), настройка по умолчанию равна 420px.

Изображение: Настройки слайдера на Главной странице в модуле LeShop

Тип слайдера (8). Доступно 2 варианта отображения:

a) слайдер фиксированный по высоте имеет поверх текстовые поля (это фоновое изображение с шириной картинки 1920px). Высота задаётся настройкой (7) и не изменяется при сужении окна браузера.

б) слайдер фиксированный по ширине имеет ширину 940px в максимальном разрешении и изменяет ширину и высоту пропорционально ширине окна браузера. Соответвенно на маленьких разрешениях экрана информация может быть нечитаемой (слайдер будет очень низким по высоте). Поэтому предусмотрена настройка перехода ширины на мобильную версию (9). Если задано 0px, перехода не будет. Если задать 500px, то начиная с этой ширины будет отображено второе подгруженное изображение для мобильной версии.

Изображение: Адаптивный слайдер на главной странице готового решения LeShop

Подгрузка изображений для слайдера осуществляется в модуле Структура сайта: используется группа страниц Фотографии слайдера на главной.

Изображение:

В блоке Фотография для слайдера необходимо подругрузить изображения:

(1) в зависимости от типа отображаемого слайдера должно быть загружено изображение для десктопа либо с разрешением 1920px либо 940 px.

(2) мобильное изображение будет доступно к отображению, если выбран слайдер фиксированный по ширине и указано значение перехода на мобильную версию. Ширина мобильного изображения должна быть равна значению перехода на мобильную версию.

В блоке Настройки слайда для слайдера фиксированного по высоте можно задать индивидуальные настройки текста над картинкой: Заголовок (3), Подзаголовок (4), Текст (5), Текст на кнопке (6), Ссылку кнопки (7). Если какое-то из полей останется незаполненным, будут использованы общие данные Настроек слайдера из модуля LeShop. Индивидуально для каждого слайда поля заполняются, если необходимо сделать несколько акций с разными текстами и ссылками.

Изображение: Задание свойств индивидуально для каждого изображения

Плитка на главной странице (расширенный вариант)

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

Изображение: Плитка на главной странице — свободное конструирование

Для управления модулем Плитка на главной странице используется система справочников UMI.CMS, расположенная в модуле Шаблоны данных.

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

Изображение: Открыть содержание справочника Плитка на главной

После перехода к содержанию справочника Плитка на главной для создания нового элемента справочника нажмите кнопку Добавить наименование справочника.

Изображение: Добавить наименование справочника

Откроется отдельная страница.

Изображение: Редактирование элемента справочника Плитка на главной

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

Название — выводится в левом верхнем углу элемента на сайте.

Изображение: Название блока в Плитке на главной

Родитель — возможность указать другой элемент в качестве "родителя" данного элемента. Это необходимо для создания сложной структуры плитки. Чтобы выбрать родителя, его нужно предварительно создать.

На примере ниже показан пример вложенности элементов в родителей. Имеется родитель №3 самого верхнего уровня с шириной 100% и высотой 200px. Вложенные родители №1, №2 и элемент №3 должны поделить между собой ширину таким образом, чтобы в сумме получалось 100%. Вложенные элементы оранжевого и зелёного цвета занимают 100% ширины родителей №1 и №2, но при этом делят доступную высоту таким образом, чтобы в сумме получилось 200px.

Количество вложенностей можно увеличивать. Например, вместо элемента №1 можно создать родителя со 100% шириной и вложить в него 2 элемента с шириной по 50%.

Изображение: Пример расположения элементов в Плитке на главной

Параметры высоты и ширины должны приписываться каждому элементу и родителю.

Ширина в % — произвольное значение в процентах. По дизайн-макету рекомендуется задавать ширину элемента равную 100%, если элемент не имеет родителя или если это родитель самого верхнего уровня.

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

Изображение — задаётся изображение элементу. Подробные рекомендации по подготовке изображений.

Ссылка — задаётся ссылка на любой элемент структуры сайта.

Порядок — задание последовательности элементам слева направо и сверху вниз с помощью числовых значений.

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

Группа Мобильное разрешение:

Ширина мобильной версии — здесь необходимо указать произвольное значение в пикселях, например, 500px. На экранах с разрешением до указанного значения элемент будет выведен с мобильными значениями ширины и высоты.

Ширина в % (моб) — ширина элемента в мобильной версии.

Высота в px (моб) — высота элемента в мобильной версии.

 

После наполнения справочника для удобства редактирования данных можно вывести все доступные свойства для отображения в таблицу. Для этого нажмите на плюсик (1) в правой части таблицы и кликните на значение в выпадающем списке (2). После вывода всех полей полноценное редактирование элементов возможно также с помощью экспорта и импорта CSV.

Изображение: Поля для редактирования данных для Плитки на главной

Рекомендации по подготовке изображений для плитки

В настройках элемента справочника возможно задание высоты (в пикселях) и ширины (в процентах).

Расчёт ширины загружаемого изображения при 100% ширине элемента:

Максимальная ширина внутреннего контента сайта составляет 940px. При наведении на элемент с изображением происходит увеличение картинки в 1.3 раза, то есть до 1222px по ширине. Такую ширину и нужно задать изображению, чтобы оно было качественным, но при этом максимально компактным.

Расчёт высоты загружаемого изображения:

Высота изображения должна рассчитываться исходя из произвольных настроек. Например, в настройках указана высота 200px для элемента. При увеличении изображения в 1.3 раза при наведении высота составит 260px. Если будет загружено изображение большей высоты, например, 400px, изображение будет центрировано по высоте, а верх и низ обрезан и недоступен к просмотру.

Значимые элементы на изображении следует располагать в области 940px194 пикселей, чтобы при наведении на изображение, они остались в видимой области.

 

Изображение: Определение размеров элемента