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

01О теге

[PARSEHTML] вставляет в сообщение блок с произвольным HTML. Работают разметка, стили, скрипты, шрифты с CDN, внешние библиотеки.

Блок рендерится в изолированном sandbox iframe. Ваш код не влияет на форум, форум не влияет на ваш код. Из этой изоляции вытекают ограничения, описанные ниже.

Применяется в темах состава модерации и любых других.

02Кто может использовать

Доступ выдан автоматически следующим покраскам:

Куратор Дискорд / Куратор ВКонтакте
Заместитель Главного Модератора
Главный Модератор
Помощник Руководителя модерации ВК
Руководитель Модерации ВК

Остальным тег недоступен. Если покраска подходит, но кнопки в редакторе нет, напишите Разработчику Форума.

Сообщения профиля. Тег запрещён в комментариях на стене профиля у всех без исключения.

03Правила использования

Правила взяты из общего регламента форума. Их нарушение даёт администрации право удалить ваш блок или забрать доступ к тегу.

3.1

Доступ есть только у перечисленных выше покрасок. Если ваша покраска в списке, но кнопки нет, обращайтесь к Разработчику Форума.

3.2

Запрещено встраивать вредоносный код. Любые попытки украсть данные, перехватить ввод, обмануть читающего, фишинг.

3.3

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

3.4

Запрещены конструкции, ломающие вёрстку: выход за пределы контейнера темы, перекрытие интерфейса, бесконтрольное использование position: fixed или position: absolute.

3.5

Запрещены автоматические редиректы, popup-окна, всплывающие модальные блоки, перехват клика по странице и любые формы навязчивого взаимодействия с читающим.

3.6

Запрещены скрытые элементы и «пасхалки» оскорбительного содержания, включая провокационный текст в HTML-комментариях, скрытых блоках и атрибутах.

3.7

Запрещены RGB-эффекты, мигающие градиенты, анимации смены цвета по радуге и иная кислотная палитра, выламывающая код из общего тона форума.

3.8

Оформление должно соответствовать общему стилю форума. Основу палитры составляют нейтральные тёмные оттенки, акцентный цвет wine (бордовый, винный, тёмно-красный).

3.9

Рекомендуемые оттенки собраны в разделе «Палитра форума». Используйте их при оформлении.

3.10

При нарушении любого пункта администрация вправе удалить код или ограничить доступ к parsehtml.

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

04Как работает

Содержимое тега рендерится в отдельном фрейме со своим документом, стилями и скриптами. Высота подстраивается под контент автоматически. Обёртки <html>, <head>, <body> писать не нужно, сразу <style> и контент.

Минимальный рабочий шаблон

[PARSEHTML]
<style>
.my-card {
    background: #1a1a1a;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 10px;
    padding: 20px;
    color: #fff;
    font-family: -apple-system, sans-serif;
}
.my-card h2 { margin: 0 0 8px; font-size: 18px; }
.my-card p { margin: 0; color: rgba(255,255,255,0.65); }
</style>

<div class="my-card">
    <h2>Заголовок</h2>
    <p>Текст карточки.</p>
</div>
[/PARSEHTML]

05Что доступно

Inline-стили и теги <style>

Полный CSS3, включая Grid, Flexbox, animations, transitions, custom properties.

Inline-скрипты <script>

Любой JavaScript, который запускается внутри блока: DOM-манипуляции, Shadow DOM, ResizeObserver.

Внешние библиотеки с CDN

jQuery, GSAP, Three.js, Vue, React и любые другие через <script src="https://...">.

Кастомные шрифты

Google Fonts, Adobe Fonts, любые сервисы по HTTPS подключаются через <link rel="stylesheet">.

Изображения с любых сайтов

HTTPS-картинки с imgur, форума, любого хостинга. Видео и аудио теги тоже работают.

Относительные ссылки на форум

/data/avatars/m/0/45.jpg резолвится к домену форума. Удобно для подгрузки своих аватарок и приложенных файлов.

06Что заблокировано

При попытке использовать заблокированные функции скрипт выполнится, но действия не произойдёт. В консоли (F12) появится предупреждение.

alert, prompt, confirm

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

fetch, XMLHttpRequest

Сетевые запросы на любые URL заблокированы. Нельзя ни получить данные с API, ни отправить их на внешний сервер.

parent, top, window.parent

Обращение к родительской странице форума недоступно. Cookie форума и его DOM полностью изолированы.

Отправка форм на внешние URL

