Semanticality™ – инструмент семантики и доступности для WordPress

Semanticality™ — это инструмент для повышения семантики и доступности WordPress-сайтов с редактором Gutenberg без необходимости лезть в код. Он работает поверх существующего HTML, который генерируют блоки, и позволяет гибко настраивать теги и атрибуты прямо из интерфейса редактора.

Он решает три основные задачи:

• Упрощение семантических правок: меняем теги, атрибуты и ARIA без кастомного кода.
• Гибкость управления: локальные правила для отдельных страниц + глобальные для всего сайта.
• Поддержка доступности: помогает приблизиться к WCAG-комплаенс и улучшает UX для скринридеров.

Если коротко: пишешь правила → смотришь Live Preview → тестируешь со скринридером → публикуешь.

Основная идея проста: у каждого блока в WordPress есть HTML-вывод. Иногда этот вывод не соответствует требованиям семантики, доступности или стандартам SEO. С помощью Semanticality™ можно «переписать» этот вывод на этапе рендера страницы: заменить <div> на <section>, добавить атрибуты aria-*, подставить уникальные идентификаторы или изменить структуру, не прикасаясь к исходному коду темы или плагина.

Иногда визуально правки выглядят незаметно, но для скринридеров они критичны.

<!-- До -->
<div class="kt-accordion-header-wrap">
  <div class="kt-accordion-title">FAQ</div>
</div>

<!-- После -->
<section aria-labelledby="faq-title">
  <h2
    id="faq-title"
    class="kt-accordion-title"
    aria-label="FAQ – Frequently Asked Questions"
  >
    FAQ
  </h2>
</section>

Такая простая правка:

• даёт правильную структуру заголовков (WCAG 2.2 SC 2.4.6 Headings and Labels),
• улучшает навигацию для пользователей скринридеров (WCAG 2.2 SC 2.4.1 Bypass Blocks),
• позволяет скринридеру озвучить блок как «заголовок второго уровня» (WCAG 2.2 SC 1.3.1 Info and Relationships),
• улучшает SEO (Google любит структурированные заголовки).

Важно: При работе с плагином рекомендуется использовать Staging или локальную версию сайта и никогда не применять изменения на живом сайте без предварительного тестирования. Для некоторых HTML-элементов есть стандартные стили и изменения могут повлиять на внешний вид сайта или сломать некоторые JavaScript-скрипты.

Performance и нагрузка

Semanticality™ работает быстро, но вот что стоит учитывать:

1. Правила применяются на этапе рендера фронтенда, значит очень сложные или лишние селекторы могут замедлить отрисовку.
2. Чем больше правил в Global, тем выше нагрузка. Решение: оптимизируй их и объединяй.
3. Если у сайта десятки тысяч страниц:
   • сначала протестируй на staging,
   • настрой кэширование страниц,
   • используй плагин только для того, что реально улучшает доступность.

Совместимость и ограничения

Semanticality™ совместим с большинством тем и плагинов, но есть нюансы:

• Работает только с Gutenberg / блок-редактором WordPress.
• Не поддерживает: Elementor, Divi и другие визуальные билдэры.
• Работает как с блочными, так и с классическими темами. Даже если блоковый редактор отключён для типа записей, правила Site/Page всё равно могут нацеливаться на классическую разметку, например h1.entry-title, при условии что блоки где‑то на сайте используются.
• С мультисайтами работает, но глобальные правила хранятся отдельно для каждой сети. Каждая инстанция сайта должна иметь свою лицензию.
• Поддерживаются Reusable Blocks и Patterns, но проверяй Live Preview, т.к. селекторы внутри таких блоков бывают нестабильными.

Быстрый старт

Чтобы начать работу с плагином Semanticality™, выполните следующие шаги:

1. Откройте запись или страницу в редакторе. Semanticality™ работает непосредственно в процессе редактирования блоков. Для того, чтобы начать, откройте любую запись или страницу в редакторе Gutenberg. Убедитесь, что плагин установлен и активирован, а лицензия введена. Если доступно обновление плагина, обязательно установите его.

