Хотите добавить фоновое изображение на свой сайт WordPress? Фоновые изображения могут быть использованы, чтобы сделать ваш сайт более привлекательным и эстетичным. В этой статье мы покажем вам, как легко добавить фоновое изображение на ваш сайт WordPress.^
Видеоурок(это видео)
Если вам не нравится видео или вам нужны дополнительные инструкции, продолжайте чтение.
Способ 1. Добавьте фоновое изображение, используя настройки темы WordPress
Большинство бесплатных и премиальных тем WordPress поставляются с пользовательской поддержкой фона. Эта функция позволяет вам легко установить фоновое изображение для вашего сайта WordPress.
Если ваша тема поддерживает пользовательскую фоновую функцию, то мы рекомендуем использовать этот метод для добавления фонового изображения на ваш сайт WordPress. Однако, если ваша тема не поддерживает пользовательскую фоновую функцию, вы можете использовать другие методы в этой статье.
Сначала вам нужно зайти на страницу «Внешний вид» в вашем админке WordPress. Это запустит настройщик тем WordPress, где вы сможете изменить различные настройки темы при просмотре живого предварительного просмотра вашего сайта.^
Далее вам нужно нажать на опцию «Фоновое изображение». Панель откроется и покажет вам варианты загрузки или выбора фонового изображения для вашего сайта.^
Нажмите на кнопку выбора изображения, чтобы продолжить.
Это откроет всплывающее окно WordPress Media Uploader, где вы можете загрузить изображение с вашего компьютера. Вы также можете выбрать ранее загруженное изображение из медиатеки.^
Затем вам нужно нажать на кнопку «Выбрать изображение» после загрузки или выбрать изображение, которое вы хотите использовать в качестве фона.
Это закроет всплывающее окно загрузки мультимедиа, и вы увидите предварительный просмотр выбранного изображения в настройщике темы.^
Под изображением вы также сможете увидеть параметры фонового изображения. В разделе «Предустановки» вы можете выбрать способ отображения фонового изображения: экран заливки, экран подгонки, повтор или пользовательский режим.
Вы также можете выбрать положение фонового изображения, нажав на стрелки ниже. Нажав на центр, выровняйте изображение по центру экрана.
Не забудьте нажать кнопку «Сохранить и опубликовать» вверху, чтобы сохранить настройки. Вот и все, вы успешно добавили фоновое изображение на свой сайт WordPress.
Идите вперед и посетите ваш сайт, чтобы увидеть его в действии.
Способ 2. Добавить пользовательское фоновое изображение в WordPress с помощью плагина
Этот метод намного более гибкий. Он работает с любой темой WordPress и позволяет устанавливать несколько фоновых изображений. Вы также можете установить различные фоны для любого поста, страницы, категории или любого другого раздела вашего сайта WordPress.
Это автоматически делает все ваши фоновые изображения для полноэкранного и мобильного реагирования. Это означает, что ваше фоновое изображение автоматически изменит размер на небольших устройствах.
Для начала вам необходимо установить и активировать плагин Full Screen Background Pro. Для более подробной информации, смотрите наше пошаговое руководство по установке плагина WordPress.
После активации вам нужно зайти на страницу «Внешний вид», чтобы настроить параметры плагина.^
Вам будет предложено добавить свой лицензионный ключ. Вы можете получить эту информацию из электронного письма, которое вы получили после покупки плагина, или из своей учетной записи на сайте плагина.
Затем вам нужно нажать на кнопку «Сохранить настройки», чтобы сохранить изменения. Теперь вы готовы начать добавлять фоновые изображения на свой сайт WordPress.
Нажмите кнопку «Добавить новое изображение» на странице настроек плагина. Вы попадете на экран загрузки фонового изображения.^
Нажмите на кнопку выбора изображения, чтобы загрузить или выбрать изображение. Как только вы выберите изображение, вы сможете увидеть предварительный просмотр изображения на экране.
Далее необходимо указать имя для этого изображения. Это имя будет использоваться внутри, так что вы можете использовать что угодно здесь.
Наконец, вам нужно выбрать, где вы хотите использовать это изображение в качестве фоновой страницы. Full Screen Background Pro позволяет вам устанавливать изображения в качестве фона во всем мире, или вы можете выбирать из различных разделов вашего сайта, таких как категории, архивы, первая страница, страница блога и т. д.
Не забудьте нажать кнопку «Сохранить изображение», чтобы сохранить фоновое изображение.
Вы можете добавить столько изображений, сколько хотите, посетив Внешний вид »Страница полноэкранного изображения BG.
Если вы установите несколько изображений для глобального использования, то плагин автоматически начнет показывать фоновые изображения в виде слайд-шоу.
Вы можете настроить время исчезновения изображения и время, после которого новое фоновое изображение начинает исчезать.^
Время, которое вы вводите здесь, указывается в миллисекундах. Если вы хотите, чтобы фоновое изображение исчезло через 20 секунд, вам нужно будет ввести 20000.
Не забудьте нажать кнопку «Сохранить настройки», чтобы сохранить изменения.
Настройка фонового изображения для отдельных сообщений, страниц, категорий и т. д.
Full Screen Background Pro также позволяет устанавливать фоновые изображения для отдельных сообщений, страниц, категорий, тегов и т. д.
Просто отредактируйте сообщение / страницу, где вы хотите отобразить другое фоновое изображение. На экране редактирования сообщения вы увидите новое поле «Полноэкранное фоновое изображение» под редактором сообщения.^
Чтобы использовать фоновое изображение для определенной категории, вам необходимо перейти на страницу «Внешний вид» в полноэкранном режиме и затем нажать кнопку «Добавить новое изображение».
После загрузки изображения вы можете выбрать «Категория» в качестве контекста, в котором вы хотите отобразить фоновое изображение.^
Теперь введите конкретный идентификатор категории или слаг, где вы хотите отобразить изображение. Смотрите наше руководство о том, как найти идентификатор категории в WordPress.
Не забудьте сохранить изображение, чтобы сохранить настройки.
Способ 3. Добавление пользовательских фоновых изображений в любом месте WordPress с использованием CSS
По умолчанию WordPress добавляет несколько классов CSS к различным элементам HTML на вашем сайте WordPress. Вы можете легко добавлять собственные фоновые изображения к отдельным сообщениям, категориям, авторам и другим страницам, используя эти классы CSS, созданные в WordPress.
Например, если у вас есть категория на вашем веб-сайте, которая называется TV, WordPress автоматически добавит эти CSS-классы в тег body, когда кто-то просматривает страницу категории TV.^
Вы можете использовать инструмент проверки, чтобы увидеть, какие классы CSS добавляются WordPress в тег body.^
Вы можете использовать CSS-класс category-tv или category-4, чтобы по-разному стилизовать только эту страницу категории.
Давайте добавим пользовательское фоновое изображение на страницу архива категории. Вам нужно будет добавить этот пользовательский CSS в вашу тему.^
Не забудьте заменить URL-адрес фонового изображения и класс категории своей собственной категорией.
Вы также можете добавлять собственные фоны для отдельных сообщений и страниц. WordPress добавляет класс CSS с идентификатором записи или страницы в теге body. Вы можете использовать тот же код CSS, просто заменив .category-tv классом CSS для публикации.
Мы надеемся, что эта статья помогла вам узнать, как добавить фоновое изображение в WordPress. Вы также можете увидеть наш список чрезвычайно полезных трюков для файла функций WordPress.
Если вам понравилась эта статья, пожалуйста, подпишитесь на наш канал YouTube для видеоуроков WordPress. Вы также можете найти нас в Twitter и Facebook.
