Як керувати блоками Гутенберга для публікацій у WordPress: вимкніть блоки та шаблони блоків

Новий редактор WordPress Gutenberg надає автору велику гнучкість для створення насиченого вмісту. Але в деяких випадках вам може знадобитися трохи обмежити це як веб-майстру сайту, так і розробнику теми. У цій публікації ми розглянемо, як ми можемо забезпечити обмеження блоків у Gutenberg за допомогою PHP.

Існують вбудовані функції для встановлення деяких обмежень у блоках, з якими багато хто ще не знайомі. Це може бути корисно, коли вам потрібно, щоб певні публікації мали однаковий дизайн чи вміст, або якщо ви хочете допомогти нетехнічним авторам не бути перевантаженими кількістю блоків у Gutenberg. Ще один приклад: автоматичне додавання необхідних рекламних блоків (якщо у вас є рекламний плагін) між текстами в публікаціях. Ви можете зробити це примусово або використати ці прийоми, щоб допомогти авторам не забути їх додати.

У цій публікації ми розглянемо два способи керування блоками в WordPress Gutenberg. Одним із способів є обмеження того, який тип блоків можна додавати. Іншими словами, видаліть певні типи блоків, які вам не потрібні. Ми можемо зробити це окремо за типом повідомлення або глобально. Інший спосіб — використання шаблонів блоків. WordPress пропонує вам вибрати набір попередньо визначених блоків, коли ви створюєте нову публікацію. Це робиться для кожного типу публікації. За допомогою шаблонів блоків ви можете запропонувати автору початкові блоки, щоб допомогти йому написати публікацію, або ви можете заблокувати блоки на місці, щоб автор не міг змінити їхню позицію чи додати нові.

Ви можете зробити обидва ці дії за допомогою PHP або Javascript. Цей посібник розповідає про PHP.

Видалення типів блоків

Чорний список

У WordPress є фільтр PHP під назвою allowed_block_types. Цей фільтр дає вам два параметри; масив усіх блоків і об’єкт post. Все, що нам потрібно зробити, це керувати масивом перед його поверненням. І оскільки ми також отримуємо об’єкт публікації у фільтрі, ми також можемо додавати правила за типом публікації чи іншою метаінформацією публікації.

Масив блоків складається з рядків імен простору імен блоку. Для всіх блоків у WordPress перед назвою блоку потрібен простір імен із префіксом. Для основних блоків WordPress простір імен – ” core/“, а для вбудованих блоків WordPress – простір імен ” core-embed/“. Наприклад, блок заголовка має назву ” core/heading" у цьому масиві. Я створив повний огляд імен усіх типів блоків у своїй публікації про те, як щоб отримати доступ до блоків публікації та проаналізувати їх.

Ось короткий приклад використання фільтра для видалення всіх блоків, крім абзацу. Це стосується всіх типів публікацій.

add_filter('allowed_block_types', function($block_types, $post) {
    return ['core/paragraph'];
}, 10, 2);

Якщо ви додасте цей код у файл вашої теми functions.phpчи плагіна, у результаті Gutenberg повністю заборонить будь-які інші блоки, окрім абзацу. Ви навіть не зможете побачити будь-які інші блоки, а також не зможете спробувати виманити їх, ввівши «/» у публікації (ярлик блоку) або здійснивши пошук.

Ми можемо визначити блоки, які ми хочемо зберегти або видалити, за типом публікації. Ми просто перевіряємо властивість post_typeоб’єкта публікації. У наведеному нижче прикладі коду ми визначаємо новий масив блоків, які ми хочемо дозволити, і додаємо це правило лише для спеціального типу публікації «book».

За допомогою наведеного вище коду ви отримуєте всі блоки під час редагування дописів і сторінок, але під час редагування спеціального типу допису «book» ви можете додавати лише абзаци, заголовки та окремі зображення.

