Как добавить на сайт блок HTML-код?

Блок доступен на всех страницах в шаблоне "Новый" на тарифном плане "Профессионал". Вы можете добавить несколько таких блоков.

1. На главной странице добавьте блок "HTML-код", нажав соответствующую кнопку.
2. Нажмите иконку "шестерёнка".
3. На вкладке вы увидите стандартный HTML-код, добавленный вместе с блоком в качестве примера. Вы можете удалить его и добавить свой.

Разрешенные теги:

<a>, <b>, <blockquote>, <br>, <caption>, <code>, <dd>, <del>, <details>, <div>, <dl>, <dt>, <em>, <figcaption>, <figure>, <hr>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <i>, <iframe>, <img>, <ins>, <li>, <ol>, <p>, <picture>, <pre>, <q>, <s>, <script>, <source>, <span>, <strong>, <style>, <sub>, <summary>, <sup>, <table>, <tbody>, <td>, <th>, <thead>, <tr>, <u>, <ul>

Разрешенные атрибуты:

alt, cite, class, colspan, data-*, height, href, id, media, open, rel, rowspan, sizes, src, srcset, style, target, title,type, width

Чтобы вам было проще, мы добавили классы, которые позволят легко сделать стили как у стандартных блоков (особенно, повторение поведения desktop ⟷ mobile) .

Рекомендованные классы:

Классы ограничения ширины основного контейнера с боковыми отступами:

u-container, u-container-content

Классы, принудительно убирающие отступы:

u-pd-no, u-pd-top-no, u-pd-bottom-no, u-pd-left-no, u-pd-right-no

Классы вертикальных отступов блоков соответствующие цифре в настройке редакторов:

u-pd-top-1, u-pd-bottom-1, u-pd-top-2, u-pd-bottom-2, u-pd-top-3, u-pd-bottom-3

Классы стандартных горизонтальных отступов:

u-pd-default, u-pd-top-default, u-pd-bottom-default, u-pd-left-default, u-pd-right-default

Классы выравнивания текста:

u-text-left, u-text-center, u-text-right

Класс адаптивной таблицы:
u-table-default

• Если вы хотите изменить уже имеющийся блок, рекомендуем копировать его содержимое в режиме просмотра, чтобы не перенести лишнее, не нужное для обычных посетителей сайта. Для всех более современных блоков (Карточки, Текст, Карусель, Слайдер, Колонки, Вопрос-Ответ, Таймлайн, Ссылки) актуальные ссылки на стили будут вставлены автоматически по имени класса nh-*, для прочих вам может понадобиться написать стили самостоятельно.
• Для создания собственных классов используйте уникальные префиксы, например u-, во избежание наложения сторонних стилей (например, для часто используемых имен классов вроде block/column/row и т.д.), чтобы внезапно не оказалось, что стили других блоков начали влиять на ваши.
• Ссылку на элемент страницы вы можете сделать при помощи атрибута id, например, создать элемент <p id=”u-contacts”></p> и поместить где-то ссылку на него <a href=”https://yourdomain.tld/#u-contacts”>ссылка</a> или добавив в URL #u-contacts
• Изображения/фоны svg можно вставить через Data URI

4. Важно! Особенности использования блока HTML:

• Допустимо использовать только безопасные теги. При сохранении блока конструктор автоматически будет пытаться исправить, например, незакрытые теги, чтобы вёрстка страницы не сломалась.
• В блок нет возможности добавить iframe/script, для этого вы по-прежнему можете использовать блок GTM.
• HTML - свободный блок. Техническая поддержка конструктора не консультирует вас по содержимому блока. Техническая поддержка не проверяет корректность информации данных, вставленных в блок, не оценивает полученный вами результат ни по каким критериям. Всё что вы добавляете и как - вы делаете исходя только из своих знаний, а также полностью на свой страх и риск.
• Если вы сомневаетесь в необходимости добавления блока для какого-либо функционала или корректности его содержимого, используйте предусмотренные конструктором готовые блоки и виджеты, чтобы не нарушить работу сайта.