2. Выделите нужный блок. Как только блок выбран, в верхней панели инструментов появится новая кнопка Semanticality™ Rules — это и есть доступ к редактору правил.

   

3. Нажмите кнопку Semanticality™ Rules. Появится модальное окно с редактором, где вы сможете добавлять и управлять правилами.

   

4. Выберите вкладку:

   • (1) Local Block Rules — если хотите создать правила только для этого конкретного блока на этой конкретной странице.
   • (2) Global Block Rules — если хотите, чтобы правило автоматически применялось ко всем блокам данного типа на всём сайте на всех страницах и записях.

   

5. Добавьте новое правило. Нажмите «+ Add Rule», укажите CSS-селектор, выберите действие (например, изменить тег или атрибут) и задайте параметры.

   

6. Сохраните правила. Если редактируете локально — правила сохраняются в блоке. Если глобально — правила сразу применяются ко всем блокам соответствующего типа.

   

7. Опубликуйте или обновите запись. Это обязательный шаг для локальных правил: пока запись не сохранена, локальные изменения остаются только в редакторе. При глобальных правилах сохранение записи не требуется — они применяются сразу. Поэтому применяйте глобальные правила с осторожностью.

Интерфейс Semanticality™ Rules Editor

Semanticality™ Rules Editor — это мощный инструмент для создания и управления правилами. В этом разделе мы подробно рассмотрим его интерфейс и функционал.

Обзор интерфейса

Semanticality™ Rules Editor (Редактор семантических правил) — это отдельное окно, открывающееся поверх интерфейса WordPress-Gutenberg.

В нём есть несколько ключевых областей:

• Вкладки Local и Global, позволяющие переключаться между уровнями применения правил.
• Кнопки Copy и Paste для работы с наборами правил. Поддерживается множественный выбор: можно выделить сразу несколько правил и скопировать их.
• Список правил. Порядок имеет значение, поэтому поддерживается перетаскивание мышью для изменения последовательности. Нижние правила могут переопределять верхние.
• Кнопки Save и Close.
• Правая панель Live Code Preview, показывающая разницу в HTML блока до и после применения правил.

Горячие клавиши

Редактор поддерживает стандартные сочетания клавиш:

• Клик левой кнопкой мыши — выделяет одно правило.
• Shift+Клик — выделяет диапазон правил для копирования.
• Cmd/Ctrl+C — копировать выбранные правила.
• Cmd/Ctrl+V — вставить правила.
• Delete / Backspace — удалить выделенные правила.
• Cmd/Ctrl+Клик — добавляет или убирает отдельное правило из выделения.

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

Live Code Preview

Встроенная панель Live Code Preview справа помогает сразу видеть разницу между исходным HTML и итоговым кодом после применения правил. Это особенно важно при сложных сценариях: можно сразу убедиться, что изменения работают именно так, как задумано.

Боковая панель Site/Page Rules

Помимо кнопки в верхней панели, Semanticality™ добавляет в правую боковую панель редактора Gutenberg (Inspector) собственный раздел.

В этой панели доступны две группы правил:

• Site Rules — редактор сайтовых правил. Эти правила:
  • хранятся в настройках сайта;
  • применяются ко всему HTML-документу (и к <head>, и к <body>), а не только к содержимому конкретных блоков;
  • задают базовый уровень семантики и доступности для всех страниц.
• Page Rules — редактор страничных правил. Эти правила:
  • привязаны к конкретной записи или странице;
  • переопределяют сайтовые правила только для текущей страницы;
  • помогают настроить уникальные семантические требования лендингов и специальных шаблонов.

Оба редактора используют тот же удобный интерфейс RuleEditor (список правил, drag&drop, копирование/вставка, Live Preview), но работают на более высоком уровне, чем локальные и глобальные блоковые правила.

По сути, Site и Global правила похожи:

• и те, и другие хранятся в настройках сайта и не требуют сохранения записи;
• различается область применения:
  • Site Rules действуют в масштабе всего HTML (head + body);
  • Global Rules применяются только к HTML тех блоков, для которых заданы (конкретный block type).

