любые блоки в аккордеон и TX16N2 на tilda

[ студия веб-дизайна SHEINA ]
Время чтения: 2 мин.
Просмотров: 200
Tilda предлагает готовый блок с аккордеоном — TX16N2, но его структура ограничена: внутри можно разместить только текст и изображения, без возможности использовать полноценные блоки или Zero. Это создаёт сложности, если нужно встроить, например, галерею, форму, таблицу или любой сложный контент.

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

Как выглядит аккордеон TX16N2 с любыми блоками внутри

Создаём сайты на Тильде, которые работают на задачу. Мы проектируем сайты с нуля: от идеи и структуры до дизайна и запуска. В работе используем гибкость платформы Tilda — и усиливаем её кастомной версткой, если нужно.

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

Как вставить любые блоки в слайдер TX16N2 на Tilda: пошаговая инструкция

1. Добавляем стандартный блок Tilda TX16N2 и настраиваем его на свой вкус, заполняем только заголовки, поля с описанием оставляем пустыми, в них мы будем вставлять ID блоков, которые будут в них отображаться.
2. Добавляем к блоку TX16N2 класс .uc-akkordeon
3. Ниже добавляем блоки для вставки в аккордеон (можно добавить любые блоки, как zero, так и стандартные).
4. Далее копируем ID каждого блока.
5. Вставляем скопированные ID блоков в аккордеон.
Если нужно в карточке аккордеона отобразить несколько блоков, то вставляем их уникальные ID через запятую.
6. Добавляем код под блоками для аккордеона
<script>
    document.addEventListener("DOMContentLoaded", function () {
        const accordion = document.querySelector(".uc-akkordeon");
        if (!accordion) return;

        const wrappers = accordion.querySelectorAll(".t668__textwrapper");

        wrappers.forEach(wrapper => {
            const rawText = wrapper.textContent.trim();

            // Фильтруем ID, если они начинаются с #rec
            const ids = rawText.split(",").map(id => id.trim()).filter(id => id.startsWith("#rec"));

            if (ids.length > 0) {
                wrapper.innerHTML = ""; // Очищаем старый текст
                ids.forEach(id => {
                    const cleanId = id.replace("#", "");
                    const block = document.getElementById(cleanId);
                    if (block) {
                        wrapper.appendChild(block);
                    }
                });
            }
        });
    });
</script>

Нужна помощь с вставкой блоков в аккордеон Tilda TX16N2?

Если вам нужно вставить внутрь аккордеона Tilda полноценные блоки — Zero, формы, галереи, таблицы или кастомный контент — студия SHEINA может подключиться на любом этапе.

Подскажем, как внедрить нужные блоки, проверим адаптацию, поможем с установкой и аккуратно впишем решение в структуру сайта.
Дата публикации: 21.10.2025
Студия веб-дизайна SHEINA

 

Полезные статьи

Made on
Tilda