Полное Руководство по Gutenberg (блоки для WordPress)

Компоненты Gutenberg - https://genius.courses/wordpress-code... Много полезного по сайтосроению на WordPress -    • Полное Руководство по WordPress. Введение.   Как создавать плагины на WordPress -    • WordPress Плагин СВОЯ CRM СИСТЕМА: Разрабо...   Консультации или Клуб - https://genius.courses/become-member/ Исходники для практики: ====================== Дизайн Макет - https://genius.courses/wp-content/upl... Репо - https://github.com/CRIK0VA/myblock Репо Динамического блока - https://github.com/CRIK0VA/myblock/tr... 00:00:00 Интро 00:00:45 Обзор конструктора страниц Gutenberg в WordPress 00:20:42 Разница в классических и блочных темах для WordPress 00:35:23 Создаем плагин и регистрируем первый блок для Gutenberg 00:49:57 Первый React компонент и настройка компиляции JSX 01:07:08 Подключаем CSS и задаем дефолтные классы и атрибуты 01:23:49 Иерархия файлов и @wordpress/create-block 01:33:58 Валидация кода (Format/Lint:JS/Lint:CSS) 01:50:06 Используем компонент RichText 02:04:30 Добавляем кнопки в Toolbar 02:18:51 Добавляем действия на кнопки в Toolbar 02:31:26 Используем компонент InspectorControls 02:43:36 Компонент InnerBlocks для вложенных блоков 03:01:48 Используем RichText для вложенного блока 03:18:16 Добавляем опцию для определения кол-ва колонок 03:31:00 Добавляем CSS стили для блока на фронт и админ части 03:49:09 Загружаем картинки при помощи MediaPlaceholder 04:05:48 Используем isBlobURL для определения состояния загрузки картинки 04:15:42 Добавляем опцию замены и удаления картинки 04:28:28 Редактируем alt для изображения 04:36:19 Что такое динамический блок? Начало разработки плагина 04:43:40 Render_Callback для фронтенд части на PHP 04:58:05 Продолжаем логику фронтенд части и пишем CSS стили 05:09:23 Строим логику блока для Gutenberg на JavaScript 05:20:00 Выводим динамический контент в редакторе Gutenberg на JS 05:34:52 Используем компоненты для настроек в сайдбаре для блока 05:47:18 Добавляем сортировку при помощи компонента QueryControls 05:57:45 Дополнительные возможности компонента QueryControls 06:09:09 Разбор дизайн макета и начало разработки блочной темы 06:18:18 Работа с глобальными цветами и шрифтами для темы 06:31:32 Создаем шапку блочной темы 06:48:27 Задаем глобальные стили на компонент кнопки 06:57:42 Создаем подвал блочной темы 07:13:35 Разработка Hero Block и используем Template Part 07:25:59 Разработка сетки постов при помощи QueryLoop 07:42:11 Разработка дополнительных блоков для блочной темы 08:04:47 Финальные настройки блочной темы #gutenberg #wordpress #react