Написание и редактирование

Редактор WordPress

Редактор WordPress предназначен для создания записей и страниц на веб-сайте. Сейчас расскажем, как им пользоваться.

Это подробное руководство по всем функциям редактора WordPress.

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

Содержание

Редактор WordPress с блоком обложки, текстом и кнопкой.
Редактор блоков WordPress

Редактор WordPress используется для создания страниц и записей с медиаданными, а также для управления их структурой. Вам больше не нужно беспокоиться о выравнивании и структурировании текста, цитат и изображений. Теперь каждый элемент в записи или на странице помещён в отдельный блок. А вы можете просто творить.

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


Элементы редактора WordPress

Редактор WordPress состоит из трех основных разделов: верхнего меню, боковых меню и основной области содержимого.

Верхнее меню редактора WordPress

Элементы, расположенные в верхней части редактора: добавление блока, публикация записи и открытие меню настроек.
Верхнее меню редактора WordPress

Элементы верхнего меню

Значок плюса.

Добавление блоков: список всех доступных блоков, шаблонов блоков и часто используемых блоков.

Значок карандаша

Режимы — инструменты для выбора и редактирования блоков различными способами. Чтобы выбрать, нажмите Escape; чтобы вернуться к редактированию, нажмите «Ввод».

Кнопки со стрелками вправо и влево.

«Отменить» и «Повторить» — отменить действие или повторить отмененное действие.

буква i внутри круга — значок информации.

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

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

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

До публикации записи или страницы будут также отображаться такие элементы:

Сохранить черновик — сохранение черновика страницы или записи.
Предварительный просмотр — просмотр страницы/записи с установленной темой.
Опубликовать — публикация страницы или записи.

После публикации записи или страницы будут отображаться такие элементы:

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

Значок настроек.

Настройки — управление отображением бокового меню настроек страницы, документа или блока.

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

Бело-зеленый значок Jetpack.

Jetpack — включение и выключение использования отметок «Нравится» и кнопок «Поделиться» в отдельных записях и на страницах, предварительный просмотр публикаций в соцсетях и получение коротких ссылок на запись или страницу.

Значок с тремя вертикальными точками (многоточием).

Опции — настройки просмотра, стиль редактора и дополнительные инструменты.

Боковые меню редактора WordPress

При нажатии в верхнем меню на значки «Настройки», «Глобальные стили» и Jetpack открываются различные боковые меню.

📌

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

Настройки

В боковом меню «Настройки» доступны следующие параметры страницы/документа.

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

Верхнее меню с нажатым значком настроек.
Значок «Настройки»

Глобальные стили

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

Верхнее меню с нажатым значком глобальных стилей.
Значок «Глобальные стили»

Jetpack

В боковом меню Jetpack можно выполнять следующие действия.

Верхнее меню с активным значком Jetpack.
Значок Jetpack

Область содержимого в редакторе WordPress

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

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

💡

Вы можете сразу начать работу с материалами, а макет страницы выбрать позже (или вообще не выбирать).

Вот отличное руководство по использованию редактора WordPress, если вы автор или блогер.


Добавление содержимого с помощью блоков

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


Добавление блока

Существует множество типов блоков. Все они распределены по рубрикам. Каждый блок можно редактировать или перемещать независимо от других. Иногда некоторые блоки содержат свои собственные настройки форматирования, с помощью которых можно ещё более точно управлять макетом и функциональными возможностями.

Запись экрана с демонстрацией способов добавления новых блоков в редакторе WordPress.
Добавление новых блоков

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

💡

Самый быстрый способ добавить блок — использовать значок плюса. Где бы вы ни увидели значок плюса, на него можно нажать и добавить блок.

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

  1. Нажмите черный значок «+» сбоку от пустого блока.
  2. Нажмите значок «+» в левом верхнем углу окна редактора. Тут можно увидеть, как будут смотреться блоки различных стилей.
  3. Нажмите клавишу «Ввод» (клавишу перевода строки), находясь в выбранном блоке, чтобы создать под ним новый блок.
  4. Щёлкните три точки над выделенным блоком и выберите, куда добавить новый блок: выше или ниже текущего.

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

Пример использования горячей клавиши / для поиска блоков.
Горячие клавиши для добавления блока

Просмотр часто используемых блоков

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

  1. Нажмите значок многоточия (три точки) в правом верхнем углу экрана редактора.
  2. Выберите Параметры.
  3. Поставьте флажок рядом с пунктом Показывать часто используемые блоки.
Показывать часто используемые блоки

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

Нажмите значок «+» в верхнем меню, чтобы открыть библиотеку блоков. Часто используемые блоки отображаются вверху списка.

Открытая библиотека блоков с часто используемыми блоками.
Категория «Часто используемые блоки»

Перемещение блоков

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

Перемещение блоков

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

Каждый блок имеет собственные настройки. Чтобы найти их, нажмите на блок. Откроется панель инструментов в верхней части блока. Дополнительные настройки также находятся на боковой панели справа от редактора.

📌

Если вы не видите настройки блока в правой части окна редактора, щелкните значок настроек ⚙️ (шестеренка) рядом с кнопкой «Опубликовать» или «Обновить», чтобы раскрыть боковую панель меню.

Примеры различных панелей инструментов блока

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

Настройки блока — панель инструментов

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

  1. Команда Скрыть параметры блока закрывает меню настроек.
  2. Команда Дублировать создает второй блок с тем же содержимым на той же странице.
  3. Команда Вставить до/после добавляет новый блок до или после текущего.
  4. Команда Редактировать как HTML переводит блок в версию HTML для редактирования кода HTML. В режиме редактирования HTML эта опция меняется на «Редактировать визуально».
  5. Команда Добавить в часто используемые блоки позволяет создать блок, который можно использовать на других страницах с сохранением содержимого и стиля. Подробнее.
  6. Команда Удалить блок удаляет блок со страницы или из записи.