Використовуйте свою уяву, щоб додати власні правила. Оскільки у нас є об’єкт post, ми можемо отримати доступ до більшості необхідної нам інформації. Можливо, вам потрібно обмежити вибір блоку мета-значенням публікації? Наприклад, за вибраним шаблоном сторінки, вибраною категорією публікації чи чимось іншим.

Білий список

Наскільки я бачу, ви можете лише додати до білого списку блоки (вирішувати, які з них видалити, а не вирішити, які з них залишити) шляхом скасування реєстрації блоків у певний момент. І ви повинні зробити це за допомогою Javascript, а не PHP.

Я не буду вдаватися в подробиці, але вам потрібно буде поставити в чергу файл Javascript, завантажений initабо enqueue_block_editor_assetsперехоплений, із wp-dom-readyі wp-blocksяк залежність. Усередині сценарію ви можете налаштувати змінну, яку ви хочете видалити, дотримуючись тих же правил для просторів імен і імен блоків, наведених вище. І для кожного імені блоку ви викликаєте функцію unregisterBlockType()з wp.blocksпакету. Зазвичай це потрібно робити всередині функції, wp.domReady()щоб переконатися, що порядок завантаження сценарію правильний.

Щось на зразок цього:

var removeBlocks = [
    'core/paragraph',
    'core/heading',
    'core/image'
];
 
wp.domReady(function() {
    removeBlocks.forEach(function(blockName) {
        wp.blocks.unregisterBlockType(blockName);
    });
});

Видалення типів блоків є одним із способів керування блоками в Gutenberg. Давайте розглянемо інший, можливо, цікавіший спосіб керування блоками: шаблони блоків.

Шаблони блоків

Ще один спосіб керування блоками Гутенберга в WordPress – використання шаблонів блоків. У WordPress є функція, яка дозволяє заповнювати нові публікації набором попередньо визначених блоків. Це може бути корисним для допомоги авторам, показуючи їм пропозицію блочної структури. Ви також можете заблокувати ці попередньо заповнені блоки, таким чином не дозволяючи авторам змінювати порядок або додавати інші блоки. Це корисно, коли ви хочете, щоб дописи мали особливу структуру та дизайн – наприклад, переконавшись, що всі дописи цього типу мають структуровану інформацію точно так само.

