UPD: Тильда выпустила обновление (t.me/dsgnwarm/121), в котором есть функционал объединения полей в одну строку, что в целом заменяем использование кодов из этого видео
Перенести галочку не получилось, но я вышла из положения другим способом, у меня только одно поле ввода и я просто сделала вертикальную форму, но воспользовалась "переносом кнопки" и скруглением углов чекбокса. Спасибо большое!
Очень круто получилось по дизайну, но по факту по кнопке заявка не отправляется. То есть кнопка реагирует на незаполненные поля, но когда всё заполнено, то заявка не улетает. Сталкивались ли с этим? Вдруг известно, как можно исправить?
Здравствуйте! Спасибо, все получилось, правда не весь код использовала )))) А подскажите такой момент. У меня это форма для подписки на рассылку. Сейчас у меня заявки падают в тильду. А каким образом мне сделать так, чтобы попадали именно в рассыльщик? По умолчанию мы настраиваем в форме связь с адресной книгой рассыльщика. А в данном случае как это будет? У нас же кнопка сделана отдельно от формы и в ней только ссылка на форму
В адаптации в мобильной версии, всеравно пришлось делать вертикальную. И тут некрасиво с отспупами получилось. А так спасибо, здорово и понятно объясняете.
да, когда записывал ролик, это было экспресс-видео, где я сразу не учел, что еще адаптив будет, но вот код: @media screen and (min-width: 959px) { .uc-test .tn-form_horiz .t-form__inputsbox { display: flex !important; flex-wrap: wrap !important; } .uc-test .t-checkbox__control { width: max-content !important; } } который исправляет эту недоработку, us-test класс самого зеро-блока. Использовал его в проекте dreamston.ru/preschool (форма почти в самом низу), для десктопа и мобилки используется один и тот же блок
@@sergeyrevin Сергей, спасибо большое! В Итоге все равно не получалось, пригласил коллегу, который кодит сайты чтобы помог, он убрал какую то строчку и все заработало, может кто то тоже столкнется с моей проблемой: @media screen and (min-width: 959px) { .tn-form_horiz .t-form__inputsbox { display: flex !important; flex-wrap: wrap !important; } .t-checkbox__control { width: max-content !important; } }
Спасибо большое! Сейчас допишу. Если Вас не затруднит, ответьте, пожалуйста ещё на один вопрос: подскажите, пожалуйста, что делать если таких формы две одинаковые. Одна - на странице, одна в футере. Block ID прописал верный. BLOCK CSS CLASS NAME прописал, в одном блоке указал uc-test, в другом uc-page Не работает. Одинаковые тоже пробовал. при заполнении одной из форм и отправке данных внизу страницы показывается сообщение об ошибке - не все данные заполнены. Листаю до футера - там светятся красным окно ввода данных. И наоборот - заполняю низ, то ошибка вверху. Что можно с этим сделать?
@@michaelbrownru отправка разных форм настраивается в коде отправки события нажатия (это код по первой ссылке). Для разных форм нужно указать разные значения ссылки #sendmyform. Т.е. для одной формы, и на кнопке и в коде прописать, например, #sendmyform1, а для другой формы и в коде и в ссылке на кнопке #sendmyform2
Если под «квадратиком» имеется ввиду чекбокс с галочкой, то нужно зайти в настройки формы (на правой панели настроек: Input fields), и добавить добавить поле Checkbox
Да, можно, если указать в коде класс самого зеро-блока @media screen and (min-width: 959px) { .uc-test .tn-form_horiz .t-form__inputsbox { display: flex !important; flex-wrap: wrap !important; } .uc-test .t-checkbox__control { width: max-content !important; } } uc-text это класс зеро-блока в котором находится форма. В этом же коде действует ограничение работы кода для резрешения экрана от 959px код будет работать, меньше - не будет, это сделано для того, чтобы на адаптиве эту же форму можно было бы без проблем переключить в вертикальный режим
@@sergeyrevin Спасибо огромное, все получилось 🔥 Вроде этот же код есть ниже в комментариях, но кто тоже тупит слово uc-test нужно прописать в настройках ⚙ зеро-блока, где "Добавить CSS Class Name". И код применится непосредственно к одному блоку, а не ко всем формам на странице 😅
@@nneytiry, @sergeyrevin подскажите, пожалуйста, что делать если таких формы две одинаковые. Одна - на странице, одна в футере. Block ID прописал верный. BLOCK CSS CLASS NAME прописал, в одном блоке указал uc-test, в другом uc-page Не работает. Одинаковые тоже пробовал. прои заполнении 1 и отправке данных внизу страницы показывается сообщение об ошибке - не все данные заполнены. Листаю до футера - там светятся красным окно ввода данных.
То же самое( Вроде всё по видео делал, но не получилось. Я нашёл другой выход - сделал всё, как автор, убрал кнопку из формы, только сделал её вертикальной и добавил чекбокс, но без текста в его поле. И потом просто накинул текст с соглашением о политики конфиденциальности рядом с чекбоксом. Вуаля) Но за код спасибо!
![[Sub Thai] APT. - ROSÉ & Bruno Mars](http://i.ytimg.com/vi/bYjhzP8x_uc/mqdefault.jpg)
UPD: Тильда выпустила обновление (t.me/dsgnwarm/121), в котором есть функционал объединения полей в одну строку, что в целом заменяем использование кодов из этого видео
Перенести галочку не получилось, но я вышла из положения другим способом, у меня только одно поле ввода и я просто сделала вертикальную форму, но воспользовалась "переносом кнопки" и скруглением углов чекбокса. Спасибо большое!
Большое спасибо!
Спасибо, очень помогли!
Огонь! Очень полезно
Супер. Желаю роста аудитории
Не, ну это топ!
Ты знал что он такой кодер?
Очень круто получилось по дизайну, но по факту по кнопке заявка не отправляется. То есть кнопка реагирует на незаполненные поля, но когда всё заполнено, то заявка не улетает. Сталкивались ли с этим? Вдруг известно, как можно исправить?
@@OlgaLutoshkina напишите мне в телеграмм, попробуем разобраться
Здравствуйте! Спасибо, все получилось, правда не весь код использовала )))) А подскажите такой момент. У меня это форма для подписки на рассылку. Сейчас у меня заявки падают в тильду. А каким образом мне сделать так, чтобы попадали именно в рассыльщик? По умолчанию мы настраиваем в форме связь с адресной книгой рассыльщика. А в данном случае как это будет? У нас же кнопка сделана отдельно от формы и в ней только ссылка на форму
Отдельная кнопка полностью эмулирует работу "настоящей" кнопки из формы и никак не влияет на отправку, весь функционал формы сохраняется полностью
В адаптации в мобильной версии, всеравно пришлось делать вертикальную. И тут некрасиво с отспупами получилось. А так спасибо, здорово и понятно объясняете.
да, когда записывал ролик, это было экспресс-видео, где я сразу не учел, что еще адаптив будет, но вот код:
@media screen and (min-width: 959px) {
.uc-test .tn-form_horiz .t-form__inputsbox {
display: flex !important;
flex-wrap: wrap !important;
}
.uc-test .t-checkbox__control {
width: max-content !important;
}
}
который исправляет эту недоработку, us-test класс самого зеро-блока.
Использовал его в проекте dreamston.ru/preschool (форма почти в самом низу), для десктопа и мобилки используется один и тот же блок
@@sergeyrevin Ваш проект очень красивый. Спасибо, Сергей) Подписалась
@@sergeyrevinСергей, а куда это вставлять 😢
@@baltda в блок t123. Если следовать по таймлайну из видео - это код №2 (полностью использовать нужно код из этого комментария ВМЕСТО кода №2)
@@sergeyrevin Сергей, спасибо большое! В Итоге все равно не получалось, пригласил коллегу, который кодит сайты чтобы помог, он убрал какую то строчку и все заработало, может кто то тоже столкнется с моей проблемой:
@media screen and (min-width: 959px) {
.tn-form_horiz .t-form__inputsbox {
display: flex !important;
flex-wrap: wrap !important;
}
.t-checkbox__control {
width: max-content !important;
}
}
а где для начала взять эту форму с галочкой ?
Сергей, подскажите, пожалуйста, а есть ли возможность уменьшить размер чекбокса? Области где ставится галочка?
да, в свойстве .t-checkbox__indicator дописать параметры height и width
Спасибо большое! Сейчас допишу.
Если Вас не затруднит, ответьте, пожалуйста ещё на один вопрос: подскажите, пожалуйста, что делать если таких формы две одинаковые. Одна - на странице, одна в футере. Block ID прописал верный. BLOCK CSS CLASS NAME прописал, в одном блоке указал uc-test, в другом uc-page Не работает. Одинаковые тоже пробовал. при заполнении одной из форм и отправке данных внизу страницы показывается сообщение об ошибке - не все данные заполнены. Листаю до футера - там светятся красным окно ввода данных. И наоборот - заполняю низ, то ошибка вверху. Что можно с этим сделать?
@@michaelbrownru отправка разных форм настраивается в коде отправки события нажатия (это код по первой ссылке). Для разных форм нужно указать разные значения ссылки #sendmyform. Т.е. для одной формы, и на кнопке и в коде прописать, например, #sendmyform1, а для другой формы и в коде и в ссылке на кнопке #sendmyform2
@@sergeyrevin благодарю вас! Сегодня опробую!
При вставке формы в зеро блоке нет квадратика с текстом. Как его добавить не подскажите?
Если под «квадратиком» имеется ввиду чекбокс с галочкой, то нужно зайти в настройки формы (на правой панели настроек: Input fields), и добавить добавить поле Checkbox
p.s. двойной клик на форму и выбираем Checkbox :)
Все получилось, но только коды применяются ко всем формам на странице😅 Можно как-то прописать ограничение только к конкретной форме?)
Да, можно, если указать в коде класс самого зеро-блока
@media screen and (min-width: 959px) {
.uc-test .tn-form_horiz .t-form__inputsbox {
display: flex !important;
flex-wrap: wrap !important;
}
.uc-test .t-checkbox__control {
width: max-content !important;
}
}
uc-text это класс зеро-блока в котором находится форма. В этом же коде действует ограничение работы кода для резрешения экрана от 959px код будет работать, меньше - не будет, это сделано для того, чтобы на адаптиве эту же форму можно было бы без проблем переключить в вертикальный режим
@@sergeyrevin Спасибо огромное, все получилось 🔥
Вроде этот же код есть ниже в комментариях, но кто тоже тупит слово uc-test нужно прописать в настройках ⚙ зеро-блока, где "Добавить CSS Class Name". И код применится непосредственно к одному блоку, а не ко всем формам на странице 😅
@@nneytiry, @sergeyrevin подскажите, пожалуйста, что делать если таких формы две одинаковые. Одна - на странице, одна в футере. Block ID прописал верный. BLOCK CSS CLASS NAME прописал, в одном блоке указал uc-test, в другом uc-page Не работает. Одинаковые тоже пробовал. прои заполнении 1 и отправке данных внизу страницы показывается сообщение об ошибке - не все данные заполнены. Листаю до футера - там светятся красным окно ввода данных.
У меня текст пошел друг под другом. Не в одну строку
То же самое( Вроде всё по видео делал, но не получилось. Я нашёл другой выход - сделал всё, как автор, убрал кнопку из формы, только сделал её вертикальной и добавил чекбокс, но без текста в его поле. И потом просто накинул текст с соглашением о политики конфиденциальности рядом с чекбоксом. Вуаля) Но за код спасибо!
Тоже так сделала)@@andreykovshov166