Как создать боковую панель в теме WordPress Twenty Twenty-Three

Возможно, вы заметили, что в теме WordPress Twenty Twenty-Three нет специального места для боковой панели.

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

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

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

В этом уроке мы покажем вам, как создать боковую панель в теме WordPress Twenty Twenty-Three.

Зачем нам нужна боковая панель?

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

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

До появления полносайтового редактора виджеты можно было вставлять только там, где это позволяла наша тема. Теперь везде, где мы можем вставить блок, мы можем вставить виджет.

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

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

Как создать боковую панель в теме WordPress Twenty Twenty-Three

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

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

Это направление, в котором движется WordPress, нам следует к нему привыкнуть и научиться адаптироваться к этим изменениям.

Итак, приступим к созданию.

Шаг 1. Перейдите в полнофункциональный редактор сайта.

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

• Перейдите на панель управления.
• Нажмите «Внешний вид».
• Нажмите «Редактор».

Шаг 2. Добавьте новую часть шаблона

Нам нужно добавить новую часть шаблона.

• Нажмите на логотип W/Site в верхнем левом углу экрана.
• Нажмите «Части шаблона».
• Нажмите кнопку «Добавить новый» .

• Нажмите «Общие»
• Введите имя

Шаг 3. Добавьте виджеты

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

• Нажмите на любой из символов плюса .

• Прокрутите/найдите нужные виджеты.
• Настройте виджеты по своему вкусу.

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

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

Шаг 4. Встраивание элементов

Мы встроим нашу ленту Twitter и видео YouTube в боковую панель. Есть и другие товары, которые мы можем добавить на наш сайт.

• Нажмите «Добавить блок» .
• Выберите нужные предметы.
• Заполните необходимые поля

Шаг 5: сохраните изменения

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

• Нажмите кнопку «Сохранить» .

• Подтвердите изменения.
• Нажмите кнопку «Сохранить» .

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

Этот псевдосайдбар является частью шаблона, теоретически мы можем вставить его в любой блок или столбец.

Вставить боковую панель в отдельные сообщения

Чтобы вставить боковую панель во все отдельные публикации/сообщения в блоге, мы должны спланировать и оставить необходимый столбец там, где мы хотим его вставить.

• Нажмите на логотип сайта .
• Нажмите «Шаблоны».
• Нажмите «Одиночный» .

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

• Нажмите «Просмотр списка».
• Нажмите на три точки рядом с группой.
• Нажмите «Копировать блок» .
• Нажмите «Удалить группу».

На экране останутся только верхний и нижний колонтитулы. Здесь мы вставим столбец 66/33. Мы можем дополнительно настроить ширину столбцов вручную в настройках блока.

• Нажмите «Переключить вставку блоков» .
• Найдите и выберите Столбцы.
• Выберите столбец 66/33.

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

• Нажмите на символ «Плюс» в левом столбце.
• Поиск и выбор абзаца

• Щелкните правой кнопкой мыши блок абзаца .
• Вставьте групповой блок из буфера обмена.

Наконец, мы вставим часть шаблона.

• Нажмите на символ плюса в правом столбце.
• Найдите и выберите Части шаблона .

• Нажмите кнопку «Выбрать» .

• Выберите боковую панель .

Мы должны сохранить изменения , чтобы они вступили в силу и не потеряли прогресс.

• Нажмите кнопку «Сохранить» .
• Подтвердите изменения и нажмите кнопку «Сохранить» .

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

Вставить боковую панель на главную страницу

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

• Нажмите на логотип сайта .
• Нажмите на Шаблон .
• Нажмите «Домой» .

• Нажмите «Переключить вставку блоков» .
• Нажмите на три точки.
• Скопируйте содержимое домашней страницы.
• Снимите блок.

• Нажмите «Переключить средство вставки блоков».
• Найдите и выберите столбец.
• Выберите столбец 66/33.

• Вставьте блок «Абзац» в левый столбец.

• Щелкните правой кнопкой мыши и вставьте содержимое дома в блок абзаца.

• Вставить часть шаблона
• Выберите часть «Шаблон боковой панели ».

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

Заключение

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