К основному содержимому
Все коллекцииРедактор дизайна
Общие настройки дизайна
Общие настройки дизайна

Основные настройки цвета и текстовых элементов сайта

Обновлено на этой неделе

Общий визуальный стиль сайта настраивается в Сайт → Дизайн → Редактор дизайна → Общие настройки.

Общие настройки дизайна — Хорошоп

В блоке Общие настройки собраны параметры, которые будут влиять сквозным образом на все соответствующие элементы на сайте, а именно:

  • Текст и фон сайта;

  • Стиль отображения ссылок;

  • Стиль кнопок и полей форм на сайте;

  • Стиль блоков сайта;

  • Стиль навигации для переключения баннеров;

  • Стиль определенных элементов карты товара.

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

В настройках определенный цвет всегда отображается в формате HEX.

Настройки Текст и фон

В этом разделе вы можете определить основные настройки для стиля фона и текста на сайте.

Шрифт

  • Шрифт — выбор одного из 12 предустановленных шрифтов.

  • Основной текст — выбор цвета основного текста сайта.

  • Дополнительный текст — выбор цвета вспомогательного текста (подсказки, названия характеристик и т.д.).

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

Редактор дизайна — Текст и фон — Хорошоп

Заголовки

  • Заголовки первого уровня (H1) — выбор цвета заголовков H1, например, название товара на странице товара, новости и др.

  • Заголовки второго уровня (H2) — выбор цветов заголовков H2, это подзаголовки или заголовки отдельных блоков на странице.

Фон страниц

  • Фон страниц сайта — определение цвета общего фона страниц сайта.

  • Фон главной страницы — определение цвета главной страницы сайта.

  • Фон страницы 404 — определение цвета фона страницы, на которую попадают посетители сайта в случае, если ссылка на страницу сайта неверна или страницы не существует.

Ссылки

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

Редактор дизайна — Ссылки — Хорошоп

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

  1. Навигационные ссылки — ссылки, которые используются для навигации по страницам сайта: названия разделов каталога, товаров, страниц и т.д.

  2. Ссылки в тексте — ссылки в текстах: описаниях товаров, seo-текстах и т.д.

  3. Функциональные ссылки — ссылки, при нажатии на которые выполняется определенное действие на сайте: Написать отзыв, Добавить в избранное, Добавить к сравнению и т.д.

Кнопки и элементы форм

Для кнопок можно определить цвет кнопки, цвет текста на ней, цвет рамки вокруг кнопки (обводка) и размер скругления кнопки.

Редактор дизайна — Кнопки и элементы форм — Хорошоп

Параметры задаются отдельно для каждого типа кнопок.

  1. Основные кнопки — любые основные кнопки на сайте, например, Купить, Отправить и т.д.

  2. Дополнительные кнопки — дополнительные кнопки в интерфейсе, например кнопка Все бренды, кнопки фильтров, модификаций и т.д.

  3. Поля в формах — настройка полей для ввода/выбора в формах на сайте. Для полей в формах можно задать только радиус скругления.

Примеры настроек скругления

Без скругления

S

M

L

Блоки и навигация

В этом блоке совмещены настройки:

  • Визуальный стиль блоков — части страницы сайта, где элементы объединены общей рамкой.

  • Навигация в баннерах — настройка переключателей между баннерами в баннерных линиях.

Стиль отображения пагинации в баннерах

Круг

Диск

Стиль отображения стрелок в баннерах

Стрелка

Тонкая стрелка

Контурная кнопка

Тонкая контурная кнопка

Кнопка

Кнопка с отступом

Треугольник

Контурный треугольник

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

В этом блоке можно настроить определенные общие параметры для карточек товара на сайте. А именно: цвет звезд рейтинга товаров, цвет основной и акционной цены.

Редактор дизайна — Карточки товаров — Хорошоп

Настройки для стикеров

  • Стиль стикеров — выбор стиля настройки стикеров, доступны 5 стилей;

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

Другие элементы

В этом блоке можно выбрать вариант отображения цвета иконок в блоках контактных данных: цветные или монохром (ч/б).

Редактор дизайна — Другие элементы — Хорошоп

Нашли ответ на свой вопрос?