Введение

По сути, чтобы получить на выходе полноценный сайт — надо пройти 2 этапа: создание сайта и наполнение сайта содержимым.

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

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

Хотя бы в виде статьи. В которой простым языком объяснить ряд технических моментов ввода и редактирования контента сайта на WordPress. Именно ввода и редактирования, а не создания контента или создания самого сайта.

В данной статье я приведу общее описание 5  путей ввода и редактирования контента сайта на WordPress и конструкторе Divi.  И попрошу вашей обратной связи о целесообразности освещения данной тематики и какие вопросы прояснить в дальнейшем.

Divi я выбрал потому что на данный момент это самый распространненый конструктор страниц в мире: на момент написания статьи около 7% всех сайтов WordPress сделаны на Диви

Механизм работы WordPress

Для лучшего понимания темы статьи кратко остановлюсь на механизме работы WordPress.

Когда из браузера вы обращаетесь к сайту на Вордпресс, набирая в адресной строке имя сайта или кликая по ссылке — то присходят следующие процессы:

1) браузер передает запрос на сервер, где размещен сайт, сервер передает запрос в ядро вордпресс, которое читает ваш запрос начинает его выполнять,

2) для этого ядро обращается к базе данных,

3) извлекает оттуда нужные данные,

4,5) и формирует страницу ответа исходя из шаблонов страницы и алгоритма ее отображения

6) далее отправляет сформированную страницу вам в браузер.

Содержимое страниц WordPress хранит в базе данных.

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

Данные могут группироваться, например записи по рубрикам и меткам.

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

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

Другими словами, тема в WordPress — это как одежда на человеке. Она может быть разная: тело внутри одно, но внешний вид разный.

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

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

Рассмотрим какими путями можно вводить и редактировать контент сайта на  WordPress c Divi:

Способы ввода и редактирования контента

Ниже в общем рассмотрим 5 путей ввода и редактирования контента для страниц и записей сайта WordPress:

1. Классический редактор
2. Пользовательские шаблоны Divi
3. Блочный конструктор Divi Builder и визуальный конструктор Divi Visual Builder
4. Редактор блоков Гуттенберг
5. Редактор блоков Гуттенберг + Divi Visual Builder

1. Классический редактор.

Кстати, в интернет-магазинах, построенных на Woocommerce,  для ввода описания товара классический редактор по умолчанию используется и сейчас.

Классический редактор и простой и быстрый.

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

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

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

2. Редактор шаблонов Divi.

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

При использовании темы Divi или плагина Divi Builder есть возможность изменить шаблоны отображения страниц без кодирования.

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

3. Конструктор страниц.

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

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

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

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

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

В последующей статье рассмотрим опции настройки визуального конструктора и как лучше применять конструктор для построения страниц сайта.

4. Блочный редактор Гутенберг

Редактор Гутенберг внедрен в WordPress с конца 2018 года и сейчас используется по умолчанию.

В редакторе контент представляется в виде отдельных блоков. Страница — это набор блоков и определение какой будет отображаться страница происходит прямо в редакторе. Определение каким будет отображаться контент страницы происходит прямо в редакторе. То есть содержание и отображение в нем объеденены

От версии к версии блочный редактор «глубже проникает» в WordPress. Так в версии 5.8 с помощью блочного редактора можно настраивать виджеты сайдбара.

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

5. Гутенберг + конструктор Divi Visual Builder

Ввод товаров интернет-магазина на Wocommerce

Также я коснусь технических нюансов ввода товаров в интернет магазине на Woocommerce.

Заключение

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

Удачи!
Александр Коваль