URL скопирован в буфер обмена!

Как добавить изображение сбоку от квиза на Tilda?

С помощью этой модификации можно добавить собственное изображение слева или справа от квиза на десктопе. Дополнительно можно настроить скругление углов. Работает с блоками QZ101, QZ101A, QZ101B, QZ101C, QZ101D, QZ101E и QZ101F

Модификация работает с включенным Autoscale в блоках
Модификация работает только со стандартными блоками
Номер модификации в библиотеке TiCode

Генератор кода

Id блока
Ссылка на изображение
Расположение
Скругление углов
Войдите в аккаунт чтобы получить доступ к генератору кода
Этот генератор кода доступен только тем кто оплатил подписку
<!--TICODE--><!-- Библиотека модификаций для Тильда https://ticode.dev --> <!--TCD000--><style> @media (min-width: 940px) { #rec947486696 .t-container { position: relative; display: flex; flex-wrap: wrap; align-items: stretch; } #rec947486696 .t-container::before { content: ""; display: block; max-height: 1000px; background-image: url(); background-size: cover; background-position: center; background-repeat: no-repeat; border-radius: 20px; } #rec947486696 .t-container > * { width: 50%; box-sizing: border-box; padding: 0 !important; } #rec947486696 .t-col { margin-right: 0 !important; } } @media (min-width: 1160px) { #rec947486696 .t-container::before { width: 580px; margin-right: 20px; } #rec947486696 .t-col_6 { max-width: 580px; } #rec947486696 .t-col { margin-left: 20px; } } @media (min-width: 940px) and (max-width: 1159px) { #rec947486696 .t-container::before { width: 470px; margin-right: 10px; } #rec947486696 .t-col_6 { max-width: 470px; } #rec947486696 .t-col { margin-left: 10px; } } </style>
КОПИРОВАТЬ КОД
1. Создаем блок квиза на тильда, копируем id блока и вставляем в генератор. В настройках квиза выставляем ширину 6 колонок и смещаем влево или вправо, в зависимости от того где нужно выводить изображение. Модификация работает с блоками квизов QZ101, QZ101A, QZ101B, QZ101C, QZ101D, QZ101E и QZ101F.

2. Создаем блок GL01, загружаем нужную картинку, кликнем по ней правой кнопкой мыши и копируем ссылку. Вставим её в генератор в поле «Ссылка на изображение». Блок галереи скрываем кликнув на глаз (не удаляем);

3. Указываем дополнительные настройки в генераторе:
Расположение - выбираем где будет показывается изображение;
Радиус углов - указываем радиус скругления углов изображения. Если не нужно, оставляем 0;

4. Копируем код и вставляем в HTML блок T123

Примечание! изображение выводит только на экранах от 960+
Ответь на 5 вопросов, чтобы понять: ты выгораешь или уже сгорел?
Как ты обычно отвечаешь, когда клиент говорит: «А можно вот тут ещё чуть-чуть подвинуть?»
Что ты чувствуешь, когда заходишь в Zero Block?
Как проходят твои выходные?
Клиент скинул правки в Word, в теле письма и голосовухой. Как реагируешь?
Случай: ты доделал проект на 100%, доволен. Через два дня клиент хочет «переделать концепцию».
0
Энергия на фулл, мозг — в Figma!
Ты не просто держишься — ты в ресурсе! Компоненты складываются, брифы не бесят, и даже тильдовская сетка поддаётся без боя. Продолжай творить, вдохновлять и не забывай: усталость — не баг, а фича. Главное — вовремя обновлять свой креативный кэш.
Срочно! Уведомление: ВЫГОРАНИЕ.exe
Ну всё, хватит! Заказчики бесят, Zero Block вызывает флешбеки, и ты мотаешься между "Ок, сделаю" и "Я в отпуске, но с ноутом". Это не баг — это фича твоего организма, который просит отдохнуть. Открой путёвку вместо фигмы. Впереди — жизнь без правок!
Made on
Tilda