Все, что вам нужно, чтобы начать работу с WordPress Gutenberg

Опубликовано: 2018-01-23

В 2018 году WordPress стремится модернизировать и упростить процесс создания контента с помощью Gutenberg. Его название происходит от Иоганна Гутенберга, основателя печатного станка. Это считается одним из самых больших изменений в пользовательском интерфейсе WordPress и рабочем процессе разработки темы.

Что такое Гутенберг?

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

До сих пор редактирование страницы означало настройку ее заголовка, основной части и настраиваемых полей. С Гутенбергом эта логика полностью меняется и вводится понятие блоков . Блоки — это автономные, изолированные и динамические компоненты пользовательского интерфейса, которые динамически добавляются через wp-admin. Я не буду подробно останавливаться на этом, так как следующее видео все подробно объясняет.

Презентация Мэтта Малленвега Гутенберга на State of the Word 2017

Gutenberg уже доступен в виде плагина и будет интегрирован в WordPress 5.0, запуск которого запланирован на апрель 2018 года. В настоящее время его команда занимается постредактированием. Но с тех пор он расширит их подход, включив в него создание шаблонов, создание сайтов и многое другое. Чтобы сделать переход на Gutenberg более плавным, существует плагин под названием Classic Editor, который позволяет командам использовать текущий редактор во время работы над миграцией.

Почему Гутенберг хорош для меня и что это значит для будущего WordPress?

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

Используя блоки, он оптимизирует и упрощает все способы создания страницы (шорткоды, виджеты, пользовательский HTML, мультимедиа, форматирование текста, встраивания и метабоксы). Как объясняет Мэтт в своем посте:

  • Разработчики и агентства смогут создавать интерактивные шаблоны, которые клиенты смогут легко обновлять, не ломая вещи и не работая с пользовательскими типами сообщений.
  • Разработчики плагинов смогут полностью интегрироваться в каждую часть WordPress. Включая сообщения, страницы, настраиваемые типы сообщений и боковые панели без необходимости взламывать TinyMCE или помещать все их функции за кнопку на панели инструментов.
  • Разработчикам тем не нужно будет связывать тонны плагинов или создавать свои собственные компоновщики страниц. Будет стандартный портативный способ создавать богатые макеты для постов и направлять людей через настройку прямо в интерфейсе. Никаких 20-шаговых руководств или длинных видеороликов не требуется.
  • Основные разработчики смогут работать в современных технологиях и не беспокоиться о 15-летней обратной совместимости.
  • Пользователи , наконец, смогут создавать сайты, которые они строят с помощью своего воображения. Они смогут делать на мобильных устройствах то, чего никогда раньше не делали. Им больше никогда не придется видеть шорткод. Текст, вставленный из Word, автоматически и мгновенно очищается и преобразуется в блоки.

Демонстрации и примеры

В этом выступлении на WordCamp US 2017 Мортен объясняет, на чем должны сосредоточиться разработчики WordPress и как WordPress будет преобразован с помощью Gutenberg.

Мортен Рэнд-Хендриксен: Гутенберг и WordPress завтрашнего дня

В этом скринкасте Human Made демонстрирует ряд расширенных реализаций блоков Гутенберга.

С чего начать

Играйте с Frontenberg , ограниченной демо -версией редактора Gutenberg, которая поможет вам ознакомиться со средой редактирования Gutenberg.

Frontenberg — игровая площадка Gutenberg для мгновенного тестирования.

Прочтите следующую статью от Матиаса Вентуры Баусеро, одного из ведущих инженеров Гутенберга .

Гутенберг, или Корабль Тесея. Как может система фундаментально развиваться, не меняясь кардинально?

Поэкспериментируйте с этими символами Sketch и попробуйте создать свои собственные блоки.

Automattic/gutenberg-themes-sketch — gutenberg-themes-sketch — набор файлов Sketch, которые помогут вам создавать темы WordPress на основе блоков.

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

Введение. «Гутенберг» — это кодовое название редактора WordPress 2017 года.

Покопайтесь в ReactJS, поскольку Гутенберг построен на его основе.

React — библиотека JavaScript для создания пользовательских интерфейсов — библиотека JavaScript для создания пользовательских интерфейсов

Ознакомьтесь с этими примерами Gutenberg , созданными основной командой WordPress.

WordPress/gutenberg-examples = gutenberg-examples — Примеры расширения WordPress/Gutenberg блоками

Прочтите эту подробную электронную книгу от Human Made (одного из лучших агентств по разработке WP) .

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

Ознакомьтесь с этим курсом разработки Зака ​​Гордона, преподавателя некоторых из самых популярных образовательных платформ FrontendMasters, Treehouse и Udemy.

Курс развития Гутенберга от Зака ​​Гордона — Курсы Гутенберга

Наконец, установите этот набор инструментов разработчика с нулевой конфигурацией для создания блочных плагинов WordPress Gutenberg от Ahmad Awais.

ahmadawais/create-guten-block — набор инструментов разработчика #0CJS с нулевой конфигурацией для создания блоков WordPress Gutenberg.

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

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

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