Открытое меню многоточия (дополнительных опций) с дополнительными действиями для блоков.
Опции дополнительной панели инструментов для блоков

⚠️

Не весь код будет работать в режиме «Редактировать как HTML». Если код правильно сформирован и не содержит ошибок, убедитесь, что он включён в список разрешённых тегов HTML и не является кодом для ограниченного использования, как, например, JavaScript.

Настройки блока — боковая панель

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

На скриншоте справа активным блоком является «Абзац», поэтому у него можно изменить размер шрифта, шрифт и цвет фона. Также для него доступны расширенные опции: создание переходов по странице или добавление класса CSS.

📌

Если вы не видите настройки блока в правой части окна редактора, щелкните значок настроек ⚙️ (шестеренка) рядом с кнопкой «Опубликовать» или «Обновить», чтобы раскрыть боковую панель меню.

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

Изменение типа блока

Можно ли изменить тип блока? Без проблем! Каждый блок можно преобразовать в блок другого сходного или связанного типа. Например, изменить абзац на заголовок, список или цитату.

Запись того, как на панели инструментов блока меняется тип блока с абзаца на цитату или заголовок.
Изменение типа блока

Навигация по блокам (выбор боков)

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

Например, вы хотите растянуть блок столбца на всю ширину страницы. Если нажать на отдельный столбец, в его настройках нужного параметра не будет. Он есть в настройках родительского блока («Столбцы») и позволяет изменить стиль разметки блока «Столбцы».

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

Запись экрана с наведением курсора на значок родительского блока на панели инструментов.

Эта функция может пригодиться, если есть текст в блоке «Столбец» и нужно выбрать этот блок или если есть несколько кнопок в блоке «Кнопки» и нужно выбрать общий блок кнопок.

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

Меню «Сведения» — это выпадающее меню со всеми блоками, вставленными на страницу или в запись. Оно упрощает обзор структуры страницы и выбор блока, с которым вы хотите поработать.


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

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

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

Удаление блока

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

Удалить блок

Шаблоны блоков

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

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

Вставка шаблона блока

  1. Нажмите значок «+» в верхнем меню, чтобы добавить новый блок.
  2. Откройте вкладку Шаблоны.
  3. Щелчком мыши выберите шаблон, который необходимо вставить. Он будет вставлен в документ в месте расположения курсора.

Подробные сведения см. в руководстве по работе с шаблонами блоков.


Предварительный просмотр страниц и записей

Хотя редактор блоков дает представление о том, как будет выглядеть страница после публикации, могут быть небольшие изменения в ее внешнем виде из-за темы или ее настроек.

Параметр «Предварительный просмотр» в верхнем меню

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

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

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

Настройки документа

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

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

📌

Если вы не видите настройки документа в правой части окна редактора блоков, щелкните значок настроек в виде шестеренки ⚙️ в правом верхнем углу.


Дополнительные параметры

Настройте параметры редактирования в соответствии со своими потребностями с помощью трёх точек справа от значка настройки.

Просмотреть

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

Редактор

По умолчанию открывается визуальный редактор. Переключитесь в редактор кода, чтобы просматривать всю страницу в виде HTML-кода.

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

Инструменты

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

Опции

Укажите, какие настройки документа будут видны на боковой панели.

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

Часто задаваемые вопросы

Как редактировать код HTML в редакторе WordPress?

Если хотите написать собственный код HTML, можете воспользоваться блоком «Пользовательский HTML».

Остальные параметры редактирования кода HTML в редакторе WordPress находятся здесь.

Не весь код будет работать в режиме «Редактировать как HTML». Если код правильно сформирован и не содержит ошибок, убедитесь, что он включён в список разрешённых тегов HTML и не является кодом для ограниченного использования, как, например, JavaScript.

Как будет выглядеть моё текущее содержимое?

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

Почему моё содержимое по-разному отображается в редакторе и на сайте?

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

Почему некоторые настройки доступны не на всех моих сайтах?

Если на сайте используется тарифный план WordPress.com Business, возможно, у вас есть плагины, позволяющие добавить в редактор пользовательские блоки. Этих блоков не будет на другом сайте, где такой плагин отсутствует.

Некоторые настройки блоков (wide или full-width) должны поддерживаться в вашей теме. Одинаковые блоки могут присутствовать на разных сайтах, но какие-то настройки, применяемые для них, могут немного отличаться в зависимости от используемой темы.

Смогу ли я использовать старый редактор?

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

Будут ли по-прежнему работать шорткоды?

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

Будет ли этот редактор доступен для всех?

Наша цель заключается в том, чтобы новый редактор WordPress был так же легко доступен для всех, как и предыдущие редакторы. И даже более того. Мы хотим, чтобы все могли им пользоваться. Согласно стандартам доступности WordPress, «весь новый или обновляемый код, выпускаемый на WordPress, должен соответствовать рекомендациям Руководства по обеспечению доступности веб-контента (WCAG) 2.0 на уровне AA«. Без исключений. Если возникнут проблемы доступности, свяжитесь с нами.

Нужно ли использовать какую-то специальную тему для нового редактора?

Нет. Новый редактор блоков будет работать со всеми темами. Но, возможно, не все темы будут поддерживать специальные функции разметки (например, содержимое с настройками wide и full-width).

Где найти полный список комбинаций клавиш?

Полный список комбинаций клавиш см. в Справочнике по WordPress.

Как использовать функции подсчета слов и проверки орфографии?

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

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

Были ли эти инструкции полезны?