Ми можемо додати шаблони блоків з новим параметром до [register_post_type](https://developer.wordpress.org/reference/functions/register_post_type/)()функції, яка використовується для реєстрації користувацьких типів публікацій (примітка: новий параметр ще не додано до документації). Ви також можете додати або налаштувати параметри для наявних типів публікацій, таких як публікації та сторінки – дивіться нижче, як це зробити.

Новим параметром register_post_type()є «template». Як значення для ‘ template‘ вам потрібно надати масив блоків. Кожен блок також має бути масивом. Як мінімум вам потрібно надати перший елемент масиву; назву блоку (наприклад, core/paragraph). За бажанням ви можете додати другий елемент масиву для атрибутів і третій елемент масиву для вкладених блоків (наприклад, блоки Cover, Columns). Коли ви побачите код, стане зрозуміліше.

Почнемо з простого. Припустімо, що ми маємо register_post_type()виклик функції для реєстрації власного типу публікації " book". Ми хочемо попередньо заповнювати всі нові публікації цього типу блоком абзацу з заповнювачем, який повідомляє автору, що він або вона має написати.

Зауважте, що масив атрибутів (з «заповнювачем» у ньому) необов’язковий. Тепер із цим параметром «шаблон» щоразу, коли ми створюємо нові дописи, вони створюватимуться з блоком абзацу, який має заповнювач «Напишіть своє вступне слово тут…».

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

На зображенні нижче показано, що ми отримаємо, коли створимо нові книжкові публікації. Це виглядає менш страшно, ніж чисте полотно, чи не так?

Майте на увазі, що атрибути відрізняються для кожного типу блоку, а також можуть відрізнятися у ваших налаштуваннях. У наведеному вище прикладі коду я додаю два атрибути до блоку Cover; вирівнювання блоку на «Повну ширину» та накладання кольору на попередньо визначений колір із спеціальної палітри кольорів.

Вирівнювання блоків «Wide Width» і «Full Width» має підтримуватися у вашій темі. У мене є допис, який пояснює, як додати підтримку у вашу тему для додаткових вирівнювання блоків, якщо ви з цим не знайомі. По-друге, моя тема надає спеціальну палітру кольорів Гутенберга, де один із кольорів палітри називається «блакитний профіль». Ймовірно, цього не буде у вашому коді. Посилання вище також пояснює це, якщо ви також не знайомі з спеціальною палітрою Гутенберга.

Причина, чому я вирішив надати колір накладання як атрибут, полягає в тому, як поводиться блок Cover. Коли ви створюєте блок обкладинки, він починає із запиту на вибір між встановленням фонового зображення або вибором кольору фону. Поки автор не вибере один із них, блок обкладинки приховує будь-який вміст (заголовок, абзац і кнопку, які ми додали)! Вони просто раптово з’являться після вибору зображення чи кольору. Тому, щоб уникнути плутанини, я попередньо вибрав колір фону, щоб автор одразу бачив усі блоки всередині. Колір завжди можна змінити в інспекторі (бічна панель).

Блокування шаблону блоку

За допомогою наданого шаблону блоку автор може переставляти та видаляти будь-які попередньо заповнені блоки, а також додавати нові блоки, де забажає. Якщо ви хочете цього уникнути, є ще один параметр register_post_type(): " template_lock".

Параметр ‘ template_lock‘ приймає два значення; ‘ all‘ або ‘ insert‘.

Встановлення для «template_lock» значення «all» повністю блокує авторам можливість змінювати, видаляти чи додавати нові блоки до вашого шаблону блоків. Вони можуть лише редагувати вміст і налаштування блоків, визначених як шаблон блоку. Це корисно у випадках, коли ви хочете, щоб усі типи публікацій складалися з однакових блоків у тому самому порядку – не більше і не менше.

Використання «insert» замість «template_lock» дозволяє авторам змінювати порядок блоків у шаблоні блоків. Але автори все ще не можуть додати нові блоки або видалити будь-який з блоків.

Ось як можна повністю заблокувати шаблон блоку для спеціального типу публікації " book":

Використання заблокованого шаблону блоку в Gutenberg виглядатиме так, як показано нижче. Зауважте, що значки дій для перевпорядкування блоків відсутні, а також відсутні посилання на блоки в меню. Також ніде немає значків дій для додавання нових блоків (маленький «+»).

Налаштування шаблонів блоків для існуючих типів публікацій

Якщо ви хочете використовувати шаблони блоків у публікаціях або на сторінках, ви також можете це зробити. Підключіть функцію initта використовуйте [get_post_type_object](https://developer.wordpress.org/reference/functions/get_post_type_object/)(). Укажіть потрібний тип публікації як параметр (« post» або «page»). Це повертає об’єкт, якому можна призначити властивості «template» і «template_lock».

Це приклад додавання того самого шаблону блоку та властивості блокування, що й вище, на сторінки:

Висновок

У цій публікації ми дізналися, як досягти кращого контролю над блоками в редакторі Gutenberg WordPress. Це має багато переваг, особливо в поєднанні з користувацькими типами публікацій, які мають відповідати певній структурі. Використання наведених вище методів допоможе вам оптимізувати процес як веб-майстру (допомагаючи людям писати кращі публікації), так і як розробнику теми (забезпечуючи загальний дизайн). Заблоковані шаблони блоків можуть бути іншим рішенням, ніж користувацькі шаблони дописів і мета дописів.

Налаштування шаблонів блоків на даний момент все ще є досить прихованою функцією Gutenberg. Але я очікую, що це зміниться, оскільки Gutenberg розвиватиметься та стане більш звичним місцем у WordPress.