Любые блоки в стандартный аккордеон TX16N2 на Tilda

Эта модификация расширяет стандартный аккордеон Tilda TX16N2 и позволяет вставлять внутрь секций любые блоки — стандартные, Zero Block и HTML.

Благодаря коду блок поддерживает корректное открытие и закрытие вкладок даже при сложной внутренней структуре.

⠀

Пример

Пример применения

⠀

Инструкция

❗️ ВАЖНО:

Чтобы код работал на вашем сайте проверьте, что у вас включен jQuery в настройках сайта.

Настройки сайта ⟶ Вкладка Вставка кода ⟶ Ставим галочку у «Подключить jQuery на страницах сайта»

⠀

1️⃣  ДОБАВЛЯЕМ АККОРДЕОН

• Добавляем стандартный блок Tilda   TX16N2   и настраиваем его на свой вкус, заполняем только заголовки, поля с описанием оставляем пустыми, в них мы будем вставлять   ID блоков  , которые будут в них отображаться.
• Добавляем всему блоку аккордеона TX16N2 класс   .uc-akkordeon

⠀

2️⃣ КОНТЕНТ ДЛЯ АККОРДЕОНА

Ниже добавляем блоки для вставки в аккордеон (можно добавить любые блоки: как zero, так и стандартные).

⠀

3️⃣ ВСТАВКА КОНТЕНТА В КАРТОЧКИ АККОРДЕОНА

Копируем ID каждого блока и вставляем в соответствующую ему карточку аккордеона, в описание. Пример вставки: #rec0000000000  

❗️ ВСТАВИТЬ В 1 КАРТОЧКУ НЕСКОЛЬКО БЛОКОВ:

Вставляем блоки, просто через запятую

Пример вставки:   #rec0000000000, #rec0000000000  

⠀

4️⃣ НИЖЕ ВСТАВЛЯЕМ КОД

⠀

Код для вставки

<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();

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: