Задать вопрос

Сообщество поддержки

Статьи, советы, ответы на вопросы и помощь, когда она нужна!

 
 
 

Визуальный редактор

Видео инструкция


Одним из важных моментов создания сайта - является его оформление. Вы можете настроить дизайн сайта используя доступные функции конструктора на платформе ETOV. Рассмотрим подробнее процесс настройки внешнего вида полученного сайта. Перейдем в разделе кабинета «Управление сайтом» подраздел «Конструктор» (http://etov.com.ua/cabinet/settings/constructor) и в самом низу нажмем кнопку «Перейти к конструктору» или же можно нажать на саму картинку шаблонов сайта (http://etov.com.ua/constructor)
Настройка дизайна сайта (Конструктор): раздел 'Конструктор' | ETOV.com.ua

Конструктор состоит из трех основных областей:

  1. Область меню настроек, где по категориям разложены различные настройки сайта (при выборе определенной категории в рабочей области выделяется настраиваемый блок).
  2. Основная рабочая область, где отображается результат сделанных изменений, а так же в этой области производятся некоторые быстрые настройки (Например, мы можем перейти в категорию настройки выбранного блока, нажав на него).
  3. Область с кнопками для сохранения и отмены внесенных изменений

Настройка дизайна сайта (Конструктор): основные области конструктора | ETOV.com.ua

 

Как работать с конструктором? (показать)

Перемещение по конструктору
Перемещение осуществляется с помощью меню настроек. Для переходи в раздел - нажмите на соответствующий пункт. Например, для перехода в раздел «Цветовая гамма» нажмем на него:
Настройка дизайна сайта (Конструктор): Работа с конструктором - перемещение по меню | ETOV.com.ua

Чтобы вернутся к предыдущему уровню меню – нажимаем на текущий пункт:
Настройка дизайна сайта (Конструктор): Работа с конструктором - возврат к главному меню | ETOV.com.ua

Выбранный блок/настройка
При выборе в основном меню некоторого блока для настройки - в рабочей области данный блок выделяется пунктирной рамкой и отобразятся кнопки быстрого редактирования. И наоборот: выбрав блок в рабочей области, путь в меню настроек данного блока изменится автоматически:
Настройка дизайна сайта (Конструктор): Работа с конструктором - выбор блока для настройки | ETOV.com.ua

Кнопки быстрого редактирования
При выборе блока для настройки в рабочей области в углу у него отображаются кнопки быстрого редактирования. Например:

  • Шестеренка настроек:
    С помощью данной кнопки осуществляется переход к окну внесения настроек текущего блока Настройка дизайна сайта (Конструктор): Работа с конструктором - кнопки быстрого редактирования | ETOV.com.ua
  • Положение/сортировка:
    С помощью данной кнопки происходит перемещение блока или же сортировка между другими (как правило, если при наведении на блок курс меняет вид на «четыре стрелки в четыре стороны» - то данный блок можно перемещать/сортировать зажав левую клавишу мыши в области блока) Настройка дизайна сайта (Конструктор): Работа с конструктором - кнопки быстрого редактирования | ETOV.com.ua
  • Изменение расположения блока:
    С помощью данной кнопки происходит изменение расположения блока, например положение бокового меню Настройка дизайна сайта (Конструктор): Работа с конструктором - кнопки быстрого редактирования | ETOV.com.ua
  • Скрытие блока:
    С помощью данной кнопки происходит отключение видимости блока на сайте (вернуть блок можно будет через меню настроек) Настройка дизайна сайта (Конструктор): Работа с конструктором - кнопки быстрого редактирования | ETOV.com.ua
  • Изменение размера блока:
    С помощью данной кнопки происходит изменение размера блока посредством растягивания мышью за указанную кнопку (курсор мыши изменится так же на две стрелки по диагонали)Настройка дизайна сайта (Конструктор): Работа с конструктором - кнопки быстрого редактирования | ETOV.com.ua

Завершающие действия (Сохранить/Выход)
После внесения необходимых настроек в самом низу есть кнопки «Сохранить» и «Выход» для завершения действий.

  • Нажмите «Сохранить», чтобы применить внесенные изменения (вам будет предложен выбор: «Вернуться в кабинет» или «Продолжить редактирование»).
  • Нажмите «Выход», чтоб вернутся без применения настроек.

    Настройка дизайна сайта (Конструктор): Работа с конструктором - кнопки завершения | ETOV.com.ua


Рассмотрим более подробно доступные настройки. В меню настроек нам доступны 3 основных категории - это:

  • «Шаблоны», где можно выбрать уже готовое оформление сайта.
  • «Каркас сайта», где собраны настройки различных блоков сайта.
  • «Цветовая гамма», где есть возможность выбрать цветовую гамму сайта, а также один из предлагаемых фоновых рисунков.

Настройка дизайна сайта (Конструктор): основные категории настроек | ETOV.com.ua


Основные категории настроек:

 

Раздел настроек «Шаблоны» (показать)

Перейдем в раздел «Шаблоны» нажатием на соответствующий пункт в меню настроек. В данном разделе вы можете выбрать один из готовых наборов (шаблонов) сайта. Для удобства шаблоны структурированы по тематике. В поле «Тематика» выберите (1) необходимую (можете воспользоваться поиском), затем нажимаем на интересующем шаблоне (2) для его предпросмотра (вид отобразится в рабочей области):
Настройка дизайна сайта (Конструктор): «Шаблоны» - выбор шаблона | ETOV.com.ua

Чтобы применить выбранный шаблон нажимаем кнопку «Ок», иначе «Отмена»:
Настройка дизайна сайта (Конструктор): «Шаблоны» - выбор шаблона | ETOV.com.ua

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

 

Раздел настроек «Цветовая гамма» (показать)

Перейдем в раздел «Цветовая гамма» нажатием на соответствующий пункт в меню настроек. В данном разделе вы можете выбрать одну из доступных цветовых гамм (цветовых схем) для сайта, а так же выбрать один из доступных фоновых рисунков.

Цветовая схема сайта
Вам доступно на выбор 36 цветовых схем сайта. Для предпросмотра нажмите на соответствующую иконку («ведро с краской»), отображающую цвета используемые в ней (вид отобразится в рабочей области):
Настройка дизайна сайта (Конструктор): «Цветовая гамма» - выбор цветовой схемы сайта | ETOV.com.ua

Чтобы применить выбранную схему нажимаем кнопку «Ок», иначе «Отмена».

Отображение главного меню
Вам доступно отображение главного меню сайта в двух вариантах: отображение пунктов меню на белом фоне (если галочка не установлена) или же на фоне выбранной цветовой гаммы (если галочка установлена). Вид отобразится в рабочей области:
Настройка дизайна сайта (Конструктор): «Цветовая гамма» - выбор отображения меню | ETOV.com.ua

Фоновый рисунок
Чтобы выбрать фоновый рисунок, в разделе «Цветовая гамма» справа в меню настроек нажмите на «Показать список» (или сам рисунок текущего фона).
Настройка дизайна сайта (Конструктор): «Цветовая гамма» - выбор фонового рисунка | ETOV.com.ua

Для предпросмотра нажимаем на интересующий рисунок в списке доступных (вид отобразится в рабочей области):
Настройка дизайна сайта (Конструктор): «Цветовая гамма» - выбор фонового рисунка | ETOV.com.ua

Чтобы применить выбранный фоновый рисунок нажимаем кнопку «Применить», иначе «Отмена»

Вы можете изменить цветовую схему или фоновый рисунок выбранному шаблону. Или же с этих настроек начать создание собственного шаблона.
 

Раздел настроек «Каркас сайта» (показать)

Перейдем в раздел «Каркас сайта» нажатием на соответствующий пункт в меню настроек. И рассмотрим подробнее настройки различных блоков сайта. В частности можем выделить такие настраиваемые области сайта, как:

  1. «Шапка сайта», где можно изменить изображение в шапке сайта, а так же настроить блоки шапки такие, как: «лого», «название или слоган» и телефон.
  2. «Тело сайта», где можно изменить порядок блоков в основной области сайта и настроить витрину товаров.
  3. «Боковое меню», где доступно изменение расположение бокового меню сайта.

Настройка дизайна сайта (Конструктор): «Каркас сайта» - основные блоки сайта | ETOV.com.ua


Настройка блоков раздела «Каркас сайта»:

 

Боковое меню |3| (показать)

Перейдем в раздел «Боковое меню» нажатием на соответствующий пункт в меню настроек. Данная настройка позволяет изменить положение бокового меню сайта (доступно два варианта: слева и справа).

Расположение бокового меню можно изменить несколькими способами: через меню настроек (выбрав нужное расположение) или с помощью кнопки быстрого редактирования (в рабочей области).
Настройка дизайна сайта (Конструктор): «Каркас сайта» - положение бокового меню | ETOV.com.ua

 

Тело сайта |2| (показать)

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

  • блок вводного описания информации о компании;
  • витрина товаров;
  • новости;
  • статьи.

С помощью перетягивания блока вы изменяете его порядок:
Настройка дизайна сайта (Конструктор): «Каркас сайта» - порядок блоков на главной странице | ETOV.com.ua

Витрина
Выбрав в меню блок «Витрина» или же в рабочей области нажав шестеренку свойств - отобразится окно настройки витриын предложений.

В настройках данного блока вы можете указать:

  • размер блоков (вместе с размером изменяется кол-во отображаемых товаров в ряд)
    • маленькие – 4 в ряд
    • средние – 3 в ряд
    • большие 2 в ряд
  • количество отображаемых товаров (от 1 до 50)

Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка витрины | ETOV.com.ua

Чтобы применить настройки нажимаем кнопку «Ок», иначе «Отмена».

 

Шапка сайта |1|: Общие настройки (показать)

Чтобы настроить шапку заходим в пункт меню «Общие настройки» или нажимаем на шестеренке свойств блока:
Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки | ETOV.com.ua

Изображение шапки
Вы можете изменить изображение в шапке на один из предложенных. Для удобства изображения структурированы по тематике. В поле «Тематика» выберите (1) необходимую (можете воспользоваться поиском), затем нажимаем «Показать список» (или на сам рисунок справа - 2):
Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки, смена изображения | ETOV.com.ua

В открывшимся списке нажимаете на интересующем изображении для его предпросмотра (вид отобразится в рабочей области):
Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки, смена изображения | ETOV.com.ua

Чтобы сохранить выбранное изображение - нажимаем кнопку «Применить», иначе «Отмена».

Высота шапки
При необходимости укажите желаемый размер шапки, т.е. ее высоту . Доступные значения от 80 до 350 пикселей:
Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки, высота шапки | ETOV.com.ua

Собственное изображение шапки
Если же вы желаете загрузить собственное изображение в шапку – выберите «Загрузить свой рисунок», затем необходимо выбрать файл изображения на вашем компьютере (минимальный размер 980 пикселей по ширине и 80 по высоте):
Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки, смена изображения на свое | ETOV.com.ua

Далее укажите область которая будет отображаться (вы можете ее переместить и растянуть при необходимости).
Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки, смена изображения на свое | ETOV.com.ua

Чтобы сохранить выбранное изображение - нажимаем кнопку «Применить». Если вы желаете загрузить иное изображение – нажмите кнопку «Удалить фото» и проделайте действия снова.

 

Шапка сайта |1|: Блоки (показать)

Перейдем к настройке блоков шапки сайта, где доступно 3 настраиваемых блока, это:

  • логотип компании
  • название или слоган
  • контактный телефон

Все доступные блоки можно перемещать в пределах области шапки.

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

  • изменение размера, растягивая за уголок;
  • перемещение в нужную область шапки (перетягивая мышью);
  • скрыть блок – нажмите на значок «корзины» (вы всегда сможете вернуть блок, перейдя в соответствующий раздел меню и поставив галочку для отображения).

Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки, блок логотип | ETOV.com.ua

Название или слоган
Вы можете разместить в шапке сайта название вашей компании или ее слоган. Доступные действия:

  • изменение размера, растягивая за уголок;
  • перемещение в нужную область шапки (перетягивая мышью);
  • скрыть блок – нажмите на значок «корзины» (вы всегда сможете вернуть блок, перейдя в соответствующий раздел меню и поставив галочку для отображения);
  • изменение текста блока;
  • выбор размера шрифта;
  • выбора цвета шрифта;
  • выбор цвета подложки.

Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки, блок слоган | ETOV.com.ua

Чтобы применить настройки нажимаем кнопку «Ок», иначе «Отмена».

Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки, блок слоган | ETOV.com.ua

Контактный телефон
В нем отображается контактный телефон компании (или несколько). Контактными телефонами считаются указанные на вкладке «Контактная информация» раздела «Основная информация» вашей компании (http://etov.com.ua/cabinet/company#tab=contactInfo). Доступные действия:

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

Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки, блок телефон | ETOV.com.ua

Чтобы применить настройки нажимаем кнопку «Ок», иначе «Отмена».

Настройка дизайна сайта (Конструктор): «Каркас сайта» - настройка шапки, блок телефон | ETOV.com.ua


Для завершения и сохранения настроек, нажимаем кнопку «Сохранить» внизу конструктора.


Пример внешнего вида сайта после настройки

Настройка дизайна сайта (Конструктор): Внешний вид сайта | ETOV.com.ua

support@etov.com.ua
http://assets2.desk.com/
false
desk
Загрузка
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
false
Найдены недопустимые символы
/customer/ru/portal/articles/autocomplete