Типичный сценарий:

• в Site Rules вы задаёте общие правила (например, единый tabindex или ARIA-атрибуты для повторяющихся элементов на всех страницах);
• в Page Rules точечно переопределяете эти значения для одной-двух особых страниц;
• в Global/Local правилах доводите разметку до идеала на уровне конкретных блоков.

Принцип работы и функционал Semanticality™

Semanticality™ действует как промежуточный слой между Gutenberg и финальным HTML. Каждый раз, когда блок отрисовывается, плагин «проходит» по его структуре и проверяет, есть ли для этого блока правила. Если они есть, HTML изменяется на лету.

В основе плагина лежит работа с CSS-селекторами. Это привычный способ указать, какой элемент нужно модифицировать. Селектор автоматически конвертируется в XPath, чтобы можно было работать с деревом документа.

Доступные действия

• Change Tag — замена тега одного элемента на другой (например, <div> → <section> или <p> → <h3>). Это особенно полезно для улучшения заголовочной иерархии или превращения «бессмысленных» контейнеров в семантически значимые элементы.
• Modify Attribute — работа с атрибутами. Можно добавлять новые, заменять существующие, удалять ненужные. Это применяется например для ARIA-атрибутов, class, id, микроразметки и т. д.

Режимы применения селектора

• First (аналог querySelector) — правило применяется только к первому найденному элементу внутри блока.
• All (аналог querySelectorAll) — правило применяется ко всем элементам, которые подходят под селектор.

Вставка значения атрибута:

Сперва выберите атрибут:

• CSS Selector — любой валидный CSS-селектор, включая: .class, #id, div > p, figure img, a[href^="/"], :not(), :nth-child(), и т. д.

Затем выберите действие:

• Add / Replace — записывает значение целиком, полностью заменяя старое. Если атрибут не существует, он будет создан.
• Append — добавляет значение в конец (для class — через пробел, для style — через ;) после существующего значения.
• Prepend — добавляет значение в начало атрибута перед существующим значением.
• Remove — полностью удаляет атрибут.

И введите значение:

• Attribute Value — текстовое значение атрибута. Можно использовать переменные (см. ниже).

Переменные в значениях атрибутов внутри правил

Semanticality™ поддерживает динамические подстановки в значениях атрибутов. Это позволяет создавать уникальные ID или использовать данные поста без ручного ввода. В поле Attribute Value можно подставлять динамические плейсхолдеры:

• {post_title} — заголовок текущего поста из базы данных WordPress.
• {post_id} — ID поста из базы данных WordPress.
• {meta_ключ} — значение произвольного мета-поля из базы данных WordPress. Пример: {meta_price}.
• {id_ваш-лейбл} — уникальный случайный ID на время рендера блока. Пример: {id_ваш-лейбл} → barrierenlos-abc123…, где ваш-лейбл — это произвольный текстовый лейбл, который вы задаёте, а abc123 — случайная строка. barrierenlos — префикс, чтобы избежать конфликтов с другими ID на странице.

Эти переменные особенно полезны например для связок aria-labelledby / id или для микроразметки.

Типы правил: Site, Page, Global и Local

Понимание различий между уровнями правил — ключ к правильной работе с плагином.

• Site Rules (сайтовые правила) — действуют на весь сайт и выполняются первыми. Идеальны для кросс‑сайтовых правок доступности, базовых атрибутов (tabindex, role, aria-*) и глобальных «дефолтов». Настраиваются через отдельный редактор в боковой панели или в разделе настроек плагина в админке.
• Page Rules (страничные правила) — применяются только к конкретной записи/странице и переопределяют Site Rules перед Global/Local. Удобны для лендингов и специальных шаблонов.
• Global Rules (глобальные блоковые правила) — привязаны к типу блока (например, ко всем core/image). Применяются после Site/Page и до Local.
• Local Rules (локальные правила) — привязаны к конкретному экземпляру блока на конкретной странице. Имеют самый высокий приоритет.

Эффективная цепочка приоритетов:

Site → Page → Global → Local

