Купить Корзина
Логотип REG.RU
  • Вход
    • Помощь
  • Помощь
  • Конструктор и CMS
  • REG.Site
  • Работа с модулями REG.Site
  • Как создать сайдбар в REG.Site

Как создать сайдбар в REG.Site

Сайдбар (англ. sidebar) – это боковая панель на сайте. Здесь может располагаться:

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

Sidebar устанавливается справа или слева от контента.

Настройка сайдбара проходит в 3 этапа:

  1. Настройка виджетов в WordPress.
  2. Добавление сайдбара на страницу.
  3. Настройка внешнего вида.

Этап 1. Настройка виджетов в WordPress

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

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

  1. 1.

    Перейдите в админку WordPress во вкладку Внешний вид ― Виджеты:

    Как создать сайдбар в REG.Site 1

  2. 2.

    Чтобы добавить элемент, нажмите на плюс:

    Как создать сайдбар в REG.Site 2

  3. 3.

    Перед вами появится список доступных элементов и виджетов. Если вам мало стандартных виджетов, можно установить дополнительные с помощью плагинов или кода. Добавим стандартный виджет поиск:

    Как создать сайдбар в REG.Site 3

  4. 4.

    Настройте основные параметры элемента. У каждого элемента они разные. Например, в виджете «поиск» можно:

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

    Как создать сайдбар в REG.Site 4

  5. 5.

    Количество виджетов и элементов в сайдбаре неограниченно. Добавляйте виджеты в том порядке, в котором они должны отображаться на сайте. Например, на скриншоте ниже мы добавили два виджета (поиск, последние записи) и заголовок к списку публикаций. Сначала будет отображаться виджет поиска, а потом заголовок и последние записи:

    Как создать сайдбар в REG.Site 5

  6. 6.

    Чтобы переместить блок, нажмите на стрелочки вверх и вниз или на иконку с точками:

    Как создать сайдбар в REG.Site 6

  7. 7.

    Сохраните изменения. Для этого нажмите Обновить:

    Как создать сайдбар в REG.Site 7

Готово, теперь можно добавлять сайдбар на сайт.

Этап 2. Добавление модуля на сайт

  1. 1.
    Перейдите в режим редактирования сайта.
  2. 2.

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

    Как создать сайдбар в REG.Site 8

  3. 3.

    Выберите подходящий макет. Для примера мы выбрали последний макет:

    Как создать сайдбар в REG.Site 9

  4. 4.
    Теперь с одной стороны вы сможете вставить строку и в ней модули. А с другой стороны можно будет вставить только модуль. Нажмите на серый плюс в секции, в которую хотите вставить сайдбар.
  5. 5.

    Выберите модуль Сайдбар:

    Как создать сайдбар в REG.Site 10

  6. 6.
    Перед вами появится окно настройки, которое состоит из 3-х вкладок: «Контент», «Дизайн», «Дополнительно». С их помощью настройте внешний вид сайдбара.

Этап 3. Настройка внешнего вида

Контент

В блоке «Контент» в поле «Зона виджета» выберите Сайдбар:

Как создать сайдбар в REG.Site 11

В блоке «Фон» настраивается фон всего сайдбара. Можно установить однотонный цвет, градиент, а также можно установить на фон картинку или видео.

Дизайн

В блоке «Макет» настройте разделитель. Чтобы включить разделитель, переведите переключатель в положение ДА. В поле «Выравнивание» выберите, с какой стороны будет разделитель: справа или слева.

Как создать сайдбар в REG.Site 12

В блоке «Текст» настройте расположение, тему (светлую или тёмную) и тень всего текста.

Как создать сайдбар в REG.Site 13

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

Как создать сайдбар в REG.Site 14

В блоке «Тело Текст» можно настроить шрифт, расположение, цвет, размер, межбуквенный интервал и тень основного текста.

Как создать сайдбар в REG.Site 15

В блоке «Размеры» и «Отступы» настройте размеры и положение модуля на странице. В блоке «Границы» можно настроить рамку для модуля. В блоке «Тень контейнера» можно настроить тень для всего модуля:

Как создать сайдбар в REG.Site 16

В блоке «Анимация» можно указать параметры появления модуля на странице (с затемнением, отскок, слайдер и др.).

Дополнительно

Блоки «ID и классы CSS», «Пользовательский CSS» и «Атрибуты» предназначены для работы с CSS и HTML. В блоке «Видимость» можно отключить модуль на определённом устройстве. Например, модуль не будет отображаться на мобильных устройствах:

Как создать сайдбар в REG.Site 17

Сохраните настройки модуля. Нажмите на галочку:

Как создать сайдбар в REG.Site 18

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

Как создать сайдбар в REG.Site 19

Готово, сайдбар на сайте.

Помогла ли вам статья?
ДаНет
раз уже
помогла

Спасибо за оценку!
Как мы можем улучшить статью?

Нужна помощь?
Напишите в службу поддержки!

REG.RU
  • О компании
  • Контакты и офисы
  • Новости
  • Карьера в REG.RU
  • Руководство
  • Отзывы клиентов
Услуги
  • Стоимость услуг
  • Хостинг
  • Зарегистрировать домен
  • Конструктор и CMS
  • Создать сайт в REG.Site
  • VPS
  • Серверы и ДЦ
  • SSL-сертификат
Партнёрам
  • Партнёрские программы
  • Профессионалам IT
  • Бонусная программа
  • REG.API
  • Промоматериалы
Полезное
  • Акции и скидки
  • Мероприятия
  • Юридическим лицам
  • ЭДО
  • Whois
Помощь
  • База знаний
  • Вопросы и ответы
  • Шаблоны заявлений
  • Оставить отзыв, предложение
  • Сообщить о нарушении

+7 (495) 580-11-11

Телефон в Москве

8 800 555-34-78

Бесплатный звонок по России

           

Нашли опечатку?
Выделите и нажмите Ctrl+Enter

  • mastercard
  • visa
  • mir
  • sberbank
  • qiwi
  • yamoney
  • sbp
Все способы оплаты
© ООО «Регистратор доменных имен РЕГ.РУ» Правила пользования сайтомПолитика обработки персональных данных
Award
shop.reg.ru Магазин доменов
statonline.ru Доменная статистика
reg.ru/blog Мы пишем
  • Мы используем файлы cookie. Продолжив работу с сайтом, вы соглашаетесь с Политикой обработки персональных данных и Правилами пользования сайтом.