Готовый интернет-магазин автозапчастей со всеми функциями Инструмент для успешной торговли автозапчастями
IV. Настройки сайта

Справочный центр

Базовые настройки

С помощью базовых настроек конструктора внешнего вида вы сможете самостоятельно оформить «шапку» сайта, футер (нижнюю часть), поменять фон и цвет текста и ссылок на сайте.
Иконка сайта — favicon: небольшое изображение, которое отображается в закладках браузера, а также в поисковых системах.
Загрузить иконку можно файлом (изображением) формата .png, .jpg. Оптимальным вариантом является небольшое квадратное изображение без мелких деталей.

Структура и оформление страницы

Для оформления сайта необходимо ознакомиться с его структорой.

Сайт — это общее название всех страниц магазина. Соответственно, оформление сайта одинаково на всех страницах. Тянется на весь экран. На скрине показано серым цветом.

Центральный блок — блок с содержимым сайта. Включает в себя шапку, контент и футер (нижнюю часть). Ширина задается настройкой «Сетка сайта». Един для всех страниц. На скрине показан бирюзовым цветом.

Шапка — верхняя часть сайта. Едина для всех страниц. Ширина соответствует ширине центрального блока. По высоте не ограничена.

Футер — нижняя часть сайта. Един для всех страниц. Ширина соответствует ширине центрального блока. По высоте не ограничен.

Контент — блок с содержимым страницы. На каждой странице свой.

Левый блок — блок со служебными элементами — меню, баннеры, новости. Един для всех страниц.


«Сетка сайта» позволяет выбрать желаемую ширину вашего магазина. Размер можно выставлять в процентах и пикселях.

Пиксели четко фиксируют ширину центрального блока, независисмо от ширины экрана, а ширина, заданная в процентах, будет высчитываться, исходя из ширины окна браузера. Более подробно об этом написано здесь.

Следующая настройка «Фон сайта». Задает фон для всей страницы. Грубо говоря, эта настройка «заливает» все пустое пространство по бокам страницы.

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

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

Возьмем для примера следующие настройки:

«Сетка» сайта — 1200 пикеслей

Фон сайта — цвет (#b9eafa — бирюзовый)

Центральный блок — цвет (#ffffff — белый)

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

Блок «Контент»

Данный блок включает в себя следующие настройки.

Фон — можно сделать цветным, либо оставить прозрачным.

Заголовки — можно задать цвет, шрифт, размер шрифта, наклонное или жирное начертание.

Текст — можно задать цвет, шрифт, размер шрифта, наклонное или жирное начертание.

Ссылки — можно задать цвет, шрифт, размер шрифта, наклонное или жирное начертание.

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

 

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

Для примера произведем настройки контента.

Стрелочками указаны измененные параметры.

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

Слева — сайт с настройками по-умолчанию. Справа — сайт после применения настроек из примера (добавлена форма поиска, увеличен размер и изменено семейство шрифта,  а также изменен цвет ссылок и заголовков).

Блок «Шапка сайта»

В шапке сайта можно настроить высоту (ограничений нет). Цвет текста, цвет ссылок и фон.

Все настройки применяются только к этому блоку.

Ниже показан пример настроек (стрелочками указаны измененные параметры).

Шапка сайта с примененными настройками на странице магазина

Блоки: «Меню», «Логин форма», «Пользовательское меню»

Блок «Меню» — отвечает за настройку основного меню магазина. Включает в себя следующие параметры — настройки фона меню, текста меню и ссылок меню. Все настройки применяются только к этому блоку.

Блок «Логин форма» — отвечает за настройку блока авторизации и блока с данными пользователя. Включает в себя следующие параметры — настройки фона меню, текста меню и ссылок меню. Все настройки применяются только к этим блокам.

Блок «Пользовательское меню» — отвечает за настройку меню пользователя магазина. Включает в себя следующие параметры — настройки фона меню, текста меню и ссылок меню. Все настройки применяются только к этому блоку.

Параметры настроек всех трех блоков идентичны по своей структуре, поэтому приведем в пример настройки только одного из них («Меню»). Кроме того, в этом блоке есть настройка для вложенных пунктов. На скрине она выделена.

При выставленных в примере настройках, меню будет выглядеть следующим образом:
По умолчанию блок меню содержит все страницы магазина. Для удобства пользователя каталоги можно вынести в отдельный блок. Это можно сделать, активировав настройку «Сгруппировать каталоги в отдельном меню».

Блок «Нижняя часть сайта»

В настройках нижней часть сайта (футера) можно задать нужную высоту (ограничений нет), цвет текста, ссылок и фон.

Ниже приведен пример настроек. Измененные параметры указаны стрелками.

Пример отображения:

Блок «Таблицы»

Блок настроек «Таблицы» включает в себя настройки для таблиц каталогов и корзины.

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

Ниже приведен пример настроек данного блока.

Пример отображения таблицы с примененными настройками на странице «Корзина».

Блок «Страница «Поиск по номеру»

Данный блок настроек определяет вид таблицы проценки. Здесь можно выбрать цвет для кнопки «Корзина», фон и цвет для блока «Выбор группы товара», а также определить цветовые настройки для запчастей в наличии и на заказ.

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

А для быстрого возврата к началу страницы можно включить кнопку «наверх». Так же выделено рамкой.

Пример отображения страницы проценки с данными настройками.
Читайте дальше → Расширенные настройки

Настройки сайта: Внешний вид