Внутри каждого уровня правила применяются сверху вниз в списке; если несколько правил затрагивают один и тот же элемент и атрибут, последнее совпадающее правило побеждает.

Локальные правила (вкладка Local Block Rules)

Локальные правила хранятся непосредственно внутри блока. Это значит, что они действуют только на конкретный экземпляр. Если вы дублируете блок, правила дублируются вместе с ним.

• Хранятся в атрибутах конкретного блока.
• Действуют только для текущего блока.
• Требуют сохранения записи. Если закрыть редактор без сохранения, все локальные изменения будут потеряны.

Важно: Если вы скопируете весь код записи (три точки → Код редактора) и вставите его в другой пост, локальные правила поедут вместе с блоками — это быстрый способ переноса правил всей страницы. Например, из тестовой версии в рабочую.

Глобальные правила (вкладка Global Block Rules)

Глобальные правила сохраняются в настройках сайта. Они применяются сразу ко всем блокам данного типа после сохранения настроек в плагине.

• Хранятся в опциях сайта.
• Действуют на всех страницах и записях. Применяются ко всем блокам этого типа (в т.ч. уже опубликованным).
• Не требуют сохранения текущего поста — изменения вступают в силу сразу после сохранения в плагине.

Практический пример: если вы хотите, чтобы все изображения (core/image) на сайте имели loading="lazy", настройте это один раз через глобальные правила — и это будет работать везде.

Приоритеты и порядок применения правил

При работе с несколькими правилами важно понимать, какое из них будет иметь приоритет, чтобы избежать конфликтов и нежелательных эффектов.

1. Порядок в списке имеет значение. Правила применяются сверху вниз внутри своего уровня. Если два правила воздействуют на один и тот же элемент и один атрибут, итоговое значение задаётся последним правилом. Это значит, что «последнее правило — главное».

2. Уровни правил имеют фиксированный приоритет. Цепочка приоритетов: Site → Page → Global → Local. Если правила из разных уровней конфликтуют (одинаковый селектор/атрибут), побеждает уровень, расположенный правее в этой цепочке (локальные — самые сильные).

3. Родительские и дочерние блоки. В предпросмотре при выборе родителя отображаются дети уже с применёнными локальными правилами. Если в родительском блоке создать своё правило, оно будет иметь приоритет над изменениями дочернего (при равных условиях селектора/атрибутов).

Копирование/вставка наборов правил

В редакторе Semanticality™ можно копировать и вставлять наборы правил в формате JSON. Это удобно для переноса или резервного копирования.

1. Выделите нужные правила. Используйте Shift+Клик для выделения диапазона или Cmd/Ctrl+Клик для выбора отдельных правил. Как только правила выделены, возле кнопки Copy появится цифра, показывающая количество выделенных правил.

   

2. Скопируйте правила. Нажмите Cmd/Ctrl+C или кнопку Copy, чтобы скопировать выделенные правила в буфер обмена — в буфер попадёт JSON-пакет, например:

   {
     "type": "semanticality.rules",
     "version": 1,
     "scope": "local",
     "rules": [
       {
         "actionType": "modifyAttribute",
         "selector": "img",
         "selectorMode": "querySelectorAll",
         "attributeName": "loading",
         "insertionMode": "replace",
         "value": "lazy"
       }
     ]
   }

3. Вставьте правила. Перейдите в нужное место и нажмите Cmd/Ctrl+V или кнопку Paste, чтобы вставить правила из буфера обмена.

Таким образом, вы можете легко переносить правила между разными записями или сайтами. Так как локальные правила хранятся в атрибутах блоков, при копировании кода записи они переносятся вместе с блоками. То есть вы можете скопировать весь код записи (три точки → Код редактора) и вставить его в другой пост — локальные правила поедут вместе с блоками.

Вы даже можете автоматически сгенерировать правила в JSON-формате через чат (например, ChatGPT) и вставить их в редактор.

Особенности копирования/вставки

• Paste вставляет из буфера. Если формат не распознан, появится подсказка вставить вручную (в модальном поле).
• При вставке правила помечаются как текущая вкладка (local или global).
• Неверные элементы игнорируются с уведомлением.

