Block Attributes: плагін для додавання довільних HTML-атрибутів в WordPress

Добавление атрибута onclick к блоку Button

Раніше на цьому тижні в офіційному каталозі WordPress з’явився четвертий плагін від компанії websevendev – Block Attributes. Розширення дозволяє додавати довільні HTML-атрибути до будь-якого блоку.

Одна з наявних проблем з редактором WordPress полягає в деяких обмеженнях на модифікацію HTML-коду. Блоки проектуються на базі набору стандартів, і розмітка повинна їм відповідати. Якщо щось не відповідає стандартам, то в такому випадку користувачі побачать попередження про неприпустимою розмітці.

Бувають ситуації, коли користувачам потрібно додати довільний HTML-атрибут. Наприклад, мені іноді потрібно додати довільний атрибут data- для роботи з JS. Оскільки я досить добре розбираюся в коді, я зазвичай пишу HTML через блок Custom HTML. Однак це позбавлено сенсу, коли потрібно додавання пари атрибутів.

В даний час WordPress дозволяє додавати класи і ID (звані «HTML anchor» в консолі) практично до будь-якого блоку. При цьому безпосередньо ввести десятки інших можливих атрибутів, підтримуваних HTML, не вийде. Все це рідко потрібно звичайному користувачеві.

Якщо ж потрібен був розширений функціонал, можна встановити плагін Block Attributes.

Плагін досить простий у використанні. Він додає нове поле під назвою Additional attributes, яке міститься у вкладці Advanced у кожного блоку. Користувачі можуть додати ім’я атрибута і клацнути по кнопці Add. З’явиться нове поле для введення значення атрибута.

Плагін також підтримує множинні атрибути. Як тільки ви додасте один атрибут, ви можете використовувати те ж саме поле для додавання інших атрибутів.

Для тесту я додав простий атрибут onclick зі значенням myFunction (). Потім я перейшов до своєї теми і створив цю функцію за допомогою JavaScript, щоб вивести просте повідомлення в консолі. У коді все виглядало чудово, та й спрацювало все відмінно.

HTML-вид
HTML-вид
Вид в консоли
Вид в консолі

У більшості випадком мені потрібні атрибути для роботи з JS. Це був простий приклад, який демонструє межі можливого. З такою опцією розробник може робити і складніші речі. Тому слід тримати плагін в своєму арсеналі інструментів – адже іноді потрібно гайковий ключ замість молотка.

Використання Block Attributes може стати в нагоді для додавання атрибутів ARIA в тих ситуаціях, коли це може сприяти доступності.

Користувачі можуть додавати свої стилі до кожного конкретного блоку за допомогою атрибута style. Правда, якщо тільки це не разовий прийом, я б не рекомендував його. Для більш складних випадків є плагін Blocks CSS. У нього є вбудоване підсвічування синтаксису. Та й текстова область набагато зручніше, ніж вводити всі стилі в однорядкове поле введення.

Єдиний мінус плагіна Block Attributes – деактивація. Якщо ви додавали якісь довільні атрибути, ви побачите неприємне повідомлення в редакторі: «Цей блок містить несподіване або неприпустиме вміст».

Попередження після деактивації плагіну
Попередження після деактивації плагіну

Деактивация плагіна не повинна впливати на висновок під фронтендів. В іншому плагін – цілком собі зручне рішення для додавання довільних HTML-атрибутів.

Прокоментувати

Ваша e-mail адреса не оприлюднюватиметься. Обов’язкові поля позначені *