MevvBlocks — Документация Mevvsoft

Установка

MevvBlocks требует WordPress 6.0 или новее и PHP 8.1 или новее. Других зависимостей нет: ни внешней библиотеки, ни шрифта с чужого сервера, ни шага сборки.

Загрузите и активируйте плагин.
Откройте страницу в блочном редакторе и добавьте блок Контейнер.
Поместите внутрь нужные блоки. Вы найдёте их в категории Оформление.
Остальным управляйте из меню MevvBlocks в боковой панели админки.

WooCommerce необязателен. Его установка добавляет два блока.
MevvBridge необязателен. Если вы пришли с Elementor, именно MevvBlocks снова делает эти страницы редактируемыми.
MevvLegal необязателен. Если он есть, блок карты передаёт свою вставку MevvLegal, чтобы карта не загружалась до согласия посетителя.

Pro — отдельный плагин, устанавливаемый рядом с бесплатным, и он объявляет бесплатный плагин обязательным требованием. Лицензионный ключ вводится на экране Lisans (лицензия). Без Pro MevvBlocks вообще не обращается к нашим серверам.

Стиль под каждый размер экрана — пробел, который это закрывает

Блоки ядра принимают одно значение внутреннего отступа, одну минимальную высоту, одно число колонок. Это значение действует на любом экране. Если секции нужно 100 пикселей отступа на десктопе и 40 на мобильном, ядро этого выразить не может — и именно этот единственный пробел является самой частой технической причиной, по которой люди ставят конструктор страниц.

MevvBlocks хранит три значения вместо одного — десктоп, планшет, мобильный. Пороги фиксированы:

Десктоп: Без медиазапроса — базовое значение.
Tablet (планшет): Действует при 1024 пикселях и ниже.
Мобильный: Действует при 767 пикселях и ниже.

Те же два числа используются везде в плагине — порог «гамбургера» у меню, число колонок у сетки. Свободное поле для пикселей намеренно не предложено: выбравший 900 получил бы «гамбургер» на 900, тогда как его отступы по-прежнему менялись бы на 1024, а две системы брейкпоинтов означают макеты, которые сами себе противоречат.

Значения живут в собственных атрибутах блока, внутри post_content, — не в отдельной таблице и не в мета-полях записи. CSS формируется на сервере, в момент запроса, и выводится небольшим блоком стилей рядом с тем элементом, к которому относится.

Почему не сохранять CSS вместе со страницей? Потому что сохранённый HTML может нести только один брейкпоинт. Именно отрисовка по запросу вообще делает возможными три значения — и именно поэтому истёкшая лицензия никогда не может погасить опубликованную страницу: на этом пути нет ни одной проверки лицензии.

Предпросмотр в редакторе — что он показывает и чего ещё не может

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

Что сегодня точно на холсте: раскладка контейнера (направление, колонки, промежуток, выравнивание), внутренние и внешние отступы, фон, рамка, скругление, тень, минимальная высота, типографика, трансформации, маски и позиционирование — причём значения для планшета и мобильного применяются при изменении размера, потому что холст — это iframe и медиазапросы внутри него работают.

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

Что по-прежнему неточно: правила, нацеленные на разметку внутри блока. На холсте блок рисует собственные элементы редактирования, поэтому селектору, написанному под структуру фронтенда, нечему соответствовать. Чтобы это закрыть, нужно сделать разметку редактирования идентичной опубликованной для каждого из ста десяти блоков; это настоящая работа, и она не сделана.

Измерено, а не заявлено: одна и та же секция была отрисована дважды под одной таблицей стилей — один раз так, как её выводит фронтенд, другой раз так, как её строит холст, — и на каждом элементе сравнивались шестнадцать свойств макета. Старый холст отличался по двадцати четырём из них. Теперь это ноль из шестидесяти четырёх. Инструмент, который это измеряет, лежит в исходном коде плагина (tools/onizleme-esitlik.js), и его сначала направили на старую разметку, чтобы доказать, что он не слепой.

Блоки

110 блоков, или 87 без WooCommerce. Все они есть в бесплатной редакции, кроме трёх, отмеченных ниже как Pro; других блоков только-для-Pro нет. Они живут в категории Дизайн инсертера, а ключи настроек, которые каждый из них хранит, перечислены в docs/BLOK-AYARLARI.md внутри плагина — это генерируемый файл, поэтому он не может разойтись с кодом.

Группы ниже — те же пять, которые плагин использует для своих демонстрационных страниц.