Поведение плагина при работе с Reusable Blocks и Patterns

Reusable Blocks и Patterns в Gutenberg позволяют повторно использовать наборы блоков на разных страницах. Semanticality™ поддерживает работу с такими блоками, но есть некоторые особенности, которые важно учитывать:

1. Локальные правила в Reusable Blocks: Локальные правила, созданные внутри Reusable Block, будут применяться ко всем инстанциям этого блока на всех страницах, где он используется. Это значит, что если вы измените локальные правила в Reusable Block, эти изменения отразятся везде, где этот блок вставлен.
2. Глобальные правила: Глобальные правила, созданные для блоков внутри Reusable Blocks, будут работать так же, как и для обычных блоков. Они будут применяться ко всем инстанциям соответствующих блоков на сайте.
3. Редактирование Reusable Blocks: При редактировании Reusable Block в отдельном окне убедитесь, что вы сохраняете изменения, чтобы локальные правила были обновлены. После сохранения Reusable Block, все страницы, где он используется, автоматически получат обновленные правила.
4. Редактирование Reusable Block на странице: При выборе Reusable Block на странице, локальные правила, созданные для этого блока, будут отображаться как уже примененные и окно редактирования правил будет пустым. В Live Code Preview вы уже увидите изменения, внесённые локальными правилами Reusable Block при его создании в отдельном окне. На странице редактирования записи вы можете добавить новые локальные правила, которые применятся непосредственно к этой инстанции Reusable Block.
5. Patterns: Паттерны (Patterns) в Gutenberg — это предустановленные наборы блоков. Semanticality™ будет работать с блоками внутри паттернов так же, как и с обычными блоками. Локальные правила, созданные внутри паттерна, будут применяться только к тем инстанциям паттерна, которые были вставлены на страницу.

Таким образом вы можете использовать Semanticality™ для улучшения семантики и доступности как в Reusable Blocks, так и в Patterns, обеспечивая единообразие и удобство управления правилами на всём сайте.

С помощью Reusable Blocks вы можете делать локальные правила глобальными для всех страниц, где используется этот блок. Это особенно полезно для часто используемых компонентов, таких как аккордеоны, табы, кнопки и т. д.

Самые важные моменты работы с плагином

Вот выжимка из самых важных моментов, которые стоит помнить при работе с Semanticality™:

• Последнее (внизу списка) правило для одного и того же атрибута — главное.
• Выделение правил: Shift — диапазон, Cmd/Ctrl — добавление/снятие, работают горячие клавиши.
• Предпросмотр родителя показывает детей с учётом их правил; в родителе можно переопределить.
• Выйдете без сохранения записи — локальные правила сбросятся.
• Глобальные правила применятся везде сразу — даже без сохранения поста.
• Очень большое число локальных правил может заметно нагрузить редактор.
• Копирование кода записи переносит и локальные правила — удобно для миграции/тестов.
• После сохранения правил Live Preview пересобирает базу и показывает дифф от нового состояния.
• Никогда не забывайте тестировать изменения на Staging или локальной версии сайта - для них не нужно покупать отдельную лицензию.

Самые частые сценарии использования

Вот несколько распространённых сценариев и как их реализовать с помощью Semanticality™:

• Заменить тег: Change Tag → CSS Selector → New Tag Name.
• Добавить класс: Modify Attribute → class → Append → my-class.
• Удалить роль: Modify Attribute → role → Remove.
• Первый/все элементы: Mode = First / All.
• ID + ARIA: на заголовок id: {id_title}, на кнопку aria-labelledby: {id_title}.

Самые частые ошибки

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

• Пустой селектор → правило не выполнится.
• Несуществующий атрибут + Append/Prepend → плагин корректно создаст атрибут (вместе с разделителем), но проверьте, что это действительно нужно.
• Слишком общий селектор в Global (например, *) может затронуть много мест. Сужайте область.

Советы по отладке

Если что-то пошло не так, вот несколько советов по отладке:

