Вопрос или проблема
Как я могу добавить два футера один над другим в WordPress?
Я пытаюсь использовать редактор блоков, чтобы изменить футер моего сайта WordPress. Я хочу, чтобы у меня было два футера, которые занимают всю ширину страницы, так, чтобы:
- “Верхний” футер имел светло-серый фон
- “Нижний” футер имел темно-серый фон
- Не было зазора между двумя футерами (цвета фона должны соприкасаться друг с другом без пикселей между ними)
- Очевидно, что содержание футеров должно быть разным
 |
|---|
| Скриншот демо-сайта темы siteorigin-corp демо-сайт, показывающий два футера с различным содержанием и цветами фона |
Я попробовал добавить два блока “Футер” друг на друга. Но когда я меняю “дизайн” одного футера, дизайн другого тоже меняется! Зачем мне хотеть, чтобы оба блока футера были идентичными? Это не имеет смысла.
ⓘ Примечание: это бесплатный сайт, размещенный на wordpress.com, поэтому редактирование темы (html, css, js или php файлы) невозможно. Установка плагина невозможна. Возможна только обычная редакция в стандартном редакторе блоков.
Как я могу добавить два блока футера с уникальным содержанием в WordPress?
Это можно сделать, добавив два блока “Группа” внутри блока “Футер”.
Затем вы можете отредактировать “стили” каждого блока группы, чтобы задать им различные цвета фона.
Наконец, чтобы очистить пространство между двумя группами, вам нужно изменить Верхний отступ нижнего блока группы на Нет. Возможно, потребуется переместить ползунок с “Нет” до какого-то значения, а затем вернуть его обратно на “Нет”, чтобы устранилась эта промежуток.
.
Ответ или решение
Для достижения желаемого результата, а именно создания «двойного» нижнего колонтитула в редакторе блоков WordPress, даже с учетом ограничений платформы WordPress.com, можно следовать нескольким шагам. Несмотря на закрытость вопроса и ограниченные возможности редактирования, проблема остается актуальной для многих пользователей этой платформы. Важно отметить, что данный процесс не требует использования дополнительных плагинов или изменения исходного кода темы, что делает его доступным практически для любых сайтов на WordPress.com.
Теория
Создание двух «нижних колонтитулов», расположенных один над другим, которые будут занимать всю ширину страницы и иметь разные стили оформления, может быть выполнено посредством использования стандартных блоков редактора WordPress. Используя возможности группировки блоков и изменения их стилей, можно достигнуть визуального разделения и оформления, соответствующего техническому и дизайнерскому замыслу.
Пример
Для начала, давайте определим, что требуется от дизайна:
- Верхний колонтитул должен иметь светло-серый фон.
- Нижний колонтитул будет иметь темно-серый фон.
- Промежуток между этими двумя колонтитулами должен отсутствовать, чтобы создавалась иллюзия, что они находятся в непосредственном контакте друг с другом.
- Контент каждого из колонтитулов будет различным.
Применение
-
Создание блоков группы:
- Перейдите в редактор страницы, используя стандартный блок-редактор WordPress (также известный как Gutenberg).
- Добавьте новый блок и выберите «Группа» из списка доступных блоков. Это позволит вам создавать контейнеры, которые могут включать несколько блоков внутри себя.
-
Настройка верхнего колонтитула:
- Внутри первой группы добавьте нужный контент (например, текст, изображения и т.д.).
- Перейдите к настройкам стиля этой группы и установите фоновый цвет светло-серый. Это можно сделать через панель «Блок» -> «Стиль» -> «Фоновый цвет».
-
Настройка нижнего колонтитула:
- Повторите процесс добавления второй группы под первой.
- Вставьте нужный контент, который будет отличаться от содержимого верхнего колонтитула.
- Установите для этой группы фоновый цвет темно-серый.
-
Устранение промежутка между колонтитулами:
- Перейдите в настройки второй группы (нижнего колонтитула).
- Найдите параметры, позволяющие настроить внешние отступы (Margins). Параметр «Margin top» (верхний внешний отступ) установите в «None» (отсутствует).
- Возможно, потребуется немного поиграть с ползунком: сначала переместите его в другое значение и затем снова в «None» для того, чтобы изменения вступили в силу.
-
Проверка и сохранение:
- Предварительно просмотрите изменения, чтобы убедиться, что оба колонтитула отображаются корректно и без промежутков.
- После этого сохраните изменения и опубликуйте страницу.
Заключение
Таким образом, можно создать два нижних колонтитула с разными стилями, не нарушая ограничений платформы WordPress.com. Этот метод обеспечивает достаточно гибкости для стандартной настройки, не требуя использования сторонних инструментов и сохраняет совместимость с обновлениями WordPress. Благодаря такому подходу, каждый пользователь, даже с минимальным опытом работы с данной системой, сможет добиться желаемого результата и улучшить визуальное оформление сайта.