Текст и действие: Контейнер, Заголовок, Текст, Кнопка, Разделитель, Отступ, Якорь, Изображение, Шорткод, Цитата, Чек-лист, Код, Призыв к действию, Иконка, Блок с иконкой, Список с иконками, Анимированный заголовок, Уведомление, Переключатель, Вложенные вкладки с панелями вкладок, Вкладки, Аккордеон, FAQ, Шаги
Данные и цены: Счётчик, Полоса прогресса, Полоса данных, Круговая диаграмма, Числовой блок, Таблица тарифов, Прайс-лист, Отзыв, Рейтинг звёздами, Карусель отзывов, Участник команды, Обратный отсчёт, Значок, Полоса логотипов, Переключатель контента и Панель переключателя (Pro)
Портфолио и карта: Лента событий, Таблица, Сравнение, Оглавление, Карта, Сетка контента, Карта сайта, Портфолио (Pro)
Медиа и формы: Видео, Аудио, Плейлист, Галерея, До / После, Переворачивающийся блок, Баннер, Точка на изображении, Подсказка, Соцлента, Иконки соцсетей, Кнопки «Поделиться», Слайдер, Слайды, Текст по контуру, Выдвижная панель, Кнопки связи, Полоса объявлений, Прогресс чтения, Время чтения, Наверх, Форма, Форма входа, Форма регистрации, Рассылка, Форма поиска, Меню навигации, Lottie (Pro)
Дизайн и движение: SVG-анимация, Блок с изображением, Копирайт и восемь стилей блоков, описанных ниже. Движение — не блок: панель с анимацией появления, закреплённым положением и параллаксом добавляется к каждому блоку MevvBlocks.
Сайт и шаблоны темы: Логотип сайта, Название сайта, Слоган сайта, Заголовок страницы, Хлебные крошки, Сведения о записи, Блок автора, Комментарии, Предыдущая / Следующая, Заголовок архива, Описание архива
WooCommerce (23): Товары, Категории товаров, Изображения товара, Название товара, Цена товара, Рейтинг товара, Краткое описание, Описание товара, Метаданные товара, Дополнительная информация, Вкладки товара, Добавить в корзину, Наличие, Похожие товары, Апсейлы, Кросс-сейлы, Мини-корзина, Корзина, Оформление заказа, Мой аккаунт, Отслеживание заказа, Сортировка товаров, Счётчик результатов — добавляются только когда активен WooCommerce

Замечание о добавленных недавно, потому что каждый несёт решение, которое видно на странице:

Переключатель: Родной <details>, который принимает любые блоки внутрь и может быть вложен в другой переключатель. Настройки: baslik (текст сводки) и acik (открыт при загрузке). Никакой id не нужен, поэтому два переключателя на одной странице не могут столкнуться.
Вложенные вкладки и панель вкладки: Группа вкладок, панели которой — обычные вложенные блоки, поэтому панель может держать что угодно, включая другую группу вкладок. Настройки группы: yon (горизонтально или вертикально) и acik (вкладка, открытая при загрузке); у каждой панели есть baslik. Полоса вкладок несёт шаблон вкладок ARIA со стрелками, Home и End, а id делаются уникальными в пределах группы, поэтому вложение безопасно. Группе принадлежат только непосредственные дочерние панели. Вертикальная полоса на узком экране становится горизонтальной.
Круговая диаграмма: Круг или кольцо (tur), строки записываются как «подпись | значение | необязательный цвет» в satirlar, плюс baslik. Круг рисуется через stroke-dasharray и несёт role="img"; те же значения печатаются под ним текстовым списком с процентами, потому что диаграмма, которую никто не может прочитать, — украшение. Она не анимируется.
Плейлист: Аудио или видео (tur), с baslik и повторителем дорожек: dosya, baslik, sure, poster и altyazi (дорожка WebVTT). Каждая дорожка печатается как обычная ссылка, поэтому списком можно пользоваться до того, как отработает любой скрипт; со скриптом выбор дорожки подменяет источник на месте.
Соцлента: Записи, которые вы выбираете вручную, разложенные в sutun колонок. У каждого элемента есть adres, metin, tarih и gorsel. Нет ни адаптера API, ни токена, ни запроса в какую-либо сеть — это список ссылок, и плагин так и говорит, а не намекает на живую ленту.
Подсказка: metin — слово в вашем предложении, ipucu — пояснение, konum — сторона, с которой она открывается. Это настоящая кнопка, а на пузырьке стоит role="tooltip": наведение и фокус обрабатываются в CSS, касание — в скрипте, а Escape закрывает. Пузырёк скрывается через visibility, а не удаляется, поэтому связь described-by остаётся в дереве доступности.
SVG-анимация: dosya — это SVG, durgun — неподвижный кадр, alt — альтернативный текст, genislik — ширина. Файл отрисовывается внутри <img>, и это намеренно: скрипт внутри SVG так не может дотянуться до вашей страницы. <picture> подставляет неподвижный кадр, когда посетитель попросил уменьшить движение.
Уведомление, Анимированный заголовок, Лента событий, Таблица, Переворачивающийся блок: Уведомлению можно дать кнопку закрытия (kapatilabilir), и при закрытии фокус переходит к следующему элементу; его тип и заголовок редактируются. Анимированный заголовок выбирает свой тег (baslik_etiketi, h1–h6, p, div или span) и может печатать свои слова (etki) — первое слово выводится всегда, и оба эффекта останавливаются при уменьшенном движении. Лента событий принимает горизонтальную раскладку (yon), которая на узком экране возвращается к вертикальной без изменения порядка чтения. Ячейки заголовков таблицы несут scope="col", а пустая ячейка печатает прочерк с подписью для программы чтения с экрана. Переворачивающийся блок поворачивается по касанию, Enter и пробелу, а Escape поворачивает его обратно.
Переключатель контента (Pro): Полоса вкладок — обычно месяц и год — над панелями переключателя, которые держат любые блоки. Настройки: etiket (доступное имя полосы), rozet (значок, например об экономии) и acik; у каждой панели есть baslik.
Портфолио (Pro): gonderi_turu, taksonomi, terimler, adet, sutun, suzgec (показать фильтр) и arsiv_bag (ссылка на архив). Карточки отрисовываются на сервере, а фильтр лишь прячет и показывает их в браузере, поэтому со страницы не уходит ни одного запроса. Нет ни модального окна, ни постраничной навигации.
Lottie (Pro): adres, alt, baslik, durgun (неподвижный кадр), onay и onay_metni. LottieFiles — внешний сервис, поэтому блок идёт тем же путём согласия, что карта и видео: он показывает неподвижное изображение, пока посетитель не согласится, а при уменьшенном движении не проигрывается никогда. Библиотека плеера по-прежнему не поставляется в комплекте.

Ничто здесь не скрыто, когда JavaScript не загрузился. Вкладки показывают каждую панель, переключатель и аккордеон — родные элементы details, слайдер прокручивается, плейлист — это список ссылок, а стрелки печатаются скрытыми, пока скрипт не сможет ими управлять: показать кнопку, которая ничего не делает, значит показать сломанный интерфейс. Скрытый контент — недоступный контент. У кнопок и ссылок-действий минимальный размер цели 44 пикселя.

Стили блоков

Восемь стилей регистрируются через собственный register_block_style WordPress, поэтому они появляются в панели Стили, которую редактор уже показывает для выбранного блока. Учить новый элемент управления не нужно, а выбор хранится как класс is-style-… в вашей разметке, а не как настройка в какой-то нашей таблице.

Градиентное перекрытие: Контейнер, Изображение, Блок с изображением, Баннер, Слайдер
Оттенки серого, цвет при наведении: Изображение, Блок с изображением, Участник команды, Полоса логотипов, Галерея
Размытие до наведения: Изображение, Блок с изображением, Баннер
Круглая маска / Скруглённая маска: Изображение, Блок с изображением, Участник команды — а для скруглённой ещё Баннер и Галерея
Подъём при наведении: Контейнер, Блок с иконкой, Блок с изображением, Таблица тарифов, Участник команды, Отзыв, Призыв к действию, Баннер
Увеличение изображения при наведении: Изображение, Блок с изображением, Баннер, Галерея
Наклон при наведении: Блок с иконкой, Блок с изображением, Баннер, Числовой блок

Каждая трансформация при наведении отключается, когда система посетителя просит уменьшить движение. Чтобы стиль применился, класс должна нести обёртка блока, поэтому слой отрисовки теперь снимает атрибут className ядра с внутренней разметки и печатает его на обёртке; страницы, преобразованные через MevvBridge, этот атрибут никогда не несли, поэтому их это не затрагивает.

Блок рассылки

Поле адреса, необязательное поле имени (ad_alani), флажок согласия и кнопка отправки. Тексты ваши: baslik, metin, dugme_metni, onay_metni и basari_metni.

Это обычный POST, подписанный HMAC, а не nonce. Nonce привязан к сессии и к двенадцати часам; за полностраничным кэшем истёкший nonce убивает форму молча. Подпись та же, что использует движок форм.
Заполненное поле-ловушка проглатывается молча. Показать ошибку значит научить следующего бота обходить ловушку.
Ограничение частоты действует по адресу.
Правило согласия читается из собственного содержимого блока, а не из отправленной формы — чтение из скрытого поля отдало бы эту настройку в руки посетителю.
Адреса хранятся вместе с остальными отправками форм, под ключом bulten:. Нет ни нашего списка, ни запроса третьей стороне.

Чтобы передать подтверждённый адрес тому, чем вы уже пользуетесь, подключитесь к действию:

add_action( 'mevvblocks_newsletter_subscribe', function ( $eposta, $ad, $blok_kimligi ) {
    // $eposta       : подтверждённый адрес
    // $ad           : имя или пустая строка, когда поле отключено
    // $blok_kimligi : из какого блока рассылки он пришёл
}, 10, 3 );

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

Динамический текст и произвольные поля

Блоки Заголовок, Текст, Кнопка и Изображение могут брать значение из записи, а не из того, что вы напечатали. Панель называется Динамика, а источники — фиксированный список: заголовок записи, отрывок, автор, дата, первая рубрика, метки, число комментариев, заголовок архива, поисковый запрос, название и слоган сайта, текущий год, цена WooCommerce, артикул и наличие — и произвольное поле по ключу.

При активном Advanced Custom Fields поле читается через get_field(), поэтому вы получаете отформатированное значение, а не сырое. Без ACF происходит откат к обычным метаполям записи, и ничто не ломается ни в том, ни в другом случае.
Ключи, начинающиеся с подчёркивания, отклоняются. Это внутренние поля WordPress; их печать раскрыла бы то, что страница показывать не собиралась.
Нет поля «выполнить это выражение». Оно отдало бы выполнение кода любому, кто может редактировать страницу.

