Включение поддержки опций выравнивания «По ширине содержимого» и «Во всю ширину» для блоков Gutenberg

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

Также хочу порекомендовать вам свой видеокурс по созданию блока Gutenberg.

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

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

Ещё две опции выравнивания, «По ширине содержимого» и «Во всю ширину», добавить легко и просто при помощи функции add_theme_support().

add_theme_support( 'align-wide' );

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

И результат:

выравниванием блока Обложка в Gutenberg на всю ширину страницы
Извините, немного перестарался с GIF, она почти 1MB 😁

Миша

Недавно я осознал, что моя миссия – способствовать распространению WordPress. Ведь WordPress – это лучший движок для разработки сайтов – как для тех, кто готов использовать заложенную структуру этой CMS, так и для тех, кто предпочитает headless решения.

Сам же я впервые познакомился с WordPress в 2009 году. Организатор WordCamp. Преподаватель в школах Epic Skills и LoftSchool.

Если вам нужна помощь с вашим сайтом или может даже разработка с нуля на WordPress / WooCommerce — пишите. Я и моя команда сделаем вам всё на лучшем уровне.

Оставить комментарий

Если вы хотите добавить код, не забудьте обернуть его в <pre lang="php"></pre>, если же код – меньше одной строчки, то можно и в <code></code>.