1. Сначала — локально. Проверьте правило на одном блоке, затем переносите в глобальные.
2. Смотрите в Live Preview. Там сразу видно, какая строка добавилась/изменилась/удалилась.
3. Используйте переменные ({post_title}, {meta_*}, {id_*}) — это удобно и избавляет от ручных ID.
4. Не бойтесь сложных селекторов, но избегайте «избыточных» — они тяжелей читаются и поддерживаются.

Практические сценарии (Kadence + Core)

В этом разделе приведены примеры реальных задач и решений. Каждый пример оформлен в виде набора правил, которые можно задать в редакторе. Задавайте их во вкладке Local для теста, затем переносите в Global при необходимости.

Kadence Accordion → семантический список

Блок: kadence/accordion и дочерние kadence/pane. Цель: сделать так, чтобы аккордеон воспринимался как семантический список с заголовками, чтобы улучшить доступность и восприятие контента и выполнить требования критерия WCAG 2.2 1.3.1. "Info and Relationships". Для этого необходимо:

1. Для kadence/accordion глобально:

   • Заменить div.kt-accordion-inner-wrap на <ul>.
   • Заменить div.wp-block-kadence-pane на <li>.
   • Добавить атрибут aria-label="FAQ - Frequently Asked Questions" на .kt-accordion-header-wrap.

2. Для kadence/pane:

   • Заменить .kt-accordion-header-wrap на <h3>.

Результат: экранные читалки воспринимают аккордеон как список секций с заголовками, что значительно повышает доступность. Вот как мы можем это сделать с помощью редактора правил Semanticality™:

Для kadence/accordion (глобально)

Для начала сделаем три глобальных правила на kadence/accordion. Мы сделаем их сразу глобальными, чтобы эти правила применились на все инстанции этого блока на сайте и не пришлось создавать новые правила для каждой инстанции.

1. Создадим правило с Action "Change Tag"

• CSS Selector: div.kt-accordion-inner-wrap
• Mode: First
• New Tag Name: ul

2. Создадим правило с Action "Change Tag"

• CSS Selector: div.wp-block-kadence-pane
• Mode: All
• New Tag Name: li

3. Создадим правило с Action "Modify Attribute"

• CSS Selector: .kt-accordion-header-wrap
• Mode: First
• Attribute Name: aria-label
• Insertion: Add / Replace
• Attribute Name: aria-label
• Value: FAQ - Frequently Asked Questions

Теперь все kadence/accordion являются списками и внутри них находятся элементы li. Также мы добавили атрибут aria-label для того, чтобы сообщить экранным читалкам, что это аккордеон с вопросами и ответами.

Для kadence/pane (глобально)

Далее зададим правила для kadence/pane. Опять же сделаем их глобальными, чтобы эти правила применились на все инстанции этого блока на сайте и не пришлось создавать новые правила для каждой инстанции.

1. Создадим правило с Action "Change Tag"

• CSS Selector: .kt-accordion-header-wrap
• Mode: First
• New Tag Name: h3

Теперь все заголовки в kadence/pane являются заголовками третьего уровня и пользователи электронных читалок могут быстро ориентироваться в структуре контента через меню заголовков.

Kadence InfoBox: поменять местами заголовок и текст

Блок: kadence/infobox Цель: поменять местами заголовок и текст, чтобы текст был в <h3>, а заголовок в <p>. Это улучшит иерархию заголовков на странице и сделает контент более логичным и позволит выполнить требования WCAG 2.2 2.4.10 "Section Headings".

1. Создадим правило с Action "Change Tag"

• Selector: .kt-blocks-info-box-title
• New Tag Name: p

2. Создадим правило с Action "Change Tag"

• Selector: p.kt-blocks-info-box-text
• New Tag Name: h3

Core Image: заменить <figure>/<figcaption>

Блок: core/image Цель: В этом сценарии мы заменим семантические элементы на более простые, чтобы упростить структуру HTML. Не всегда необходимо использовать <figure> элементы, если на них нет ссылки в тексте или если они не содержат значимого контента.