Пока вы правите шаблон карточки цикла, контекста записи нет, поэтому динамическая привязка показывает своё статическое запасное значение вместо настоящего. Это шаблон, а не страница.

Сетка содержимого и конструктор цикла

Блок Сетка содержимого запрашивает записи, страницы или товары и раскладывает их. Постраничная навигация — это обычные ссылки, поэтому она работает и с отключённым JavaScript.

Сортировка задаётся фиксированным списком — дата, изменение, заголовок, порядок меню, случайно, — потому что это значение доходит до базы данных.
Заголовки карточек идут от h2 до h6. h1 не предлагается: сетка карточек на странице, где h1 уже есть, нарушила бы порядок заголовков.
По одной ссылке на карточку. Если ссылками сделать и изображение, и заголовок, и «читать далее», программа чтения с экрана объявит одну и ту же цель трижды.
Сетка кеширует найденные идентификаторы записей, но никогда отрисованный HTML, а кеш сбрасывается при сохранении любой записи — поэтому «я опубликовал запись, а её не видно» случиться не может.

Конструктор цикла позволяет нарисовать карточку самостоятельно, вместо встроенной. Вы создаёте шаблон типа Карточка цикла, собираете его из обычных блоков с динамическими привязками и выбираете его в настройках сетки.

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

Движок форм

Шестнадцать типов полей с проверкой на стороне сервера. Форма — та часть страницы, которая действительно что-то делает, поэтому она работает без JavaScript: обычная отправка POST получает ту же проверку и те же сообщения, что и отправка через скрипт.

Типы полей: Текст, Email, Телефон, Адрес (URL), Число, Дата, Время, Скрыто, Длинный текст, Выпадающий список, Список с множественным выбором, Одиночный выбор, Несколько флажков, Флажок, Текст согласия (KVKK) и Подзаголовок. В Pro добавляется поле для загрузки файла.
Куда попадают заявки: И в собственную таблицу, и на почту. Запись создаётся первой, письмо отправляется вторым, потому что доставка почты срывается гораздо чаще, чем запись в базу данных.
Как их читать: MevvBlocks → Отправки форм. В Pro там добавляется экспорт в CSV.
Уведомление по почте: Отправитель — ваш сайт, а не посетитель. Использование адреса посетителя как отправителя — самая частая причина, по которой письма форм не доходят: SPF и DMARC их отклоняют. Его адрес вместо этого попадает в Reply-To.

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

Почему подпись, а не nonce из WordPress? Nonce привязан к сессии и к двенадцатичасовому окну. На кешированном сайте один и тот же HTML отдаётся часами или днями, nonce внутри него давно истёк, и форма молча перестаёт работать. Это самый частый полевой отказ плагинов форм. Подпись здесь действует семь дней и не зависит от того, кто просматривает сайт.

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

Хранение заявок не привязано к лицензии. Если бы было привязано, день просроченного платежа стал бы днём, когда клиент начал терять данные.

Шаблоны темы

Семь типов шаблонов, создаваемых в том же редакторе WordPress, которым вы уже пользуетесь, — Шапка, Подвал, Отдельная запись, Архив, Результаты поиска, Не найдено (404) и Карточка цикла. Второй редактор был бы ещё одной вещью, которую пришлось бы держать в ногу с ядром WordPress.

Тип и условия находятся в обычном блоке боковой панели, а не в React-панели: классический блок сохраняется и при выключенном JavaScript и не ломается при изменении API редактора.

Условия: Весь сайт, главная страница, тип записи, категория или один конкретный материал. Оставьте пустым — будет весь сайт.
Когда подходит несколько: Побеждает самое узкое условие.
Некорректные условия: Отбрасываются при сохранении и хранятся пустыми, а не остаются недопустимым текстом, из-за которого шаблон молча никогда бы не появлялся.

Шаблоны шапки и подвала размещаются только на Astra и GeneratePress. Если для вашей темы рецепта нет, они не выводятся вовсе, и экран об этом сообщает — прикрепить шапку к теме, которую мы не умеем снимать, значит гарантированно получить две шапки. Шаблоны одиночной записи, архива, поиска и 404 работают на любой теме, потому что они заменяют цикл и оставляют собственные шапку и подвал темы на месте.

Шаблон «Карточка цикла» никогда никуда не помещает себя сам. Его выбирает блок сетки.

Библиотека паттернов и пресеты блоков

Семьдесят шесть готовых паттернов: шестьдесят четыре секции и двенадцать полных страниц. Они регистрируются как обычные паттерны WordPress, поэтому вы вставляете их привычным способом — кнопка +, вкладка Паттерны, затем категория MevvBlocks sections или MevvBlocks pages. Секции охватывают семейства «герой», «возможность», «отзыв», FAQ, «цены», «призыв к действию», «контакты», «о нас», полоса над подвалом и «статистика»; страницы добавляют три варианта главной, страницу FAQ, страницу кампании, страницу-историю и страницу благодарности.

Собственного модального окна для этого не писали. Инструмент вставки ядра и так бесплатно даёт предпросмотр, поиск, навигацию с клавиатуры и перевод, а вставляет он обычную блочную разметку — привязываться не к чему.

