Кастомизация аккордеона TX16N на Tilda

С помощью данной модификации вы сможете изменить внешний вид вашего блока-аккордеона TX16N

Пример использования данной модификации ↓

Инструкция по установке модификации

1. Создаёте блок TX16N и убираете отступ слева (настройки блока — отступ слева — без отступа) и убираете у него фон (цвет фона для всего блока должен быть пустым!).
2. В настройках блока во вкладке «стили карточки» выставляете параметры такие, как показано на данном скриншоте.
3. Загружаете вашу иконку (можно загрузить как на тильду, так и на любой сайт в интернете) — ссылку на эту иконку необходимо будет поставить в соответствующее поле в генераторе кода

Настройки блока TX16N:

id вашего блока tx16n:
Ширина блока tx16n:

Настройки иконки:

Ссылка на вашу иконку:
Ширина иконки (в px):
Высота иконки (в px):
Отступ иконки справа от края (в px):

Настройка обводки и фона:

Размер обводки (в px):
Цвет обводки:
Радиус скругления обводки (в px):
Фон карточек:

Настройка отступов:

Отступ заголовка слева от края (в px:
Отступ заголовка справа от края (в px):
Отступ текста в раскрытой карточке слева от края (в px):
Отступ текста в раскрытой карточке справа от края (в px):
Вертикальный отступ между карточками (в px):
<style> 
/*Кастомизация аккордеона TX16N на Tilda: https://vladislav-land.ru/tx16n*/
.t585__opened .t585__lines { -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -o-transform: rotate(-180deg); transform: rotate(-180deg); } .t585__lines svg { display: none; } .t585__lines::after { content: " "; width: 30px
; height: 30px
; position: absolute; left: 0; background-image: url(https://static.tildacdn.com/tild6632-6437-4733-a131-626536623537/photo.png); background-size: 100%; } .t585__icon { width: 30px; height: 30px; padding-right: 20px !important; } #rec489927283 .t585__circle { background-color: #323232 !important; } #rec489927283 .t585__header { padding-left:15px !important; padding-right:15px !important; } #rec489927283 .t585__content { padding-left:15px !important; padding-right:15px !important; } #rec489927283 .t585__accordion { border-width: 2px; border-radius: 15px; background-position: center center; border-color: #F9CD46 !important; border-style: solid; } #rec489927283 .t585__accordion { background-color: #323232 !important; } #rec489927283 .t-col_12 { margin-bottom:10px !important; } .t585__header { border-top:none !important; } .t585__border { opacity:0%; } </style>

К сожалению, видеоинструкция пока недоступна. Но я уже работаю над ней, поэтому она появится здесь в ближайшее время 😉
А если у вас что-то не работает и нужна помощь, пишите в мой чат, помогу

Видеоинструкция

можете поблагодарить автора

если у вас есть желание, вы можете пожертвовать любую сумму на развитие проекта

Нужна уникальная модификация?

Просто заполните форму и я свяжусь с вами

Там я делюсь полезной информацией и бесплатно учу дизайнеров продавать на высокие чеки

Подпишитесь на telegram-канал Vladislav Land, чтобы всегда быть в курсе всех обновлений

Бесплатно учу дизайнеров продавать на высокие чеки →
Made on
Tilda