﻿---
title: "Блок Custom HTML: вставка кода, панели HTML/CSS/JS и редактируемые слоты"
description: "Блок Custom HTML в WordPress: добавление через /html, панели HTML/CSS/JS (WP 7.0), capability unfiltered_html, редактируемые внутренние блоки и innerContent-вариации (WP 7.1)."
---

## Что такое блок Custom HTML

**Custom HTML** (`core/html`) — блок для вставки произвольного HTML-кода в контент: виджеты сторонних сервисов, embed-коды, трекеры, кастомная разметка, которую нельзя собрать стандартными блоками.

## Добавление блока

Два способа:

1. **Block Inserter** — кнопка **+** → поиск «Custom HTML».
2. **Слеш-команда** — в пустом абзаце введите `/html` и нажмите Enter.

## Редактирование

После добавления блока нажмите кнопку **Edit HTML** — откроется модальное окно:

- **Слева** — редактор кода, **справа** — живое превью результата.
- Кнопка **Enable/disable fullscreen** в правом верхнем углу модала разворачивает окно на весь экран.
- **Update** — сохранить код и закрыть модал.

**Тулбар блока:** инструменты перемещения (drag-and-drop за шесть точек или стрелки вверх/вниз), кнопка **Edit Code**, меню **More options** (копировать, дублировать, переименовать). Боковой панели настроек у блока нет.

## Панели HTML, CSS и JavaScript (WordPress 7.0+)

Начиная с WordPress 7.0, блок имеет **три отдельные панели редактирования**: HTML, CSS и JavaScript.

Доступ к панелям CSS и JavaScript ограничен capability **`unfiltered_html`**:

- **Есть `unfiltered_html`** (Administrator, Editor на одиночном сайте) — все три панели доступны, код сохраняется как есть.
- **Нет `unfiltered_html`** (Contributor и ниже) — панели CSS/JS не показываются, а при сохранении записи контент блока прогоняется через [`wp_kses()`](https://developer.wordpress.org/reference/functions/wp_kses/): запрещённые теги вроде `<script>` и `<iframe>` вырезаются.

> **Важно для multisite:** на мультисайте `unfiltered_html` по умолчанию есть только у Super Admin — даже администраторы отдельных сайтов сети получат санитизацию через `wp_kses()`.

## Редактируемые блоки внутри Custom HTML (WordPress 7.1)

> ⚠️ Функция WordPress 7.1 — на момент записи релиз в разработке ([PR #79115](https://github.com/WordPress/gutenberg/pull/79115)).

В 7.1 блок научился **чередовать статичный HTML с обычными редактируемыми блоками**:

```html
<h2>Static heading</h2>
<!-- wp:paragraph -->
<p>Editable paragraph</p>
<!-- /wp:paragraph -->
<footer>Static footer</footer>
```

Как это работает в редакторе:

- Статичная разметка рендерится **инертной** — её нельзя редактировать визуально.
- Внутренние блоки редактируются **на месте**, но **залочены**: их нельзя перемещать, удалять или добавлять им соседей. Окружающая структура остаётся нетронутой.
- Полная разметка доступна в модале **Edit HTML**.
- Сериализация работает в обе стороны без изменений (round-trip) — существующий контент не затрагивается.

**Зачем это AI-инструментам:** block markup становится дружелюбной мишенью для генерации. Модель может выдать один Custom HTML блок, смешивающий произвольную разметку с редактируемыми слотами — без кастомного блока и без build step — и результат сразу безопасно редактируется пользователем.

## Вариации с `innerContent`: «higher level blocks» (WordPress 7.1)

> ⚠️ Функция WordPress 7.1 — на момент записи релиз в разработке ([PR #79659](https://github.com/WordPress/gutenberg/pull/79659)).

Block variations получили поле **`innerContent`**: массив статичных HTML-фрагментов, где каждый `null` отмечает позицию соответствующего элемента `innerBlocks`. Это позволяет отгружать фиксированную разметку с редактируемыми слотами как отдельный пункт инсертера — без регистрации кастомного блока:

```js
wp.blocks.registerBlockVariation( 'core/html', {
	name: 'testimonial-card',
	title: 'Testimonial Card',
	icon: 'format-quote',
	innerContent: [ '<div class="testimonial">', null, '</div>' ],
	innerBlocks: [
		[ 'core/paragraph', { content: 'An inspiring quote.' } ],
	],
} );
```

Вставка такой вариации создаёт Custom HTML блок с предустановленной структурой и редактируемым абзацем внутри.

**Отличие от паттерна:** в паттерне пользователь может перестраивать всё — двигать, удалять, добавлять блоки (если не настроен [Block Locking](https://wpcraft.ru/kb/stacks/wordpress/themes/patterns/locking.md)). В `innerContent`-вариации редактируются **только обозначенные слоты**, структура зафиксирована.

**Ограничение:** `innerContent` применяется только к вариациям `core/html` — для остальных блоков поле игнорируется.

## Когда что использовать

| Задача | Инструмент |
|--------|-----------|
| Вставить виджет, embed, трекер, произвольную разметку | Блок Custom HTML |
| Фиксированная разметка + редактируемые слоты, без кастомного блока (WP 7.1+) | `innerContent`-вариация `core/html` |
| Переиспользуемая композиция, которую пользователь может перестраивать | [Блочный паттерн](https://wpcraft.ru/kb/stacks/wordpress/themes/patterns.md) |
| Композиция с контролем правок (запрет перемещения/удаления) | Паттерн + [Block Locking](https://wpcraft.ru/kb/stacks/wordpress/themes/patterns/locking.md) |
| Свои атрибуты, инспектор, динамический рендеринг | [Блок только на PHP](https://wpcraft.ru/kb/stacks/wordpress/block-editor/php-only-block-registration.md) или клиентский блок |

## Связанные страницы

- [Блочный редактор WordPress: добавление контента блоками](https://wpcraft.ru/kb/stacks/wordpress/block-editor/editor-blocks.md)
- [Icons API: SVG-иконки в WordPress 7.0 и 7.1](https://wpcraft.ru/kb/stacks/wordpress/block-editor/icons-api.md)
- [Паттерны (Block Patterns)](https://wpcraft.ru/kb/stacks/wordpress/themes/patterns.md)
- [Block Locking и паттерны](https://wpcraft.ru/kb/stacks/wordpress/themes/patterns/locking.md)
- [PHP-only block registration: блоки без JavaScript](https://wpcraft.ru/kb/stacks/wordpress/block-editor/php-only-block-registration.md)
- [Кастомный CSS в WordPress](https://wpcraft.ru/kb/stacks/wordpress/faq/custom-css.md)

## Материалы и источники

- [Editable blocks inside the Custom HTML block — Make WordPress Core (dev-note 7.1)](https://make.wordpress.org/core/2026/07/23/editable-blocks-inside-the-custom-html-block/)
- [Custom HTML — WordPress.org Documentation](https://wordpress.org/documentation/article/custom-html/)
- [Gutenberg PR #79115: interleaving static HTML with editable blocks](https://github.com/WordPress/gutenberg/pull/79115)
- [Gutenberg PR #79659: innerContent field for block variations](https://github.com/WordPress/gutenberg/pull/79659)