Девяти из них нужен WooCommerce: восемь секций товаров и категорий и одна посадочная страница магазина. Они лежат в отдельном файле и регистрируются только пока WooCommerce активен, поэтому сайту без магазина никогда не предлагается паттерн, который вставил бы блок, который тот не умеет отрисовать. Товары в них берутся из запроса — новые, рекомендуемые, со скидкой, самые продаваемые — а не из идентификатора категории, вписанного в паттерн, потому что тот же идентификатор в другом магазине попадёт в пустую или попросту не ту категорию.

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

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

На фронтенде паттерны вообще не регистрируются. Генерация их разметки при каждом просмотре страницы была измерена в 109 КБ и 3,59 мс — плата ни за что, ведь никто не вставляет паттерн во время чтения.

Всплывающие окна

Собираются в блочном редакторе, как и всё остальное; триггеры, условия и частота показа находятся в боковой панели того же экрана. Управляются в MevvBlocks → Всплывающие окна.

Триггеры: При загрузке страницы с задержкой, на проценте прокрутки, при намерении уйти, по клику, совпадающему с CSS-селектором, или через промежуток активного времени. Таймер активности останавливается, пока вкладка в фоне.
Условия: Весь сайт, главная страница, отдельные страницы, тип записи или категория; авторизованные, неавторизованные или все; и отдельно по устройствам.
Частота: Каждый раз, один раз за сессию или раз в N дней.
Внешний вид: Положение, ширина, показывать ли заголовок, закрывается ли окно по клику снаружи, и анимация открытия.

Счётчик «больше не показывать» хранится в браузере самого посетителя, а не на сервере. Считать его на сервере значило бы выпускать устойчивую идентичность для каждого посетителя только ради того, чтобы не показать ему окно дважды.

Устройство определяет браузер, а не разбор user agent. По user agent нельзя надёжно отличить планшет от телефона, а за полностраничным кешем всем отдавалось бы устройство первого посетителя. Если триггер не выбран, всплывающее окно откатывается к загрузке страницы; если не выбрано устройство — ко всем трём: окно, которое молча никогда не появляется, хуже того, которое появляется слишком часто.

Палитра сайта

Один экран для цветов и типографики, доступный и из меню MevvBlocks, и из раздела Внешний вид, потому что именно там его ищут. У каждой записи показано её собственное имя переменной, а блоки ссылаются на эти имена, а не на конкретные значения.

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

Удаления нет. Набор цвета или типографики можно оставить пустым, но его удаление оставило бы каждый ссылавшийся на него блок указывающим в никуда. Опустошение обратимо; удаление ссылки — нет.

Аудит доступности

MevvBlocks → Доступность сканирует ваши опубликованные страницы, записи и шаблоны и сообщает, что упустил каждый блок: изображение без альтернативного текста, пустой заголовок, кнопку без названия или без адреса, нарушенный порядок заголовков, слишком низкий контраст.

Тот же аудит доступен как панель в боковой колонке прямо во время редактирования — там исправить находку дешевле всего.

Это намеренно не наложенный виджет. Слои, которые прикручивают к странице «меню доступности», не исправляют ничего: у изображения без alt-текста его по-прежнему нет, а низкоконтрастный текст по-прежнему нечитаем. Нести заявление «этот сайт доступен», когда это неправда, — позиция хуже, чем не заявлять ничего: сайты с такими наложениями судились именно из-за этого. Этот инструмент измеряет и сообщает вам; исправлять — вам.

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

Скорость — кеширование элементов и изображения

Две отдельные вещи, обе в бесплатной редакции.

Кеширование элементов. Вывод блоков сохраняется, а не пересобирается при каждом запросе. Измерено: время отрисовки блока меньше на 33–72%. Используется постоянный объектный кеш (Redis, Memcached), когда он есть, и transients, когда его нет.

Блок, чей вывод меняется от посетителя, запроса или момента, не сохраняется никогда: формы, вход, регистрация, мини-корзина, сетка товаров, поиск, корзина, оформление заказа, моя учётная запись, шорткод. Шорткод в этом списке потому, что мы не знаем, что внутри него: однажды на действующем сайте мы заморозили токен WPForms, и с тех пор это правило соблюдается на уровне исходного кода.

Оптимизация изображений. Рядом с оригиналом записывается копия каждого загруженного изображения в WebP (по желанию — AVIF); оригинал не трогается. Измерено: на 39–78% меньше. Файл, который не уменьшился, не сохраняется — маленькие однотонные PNG обычно в WebP только растут.

Изображения отдаются внутри элемента <picture>: адрес каждого формата есть в HTML, а выбирает браузер. Решение на сервере по заголовку Accept намеренно не используется: когда один и тот же адрес меняется от посетителя к посетителю, любой кеш на пути может отдать не тот файл не тому человеку.

Если другой плагин действительно выполняет эту работу (LiteSpeed, ShortPixel, Imagify, Smush, EWWW, Optimole, Converter for Media), MevvBlocks сам отходит в сторону и объясняет почему. Вопрос не в том, «установлен ли он», а в том, «может ли он реально работать»: LiteSpeed с включённой оптимизацией изображений, но без облачного ключа не делает ничего.

