Блоки

Блоки »Блок обложки

Чтобы придать вашей записи или странице стильный, профессиональный вид, вы можете добавить блок «Обложка».

Содержание

Добавить блок «Обложка»

Начните с нажатия значка вставки. Вы также можете быстро добавить этот блок, набрав команду /обложка в новом блоке абзаца, а затем нажав клавишу «Ввод».

Вставка изображения обложки с помощью команды /cover.
Вставка изображения обложки с помощью команды /cover.

Вы можете ознакомиться с подробными инструкциями по добавлению блоков здесь.


Добавить изображение

После создания блока вам предлагаются два варианта: Загрузка и Библиотека медиафайлов.Вариант «Загрузка» позволяет загрузить новое изображение с вашего устройства, а вариант «Библиотека медиафайлов» позволяет выбрать ранее загруженное изображение из библиотеки медиафайлов на вашем сайте.


Добавить текст и другое содержимое

После выбора изображения обложки вы можете написать на нем заголовок. Это можно использовать, например, для создания заголовка нового раздела записи или страницы. Вы также можете добавить другие блоки, которые будут отображаться поверх блока «Обложка», например блок «Кнопка» или блок «Абзац».


Панель инструментов блока

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

Блок обложки имеет много настроек на панели инструментов.
На панели инструментов блока «Обложка» имеется много настроек.
Выравнивание

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

Блок «Обложка» также имеет настройки широкого формата и формата во всю ширину, которые применяются для создания уникальных заголовков и широкоэкранных эффектов. Эти две настройки доступны только в тех случаях, если такой вид выравнивания поддерживается темой.

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

Используйте функцию «Расположение содержимого», чтобы настроить расположение текста и другого содержимого на изображении:

Блок «Обложка» ― функция «Расположение содержимого»
Перемещение содержимого внутри блока с помощью функции «Расположение содержимого»
Заменить изображение

Это ещё одна функция, доступная на панели инструментов блока «Обложка». Функция Заменить позволяет выбрать новый файл изображения для блока. Используйте её, если вы хотите заменить файл изображения в блоке «Обложка».


Настройки блока

В дополнение к настройкам на панели инструментов для каждого блока имеются свои настройки на боковой панели редактора. Если вы не видите боковую панель, нажмите значок шестеренки рядом с кнопкой «Опубликовать».

Настройки блока доступны на боковой панели.
Настройки блока доступны на боковой панели.
Стили

Чтобы добавить эффект в нижней или верхней части изображения обложки, используйте «Стили» в настройках блока «Обложка».

Фиксированный фон

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

Преобразование блока обложки в фиксированное изображение.
Переключите свой блок «Обложка» на фиксированное изображение.
Выделятор точки фокуса

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

Размеры

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

Цвет наложения

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

Добавление цветного наложения и установка уровня его непрозрачности.
Добавление цветного наложения и установка уровня его непрозрачности.
Непрозрачность

Этот ползунок позволяет установить уровень непрозрачности наложения для изображения обложки. Перемещение ползунка в сторону значения 100 делает наложение более темным и непрозрачным, а перемещение в сторону значения 0 делает наложение более светлым и прозрачным. При значении непрозрачности 100 наложение становится полностью непрозрачным, а изображение обложки перестает быть видимым. При значении непрозрачности 0 наложение полностью исчезает, оставляя видимым только изображение.

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


Видео в блоке «Обложка»

Ваш сайт включен в тарифный план Premium, Business или eCommerce? Тогда вы можете использовать видео в блоке «Обложка»! Наилучший результат достигается при работе с видео в формате mp4, однако вы можете загружать свои видео в других форматах. Список разрешенных форматов можно найти в разделе Часто задаваемые вопросы по VideoPress.

Вставьте блок «Обложка» обычным образом, но вместо выбора изображения вы можете добавить предварительно загруженное видео (или, конечно, загрузить видео напрямую):

Запись: вставка блока «Обложка», вставка изображения из библиотеки медиафайлов и выбор вкладки «Видео» во всплывающем окне библиотеки.

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

Запись: выбор видео для вставки в блок и настройка ширины блока.

Теперь вы готовы добавить любой текст или кнопки на видео своей обложки!


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

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

Раздел дополнительных настроек позволяет добавить к блоку класс CSS.
Раздел дополнительных настроек позволяет добавить к блоку класс CSS.