Top.Mail.Ru

Редактор сайта

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

  1. Как перейти в редактор сайта
  2. Общий вид редактора сайта
  3. Шапка редактора
  4. Панель настроек
  5. Панель виджетов

Как перейти в редактор сайта

Перейдите в раздел Дизайн и около нужного шаблона нажмите «Настроить»:

Если этой кнопки рядом с названием шаблона нет, можно нажать «Действие» и далее выбрать пункт «Настроить»:

Другой способ попасть в настройки – нажать кнопку «Редактор сайта» в админ-панели, находясь на сайте:

Общий вид редактора сайта

Шапка редактора сайта

Верхняя часть редактора сайта отвечает за навигацию и выбор отображения сайта.

Бэк-офис - позволяет вернуться в бэк-офис.

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

Страница - включает отображение сайта на выбранной странице.

Крестик - закрывает редактор сайта.

Панель настроек шаблона

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

  1. Иконка (favicon)
  2. Логотип
  3. Шапка
  4. Подвал
  5. Промо слайдер
  6. Instagram
  7. Каталог
  8. Карточка товара
  9. Блог, статья
  10. Соц. сети
  11. Маска для поля телефон
  12. Цвета
  13. Шрифты

Иконка (favicon)

Позволяет загрузить фавикон, который будет отображаться во вкладке браузера и в поиске:

Логотип

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

Шапка

Пермалинк меню указывает, какое меню выводить в всплывающем окне при нажатии на "бургер":

Показывать меню - отвечает за отображение меню во всплывающем окне (см. предыдущий скриншот).

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

Подвал

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

Лого вариантов оплаты - включает отображение указанных логотипов способов оплаты. Можно загрузить свои изображения.

Промо слайдер

Отвечает за включение и настройку автоматического переключения слайдов в слайдере.

Instagram

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

Данный блок Instagram присутствует в шаблонах Fleur, Cross, InstaShop и Simple.

Каталог

Большинство настроек интуитивно понятно. Рассмотрим на скриншоте, на какие элементы влияют настройки:

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

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

Кнопка купить - позволяет выбрать отображение кнопки "купить" в карточке товара с нулевым остатком.

Доступны варианты:

  • показать (кнопка "купить" будет отображаться);
  • скрыть (кнопка "купить" скроется и выведется надпись "товар отсутствует");
  • предзаказ (кнопка "купить" заменится на "предзаказ", при нажатии на "предзаказ" откроется форма для сборка контактных данных клиента, информация о товаре и контактные данные клиента придут в письме на почту администратора магазина).

Фотогалерея, вариант вывода - позволяет выбрать тип увеличения изображение товара.

Фотогалерея, сторона вывода - позволяет выбрать с какой стороны карточки товара выводить его изображения.

Свойства товара, вариант вывода - доступны два варианта отображения вариантов товара.

Плиткой:

Выпадающим списком:

Блог, статья

Высота статей - позволяет выбрать каким образом выводить статьи. 

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

Количество статей на странице - позволяет выбрать количество отображаемых на странице статей.

Соц.сети

В данном разделе указываются ссылки на профили магазина в социальных сетях. Значки социальных сетей выводятся в футере сайта:

Маска для поля телефон

Настройка маски влияет на отображение поля для ввода номера телефона клиента при оформлении заказа:

Цвета

Палитра позволяет настроить цветую гамму сайта. Большинство настроек интуитивно понятны. 

Шрифты

Шрифт - позволяет выбрать шрифт текста на сайте.

Размер шрифта - позвляет выбрать размер шрифта текста на сайте.

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

Панель виджетов

Панель виджетов позволяет добавлять и настраивать виджеты на главной странице сайта.

При наведении курсора на виджет у него подсветится рамка и появятся кнопки управления:

1,7 - свернуть панель управления

2 - переместить виджет вниз/вверх

3 - название виджета

4 - редактировать виджет

5 - скрыть виджет

6 - удалить виджет

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

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