Core Web Vitals — измерено на ваших посетителях

Core Web Vitals по определению — это полевые данные: они измеряются в браузерах реальных посетителей и сообщаются как 75-й процентиль за 28-дневное окно. Прогон Lighthouse — совсем другое: одна машина, одна сеть, один момент. Понимание, где что, и снимает путаницу «PageSpeed показывает 98, а Search Console — красное».

Экран Web Vitals показывает по три числа на класс устройств:

LCP: Сколько времени требуется, чтобы появилось основное содержимое. Хорошо — 2,5 секунды или меньше.
CLS: Насколько страница смещается, пока устанавливается. Хорошо — 0,1 или меньше.
INP: Сколько времени страница отвечает на касание или клик. Хорошо — 200 мс или меньше.

Измеряющий скрипт весит около килобайта и не загружает библиотек — работу делает собственный PerformanceObserver браузера. Выборка по умолчанию — 10% посещений, и решает браузер, а не сервер: если бы решал сервер, один и тот же URL давал бы два разных HTML-документа, а полностраничный кеш отдал бы всем тот, который увидел первым.

Ничего личного не собирается: ни IP, ни cookie, ни идентификаторов. Три значения, класс устройства и путь страницы, хранимые на вашем собственном сервере в виде счётчиков по корзинам. Никуда ничего не отправляется.

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

Трансформации и маски

Любой блок можно сместить, масштабировать, повернуть (по Z и в 3D по X/Y), наклонить и отразить — каждое с отдельными значениями для десктопа, планшета и мобильного. Отдельно задаются трансформация при наведении и длительность перехода.

Маской может быть круг, треугольник, шестиугольник, клякса, цветок, произвольная фигура или ваше собственное изображение — с управлением размером, положением и повтором.

Фигуры встроены в CSS, а не поставляются отдельными файлами SVG. Неверный путь к файлу заставляет маску молча исчезнуть, и 404 никто не видит; за CDN адрес папки плагина к тому же может измениться.

Свой код для всего сайта

HTML, CSS и JavaScript можно разместить в head, в начале body или в конце: теги подтверждения, счётчики, небольшие правки стилей. Настраиваются положение, приоритет и условие по сессии.

PHP он не выполняет. Запуск PHP внутри конструктора страниц превратил бы права дизайнера в право выполнять код на сервере.

Требуется право unfiltered_html: тот, кто не может вставить необработанный скрипт в запись, не может вставить его и на весь сайт. При установленном MevvLegal размещённые здесь отслеживающие скрипты тоже удерживаются до согласия на cookie.

Блоки WooCommerce

Двадцать три блока: название товара, изображения, цена, добавить в корзину, рейтинг, наличие, мета, краткое описание, описание, вкладки данных, дополнительная информация, похожие товары, апсейлы, кросс-продажи, корзина, оформление заказа, мой аккаунт, отслеживание заказа, сортировка и число результатов — плюс товары, категории товаров и мини-корзина.

Ни один из них не перерисовывает WooCommerce. Все они вызывают его собственные функции шаблонов и шорткоды. Ваша тема меняет эти шаблоны, а ваши плагины к ним подключаются — доставка, рассрочка, уведомления о наличии, таблицы размеров. Собственная разметка молча отбросила бы всё это.

Корзина, оформление заказа, моя учётная запись и отслеживание заказа зависят от посетителя: полностраничное кеширование для них выключено, и они никогда не кешируются как элементы. Если WooCommerce не активен, эти блоки не регистрируются ни на сервере, ни в редакторе.

Заметки в редакторе

К любому блоку можно прикрепить заметку: кто её написал, когда и решена ли она.

Заметки НИКОГДА не выводятся на странице. В этом файле нет ни одного фронтенд-хука, и это закреплено тестом. Заметки — это внутренний разговор; их появление у посетителя было бы хуже сломанного макета.

Заметка привязана к идентичности блока. При дублировании копия получает НОВУЮ идентичность, поэтому заметку она не наследует — а побочной выгодой получает собственную область CSS.

Заметки живут в данных самой записи: удалите запись — и заметки уйдут вместе с ней, не оставив осиротевших строк.

ИИ в редакторе — с вашим собственным ключом

Написать, переписать, сократить, сгенерировать alt-текст изображения и перевести. Поддерживаются Anthropic и OpenAI.

Вы вводите СВОЙ СОБСТВЕННЫЙ ключ API, и запрос уходит с вашего сайта НАПРЯМУЮ к провайдеру. Ваш текст к нам не попадает; квота и счёт остаются вашими. Собственный облачный сервис мы не строили: тогда ваш текст проходил бы через наши серверы и ответственность за данные стала бы нашей.

Ключ никогда не попадает в браузер — запрос выполняется с сервера. Его не возвращает ни одна точка API; даже форма настроек не выводит значение обратно.

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

Результат не записывается сразу в блок; он приходит как предложение, а применяете его вы. Это наша настоящая защита от того, что фраза, спрятанная в вашем содержимом, будет прочитана как инструкция: одобряет человек.