1. Создадим правило с Action "Change Tag"

• Selector: figure
• New Tag Name: div

2. Создадим правило с Action "Change Tag"

• Selector: figcaption
• Mode: All
• New Tag Name: small

3. Создадим правило с Action "Modify Attribute"

• Selector: small
• Attr: id
• Insertion: Add / Replace
• Value: {id_figure_caption}

Добавим атрибут id к подписи, чтобы было возможно связать ее с другими блоками.

4. Создадим правило с Action "Modify Attribute"

• Selector: img
• Attr: aria-describedby
• Insertion: Add / Replace
• Value: {id_figure_caption}

С помощью этого правила мы добавим атрибут aria-describedby к изображению, чтобы связать его с подписью. Это улучшит доступность, так как экранные читалки смогут прочитать подпись вместе с изображением.

Автоматические ID и связи для кнопок «Подробнее»

Для карточек:

1. Modify Attribute

• Selector: .card-title
• Attr: id
• Value: {id_card_title}

2. Modify Attribute

• Selector: .card-readmore
• Attr: aria-labelledby
• Value: {id_card_title}

Микроразметка на цитатах

Блок: core/quote

1. Modify Attribute

• Selector: blockquote
• Attr: itemtype
• Value: https://schema.org/Quotation

2. Modify Attribute

• Selector: blockquote
• Attr: itemscope
• Value: `` (оставьте пустым — наличие атрибута уже включает scope)

Заключение

В этом руководстве мы рассмотрели, как использовать редактор Semanticality™ для создания и редактирования правил преобразования контента в блоках Kadence. Мы обсудили основные концепции, такие как селекторы, действия и атрибуты, а также привели примеры использования переменных и готовых шаблонов.

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

Если у вас есть дополнительные вопросы или вам нужна помощь, не стесняйтесь обращаться к нам по имейлу поддержки, если вы обладаете соответствующей лицензией.

С уважением,

Команда поддержки Semanticality™

semanticality@barrierenlos.com

FAQ - Часто задаваемые вопросы

Что будет, если добавить очень много правил?

Редактор начнёт работать медленнее, так как каждое правило ререндерит предпросмотр. Однако для заметного торможения нужно действительно очень большое количество правил.

С точки зрения конечного рендера для клиента количество правил увеличивают нагрузку на сервер, так как при рендере сайта сервер не только обрабатывает контент, но и применяет все правила к каждому элементу. Однако это не должно вызывать проблем, если сервер достаточно мощный.

Можно ли переопределить глобальное правило локальным?

Да. Локальные правила всегда приоритетнее глобальных, если совпадают действие, селектор и атрибут.

Что значит «последнее правило — главное»?

Порядок применения сверху вниз. Если несколько правил воздействуют на один атрибут, результат задаётся нижним правилом в списке.

Что произойдёт с локальными правилами, если закрыть окно без сохранения записи?

Локальные правила будут потеряны, так как они сохраняются только вместе с записью.

Что произойдет с глобальными правилами, если закрыть окно без сохранения записи?

Глобальные правила сохраняются сразу в опциях сайта и начинают действовать без сохранения поста.

Можно ли перенести правила на другой сайт или пост?

Да. Скопируйте код записи в режиме «Код редактора» и вставьте его в другой пост. Все локальные правила перенесутся автоматически.

Как работает предпросмотр в родительских блоках?

Родитель отображает дочерние элементы уже с применёнными к ним локальными правилами. В родительском блоке можно переписать эти изменения — и они будут приоритетнее.

Как работать с выделением и горячими клавишами?

Можно выделять несколько правил, копировать их (Ctrl+C), вставлять (Ctrl+V) или удалять (Delete). Поддерживается множественное выделение (через Shift или Ctrl/Cmd).

Что происходит после сохранения правил?

Live Preview перестраивается и показывает изменения относительно нового состояния блока. Это может выглядеть как «ступенчатое» обновление — это нормально.

Есть ли мобильная версия редактора?

Пока нет, но она находится в планах разработки.

Можно ли генерировать правила через ChatGPT?

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