Рассмотрим основные из них.

  1. Слайдер
  2. Спец. категории
  3. Подборки товаров/Товары на главной
  4. Преимущества компании
  5. Картинка с текстом/О нас
  6. Отзывы
  7. Форма заявки

Слайдер

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

1. Перейдите в редактор сайта. Подробнее

2. Нажмите на плюс в месте, где хотите добавить виджет. Выберите "Слайдер" и создайте новую панель блоков: 

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

3. Для каждого слайда добавьте отдельный блок:

4. Заполните данные каждого слайда:

Заголовок - используется для названия блока, в некоторых шаблонах может выводиться на слайде.

Контент - выводится на слайде (если не получается заполнить поле, попробуйте сначала загрузить изображение для слайда).

Ссылка - ссылка на одну из страниц сайта, по которой пользователь может перейти, нажав на слайд.

Текст ссылки - если в шаблоне на слайдере выводится кнопка для ссылки, то на ней будет выводиться данный текст.

Изображение - фон слайда.

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

И в заголовке вкладки зачастую можно увидеть размер изображения в пикселях:

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

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

Спец. категории

Виджет предназначен для вывода категорий на главной странице в виде плитки.

1. Перейдите в редактор сайта. Подробнее

2. Нажмите на плюс в месте, где хотите добавить виджет. Выберите "Спец.категории" и создайте новую панель блоков:

3. Создайте под каждую категорию отдельный блок и выберите какую подкатегорию нужно выводить:

Подборки товаров/Товары на главной

Виджет предназначен для вывода конкретных товаров на главной странице.

1. Перейдите в редактор сайта. Подробнее

2. Нажмите на плюс в месте, где хотите добавить виджет. Выберите "Товары на главной" и создайте новую панель блоков:

3. Выберите из какой категории выводить товары (под каждую категорию нужно создавать отдельный блок):

Важно: если нужно вывести не товары из определенной категории, а конкретный набор товаров из разных категорий, то можно создать скрытую категорию (например, "товары на главной" или "популярное"), добавить в нее все необходимые товары и выбрать ее в настройках виджета.

Преимущества компании

Виджет используется для вывода уникального торгового предложения.

1. Перейдите в редактор сайта. Подробнее

2. Нажмите на плюс в месте, где хотите добавить виджет. Выберите "Преимущества компании" и создайте новую панель блоков:

3. Заполните информацию о каждом преимуществе:

Загрузите подходящую иконку и ввести формулировку преимущества в соответствующем блоке преимущества.

Картинка с текстом/О нас

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

1. Перейдите в редактор сайта. Подробнее

2. Нажмите на плюс в месте, где хотите добавить виджет. Выберите "Картинка с текстом" и создайте новую панель блоков:

3. Заполните данные виджета:

Вертикальная позиция картинки - позиция картинки относительно текста: снизу, сверху или посередине.

Скрыть картинку - можно отключить вывод изображения.

Текст - текст, который выводится около изображения в виджете.

Горизонтальная позиция картинки - позиция картинки относительно текста: слева или справа.

Картинка - загруженное изображение.

Отзывы

Используется для вывода нескольких отзывов клиентов на главной странице.

1. Перейдите в редактор сайта. Подробнее

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

3. Для каждого отзыва создается отдельный блок. Заполните каждый блок информацией о соответствующем отзыве:

Скрыть картинку - можно не отображать изображение клиента.

Позициия картинки - расположение изображения относительно текста отзыва.

Форма заявки

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

1. Перейдите в редактор сайта. Подробнее

2. Нажмите на плюс в месте, где хотите добавить виджет. Выберите "Форма заявки" и создайте новую панель блоков:

3. Добавьте один блок и укажите текст для кнопки:

Оставить оценку

Оценка успешно отправлена.
Она будет проверена администратором перед публикацией.
Перед публикацией все оценки проходят модерацию

Оценки: 0

Остались вопросы?
Отправь тикет в техподдержку!
Еще нет своего магазина?
Создайте интернет-магазин на платформе InSales
Всё для продаж уже внутри!
Недавно просмотренные статьи