Чтение theme.json темы

Блочная тема уже объявляет свою палитру и типографику в theme.json. MevvBlocks может прочитать этот файл и использовать его, чтобы заполнить пустые ячейки собственной палитры сайта, поэтому цвета, которые вы выбираете в блоке, — это цвета, которые тема уже использует, а не второй, конкурирующий набор.

Мост односторонний и остаётся таким. Ничего никогда не записывается обратно в theme.json. Плагин, редактирующий собственный файл темы, оставляет вам файл, который обновление темы перезапишет, — и никакого способа понять, какой из двух был правильным. Он также заполняет только те ячейки, которые вы оставили пустыми: цвет, заданный вами вручную, никогда не заменяется.

Функция выключена, пока вы её не включите, потому что сайт, у которого уже есть палитра, не хочет, чтобы её незаметно переключили на палитру темы.

Мега-панель

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

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

Первый черновик страницы из одного предложения

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

Ключ раздела, который придумала модель, не существует в библиотеке, поэтому он отбрасывается — и экран сообщает вам, что он был отброшен, вместо того чтобы незаметно выдать более короткую страницу.
Страница всегда создаётся как черновик. Пути в коде, который бы её публиковал, не существует.
Используется тот же ключ, что вы ввели для ИИ-инструментов редактора: ваш собственный ключ Anthropic или OpenAI, хранящийся на вашем сайте, а запрос идёт напрямую с вашего сервера к провайдеру.

Free и Pro

Бесплатная редакция — это весь продукт: 107 из 110 блоков, восемь стилей блоков, шаблоны темы, сетка и конструктор цикла, движок форм с хранилищем отправок, форма рассылки, динамический текст, включая поля ACF, меню, поиск, всплывающие окна, библиотека паттернов, пресеты блоков, глобальная палитра, оптимизация изображений, кэширование блоков, произвольный код для всего сайта, редакторские заметки, экран Core Web Vitals и аудит доступности.

Pro добавляет возможности редактирования, а не вывод:

Контрольные точки — вкладки «компьютер / планшет / мобильный» с минимальной высотой, шириной содержимого, шириной и четырьмя значениями внутренних отступов для каждой контрольной точки.
Пользовательский CSS для каждого блока, где токен selector обозначает сам этот блок.
Дополнения форм — условные поля, автоматический ответ отправителю, вебхук и поле загрузки файла.
Экспорт в CSV заявок из форм.
Три блока — переключатель контента с его панелями, портфолио с фильтром по таксономии и встраивание Lottie. Их отрисовка тоже никогда не проверяет лицензию: страница, которая их уже несёт, продолжает их печатать.

Панели контрольных точек и пользовательского CSS сегодня появляются у основных блоков — Контейнер, Заголовок, Текст, Кнопка, Разделитель, Изображение, Отзыв, Иконка, Блок с иконкой, Список с иконками, Шорткод, Форма, Товары и Категории товаров. Некоторые настройки по контрольным точкам бесплатны везде, где они есть: число колонок сетки на планшете и мобильном, порог гамбургер-меню, положение блока изображения на мобильном и выбор устройства для закреплённого положения.

Когда лицензия истекает или отсутствует:

Ваш сайт выглядит ровно так же. Каждое сохранённое значение для планшета и мобильного продолжает выводиться, как и каждое собственное правило CSS для блока. Это не обещание, а архитектурное правило: ни один файл на пути отрисовки не спрашивает о лицензии, и тест проверяет это в каждом релизе.
Формы продолжают отправляться, сохранять данные и слать письма.
Существующие всплывающие окна продолжают показываться.
Вы теряете только панели Pro в редакторе — и ничего больше.

Если наши серверы недоступны, активная лицензия продолжает работать семь дней. Установка, которая ни разу не прошла успешную проверку, не получает отсрочки вовсе: блокировка нашего адреса — не способ получить Pro.

Когда что-то не работает

«Сессия формы истекла.»: Кешированная копия этой страницы старше семи дней, или на вашем сайте были заменены ключи безопасности. Очистите кеш страниц.
Форма не отправляет письма: Сначала посмотрите список заявок: запись создаётся раньше письма, поэтому если она там есть, форма сработала, а доставка — нет. Затем проверьте адрес получателя и почтовые настройки сайта.
В редакторе страница выглядит правильно, а на фронтенде — нет: Предпросмотр в редакторе по замыслу приблизителен; см. выше. Истина — это фронтенд. Если у блока есть значения для планшета или мобильного, редактор выводит уведомление об этом.
При попытке отредактировать блок он сообщает, что недействителен: Исторически так происходило с блоками, зарегистрированными на сервере, но отсутствующими в скрипте редактора: они выводились безупречно и подводили только при открытии на редактирование. Теперь это закрыто тестом; если вы всё же это видите, сообщите имя блока.
Обратный отсчёт показывает неверное время: Разметка несёт абсолютный момент цели, а не «осталось X секунд», поэтому кешированная страница не может её заморозить. Блок сверяется с часами сервера; если этот запрос заблокирован, он откатывается к часам самого посетителя, а не падает.
Шаблон шапки или подвала не показывается: Для вашей темы нет рецепта. Снять можно только Astra и GeneratePress; экран об этом предупреждает. Остальные типы шаблонов работают на любой теме.
Появились две шапки: Шапку формируют и MevvBlocks, и MevvBridge. MevvBlocks намеренно занимает место первым — оставьте шапку кому-то одному.
Контейнеры шире или уже заданного: Правило темы побеждает по специфичности. Особенно сильно оформляет своих потомков Astra. Для измеренных случаев это исправлено повышением специфичности, а не через !important; если встретите новый случай, скажите, какая тема.
Опубликованная запись не появляется в сетке: Должна появляться. Сетка кеширует только идентификаторы записей, и сохранение любой записи сбрасывает кеш. Если проблема сохраняется, проверьте, что тип записи и сортировка — те, которых вы ожидаете.