Action на внешний домен не сработает. Если внутри блока нужна форма для собственной логики, обрабатывайте её JS-ом локально.

Любые HTTP-ресурсы (http://)

Только HTTPS. Картинка с http://... не загрузится. Это требование политики безопасности (CSP).

Вложенные <iframe>

Внутри блока нельзя создать ещё один iframe с внешним сайтом. Видео YouTube вставляйте обычным BB-кодом, а не через PARSEHTML.

07Лимиты

Параметр	Значение
Блоков PARSEHTML в одном сообщении	не больше 5
Размер содержимого одного блока	до 200 KB
Использование в комментариях профиля	запрещено
Время реакции на изменение размера	около 100 мс после загрузки

Все блоки после пятого заменяются на текстовое уведомление о превышении лимита.

08Частые ошибки

Блок растягивается на весь экран

body { min-height: 100vh } и любые vh на корневом контейнере создают цикл: vh ссылается на высоту самого фрейма, ResizeObserver увеличивает её, цикл повторяется.

Решение: уберите 100vh и display: flex; align-items: center на корне. Используйте обычный padding.

alert() не показывает окно

Браузерные модальные окна заблокированы. В DevTools (F12) → Console будет сообщение с переданным аргументом.

Решение: используйте свой div с position: fixed и CSS-анимацией вместо alert.

Цвета темы форума не подтягиваются

CSS-переменные var(--spc-*) внутри блока недоступны. Пишите конкретные значения из раздела «Палитра форума».

Шрифт не подгрузился

Подключение только по HTTPS и только внутри блока. Внешние стили форума не наследуются.

JavaScript из CDN не запустился

Refused to load script from 'http://...': переключите URL на https://.

Refused to connect to ...: скрипт делает сетевой запрос, заблокировано CSP. Библиотека загрузится, но методы вроде $.ajax() работать не будут.

09Палитра форума

Это рекомендованные оттенки из правил форума. Все блоки [PARSEHTML] должны держаться в этой палитре, чтобы вписываться в общую тему. Кислотные и радужные цвета запрещены (см. п. 3.7).

Фоны и поверхности

#121212 #1a1a1a #1e1e1e #242424

Линии и рамки

#232323 #2e2e2e #3a3a3a

Текст

#e8e8e8основной #b8b8b8 #8a8a8a #6b6b6bвторостепенный

Акцентированные оттенки (винный)

#b2344dосновной #d9204fhover rgba(178,52,77,0.12)заливка

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

10Лучшие практики

Самодостаточный код

Все стили, скрипты, шрифты внутри блока. CSS-классы форума внутри не работают.

Адаптивность

Используйте @media (max-width: 600px) или Grid с minmax(280px, 1fr). Большая часть форума читает с телефона.

Размер картинок

Оптимизируйте до 200-500 KB через TinyPNG или Squoosh. Inline-base64 раздувает пост, лучше URL.

Тестирование

Опубликуйте, откройте на телефоне, проверьте читаемость. DevTools → Console не должна показывать красных ошибок.

Не ломайте навигацию

Не используйте position: fixed с большим z-index, который перекроет шапку форума. Это нарушение п. 3.4.

11Промт для нейросети

Скопируйте промт целиком, в конец добавьте описание блока. Промт учитывает все ограничения и палитру форума.

Ты помогаешь создать HTML-блок для форума Rodina Guard (XenForo).
Блок будет вставлен в [PARSEHTML]...[/PARSEHTML] тег
и отрендерится в изолированном sandbox iframe.

Ограничения, соблюдай их строго:
1. Не используй min-height: 100vh, height: 100vh и любые vh
   на корневых контейнерах. Это ломает авто-размер блока.
2. Не используй alert(), prompt(), confirm(), они заблокированы.
3. Не используй fetch(), XMLHttpRequest, EventSource, заблокированы.
4. Не обращайся к parent, top, window.parent, всё изолировано.
5. Все внешние ресурсы только через https://, никакого http://.
6. CSS-переменные форума (var(--spc-*)) недоступны, пиши
   конкретные цвета.
7. Не нужны обёртки <!DOCTYPE>, <html>, <head>, <body>,
   сразу <style> и контент.
8. Никаких RGB-эффектов, мигающих градиентов, радуги, кислоты.
   Стиль строго тёмный с винным акцентом.
9. Не выходи за пределы своего блока. Никакого position: fixed
   на body, никаких перекрытий шапки или соседних сообщений.

Что доступно:
- Inline CSS и блоки <style>
- Inline <script> с любым JS внутри блока
  (Shadow DOM, ResizeObserver, requestAnimationFrame, и т.д.)
- Внешние https-библиотеки и шрифты с CDN
  (jQuery, GSAP, Three.js, Google Fonts)
- Изображения, видео, аудио с любых https-источников
- Все HTML5-теги, emoji, CSS3 включая Grid, Flexbox, animations,
  custom properties, clamp, calc

Палитра форума, используй только эти оттенки:

Фоны и поверхности: #121212, #1a1a1a, #1e1e1e, #242424
Линии и рамки: #232323, #2e2e2e, #3a3a3a
Текст основной: #e8e8e8
Текст серый: #b8b8b8, #8a8a8a, #6b6b6b
Акцент винный основной: #b2344d
Акцент винный hover: #d9204f
Винная заливка: rgba(178,52,77,0.12)

Правила работы с палитрой:
- Фон всего блока бери из первой группы.
- Рамки и разделители из второй группы.
- Заголовки на #e8e8e8, основной текст на #b8b8b8,
  подписи и второстепенное на #8a8a8a или #6b6b6b.
- Винный точечно: кнопка действия, активное состояние,
  заголовок раздела, тонкая полоска. Не заливай винным
  большие площади.

Шрифты системные: -apple-system, BlinkMacSystemFont,
"Segoe UI", Roboto, sans-serif. Можно подключать Inter
или Sofia Sans с Google Fonts.

Радиус блоков 8-12 px. Отступы воздушные, без перегруза.
Адаптивность обязательна. Используй @media (max-width: 600px)
или Grid с minmax() чтобы блок нормально смотрелся на телефоне.

Что нужно создать: [опиши свой блок]

Примеры описания: «карточка наказания: дата, нарушение, мера, исполнитель, скриншот», «регламент повышения: 5 уровней с требованиями по дням и сообщениям». Чем подробнее описание, тем точнее результат.

12Эталонный пример

Тема, в которой [PARSEHTML] использован по всем правилам: самодостаточный код, адаптивная вёрстка, без запрещённых API, в палитре форума.

#Bumble Bee | Состав модерации

Чтобы посмотреть исходник: DevTools (F12) → Elements → iframe.mph-frame → атрибут srcdoc. Декодируйте HTML-сущности любым онлайн-декодером.

Перейти к теме

13Безопасность

Защита читателей

Без изоляции автор мог бы вытянуть cookie сессии, подменить кнопку «Войти» на фишинговую, перенаправить на сторонний сайт. Sandbox iframe это исключает. Любые такие попытки также прямо запрещены п. 3.2 и п. 3.5.

Защита автора

Ваш CSS не сломает соседние сообщения. Ваш JavaScript не повлияет на другие элементы форума.

14FAQ

Можно ли вставить React или Vue приложение?

Да, подключите библиотеку через <script src="https://cdn.jsdelivr.net/...">. Учитывайте размер фреймворка, это влияет на время появления блока.

Сохраняется ли состояние блока между обновлениями страницы?

Да, если используете localStorage или sessionStorage внутри блока. У sandbox свой storage, отдельный от форума.

Могут ли два блока PARSEHTML в одном посте обмениваться данными?

Нет. Каждый блок изолирован. Если нужна общая логика, объединяйте в один блок.

Можно ли посмотреть исходный код чужого блока?

DevTools (F12) → Elements → iframe.mph-frame → атрибут srcdoc → онлайн-декодер HTML-сущностей.

Что насчёт Canvas и WebGL?

Работают. Помните о нагрузке на мобильные устройства.

Можно ли использовать иконки (Font Awesome, Heroicons)?

Да, через CDN-библиотеку или inline SVG. SVG предпочтительнее: ничего грузить не нужно, стилизуется через CSS.

Блок печатается криво при Ctrl+P

Печать iframe-блоков ограничена браузерами. Внутри блока есть @media print, но идеальной печати большого интерактива не достичь. Если печать важна, продублируйте контент текстом ниже.

Можно ли использовать яркие цвета (зелёный, синий, фиолетовый)?

Нет. По п. 3.7 и 3.8 цвета только из палитры форума. Винного акцента достаточно для выразительности, лишние цвета выбиваются из стиля форума.

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

Администрация удалит блок из сообщения. При повторных или грубых нарушениях доступ к parsehtml заберут (п. 3.10).

Поиск

Добро пожаловать!