Обновления

Обновления приходят через сам WordPress. Плагин спрашивает наш магазин, существует ли более новая версия, и передаёт ответ собственному механизму обновлений WordPress, так что новый выпуск появляется на экране плагинов с обычной кнопкой Обновить, вместо того чтобы ждать, пока кто-то вручную скачает zip. В бесплатной редакции этот запрос несёт только имя пакета и установленную версию — ни адреса сайта, ни адреса электронной почты, ни лицензионного ключа, ни списка плагинов. Поскольку ничто в нём вас не идентифицирует, доверие держится на подписи: ответ подписан нашим ключом Ed25519, а ответ без подписи, с неверной подписью, воспроизведённый со старой отметкой времени или направляющий загрузку на любой хост, кроме нашего, отбрасывается, не касаясь сайта.

Ограничения

Предпросмотр в редакторе точен для вёрстки, но не для всего. Холст выводит тот же CSS, что и публичная часть сайта, поэтому отступы, фон, границы, типографика, трансформации и позиционирование совпадают. Отличается по-прежнему любое правило, написанное для разметки внутри блока: на холсте блок рисует собственные элементы редактирования.
Шаблоны шапки и подвала работают только на Astra и GeneratePress. Любая другая тема не получает ничего, зато получает предупреждение — молчание означало бы две шапки.
Карта — это вставка OpenStreetMap. Один маркер, без своего изображения маркера, без стилизации карты, без маршрутов. Ни ключа API, ни платёжного аккаунта, ни ключа, лежащего в исходном коде вашей страницы.
У портфолио нет модального окна и постраничной навигации. Карточки, фильтр и ссылка на архив — вот и весь блок.
У соцленты нет адаптера API. Это список ссылок, которые вы выбираете вручную; ничто не запрашивается ни из какой сети, и токен не хранится.
Анимаций, привязанных к прокрутке, нет, как и правила, которое мешало бы двум эффектам столкнуться. Появление, параллакс и эффекты при наведении существуют, и все они молчат при уменьшенном движении.
Круговая диаграмма не анимируется и не интерактивна: значения печатаются списком рядом с ней, а не показываются при наведении.
Никакого наложения для доступности. Только измерение и отчёт.
Никакой CAPTCHA.
Никакого живого поиска. Запрос на каждое нажатие клавиши — это зависимость и поверхность для ограничения частоты.
Обратный отсчёт использует часовой пояс сайта, а не посетителя. Кампания заканчивается во всём мире в один момент.
Меню предлагает два брейкпоинта, а не свободное значение в пикселях, и не имеет режима выпадающей или выезжающей панели — выдвижная панель с управлением фокусом это то, для чего есть блок всплывающего окна.
Карточки сетки не могут быть h1, а вложенность циклов останавливается на двух уровнях.
Набор иконок — это 94 контурные иконки, все нарисованные в одной сетке 24 пикселя. Иконочного шрифта нет, как и способа добавить свою иконку в выбор; собственный SVG заходит через блок Изображение или SVG-анимация.
Динамическое содержимое приходит из фиксированного списка источников. Поля «выполнить это выражение» нет: оно передало бы выполнение кода любому, кто может редактировать страницу.
Глобальные наборы цвета и типографики нельзя удалить, только опустошить.
Карточки товаров рисует WooCommerce, а не мы, поэтому ваша тема и любые сторонние хуки продолжают работать.
Интерфейс поставляется на одиннадцати языках. Турецкий, английский, испанский, немецкий, французский, португальский, итальянский, нидерландский, японский, русский и польский, плюс страновые варианты вроде es_MX и pt_PT. Любая другая локаль откатывается к английскому.
Окно Web Vitals сбрасывается каждые 28 дней, оно не скользит. Скользящему окну понадобились бы суточные корзины и в двадцать восемь раз больше места. Экран показывает, когда началось текущее окно.
Удаление плагина не убирает таблицу заявок и настройки. Содержимое ваших блоков в любом случае остаётся читаемым — это стандартная разметка в post_content.

Никакая сторонняя библиотека JavaScript или CSS не загружается нигде. Ни для слайдера, ни для аккордеона, ни для движения, ни для карты. Каждая из них стоила бы от сорока до ста килобайт на каждой странице, где используется.

Сто пикселей на десктопе, сорок на мобильном — в блочном редакторе.