Как да създадете лайтбокс форма

March 28, 2022

Формата за лайтбокс е прозорец, който се появява, когато посетителят щракне върху линк. Той припокрива страницата, която съдържа линка и изглежда по следния начин:

Това е елегантен и лесен начин да споделите вашите форми с посетителите. Следвайте стъпките по-долу, за да започнете:

1. Отидете до вашия конструктор на форми и щракнете върху раздела ПУБЛИКУВАНЕ.

2. Щракнете върху ВГРАЖДАНЕ вляво, след това върху ЛАЙТБОКС.

3. На следващата страница можете да копирате кода, както е, като щракнете върху зеления бутон КОПИРАНЕ НА КОД.

4. Или ако искате допълнително да персонализирате външния вид на лайтбокса, щракнете върху бутона ПЕРСОНАЛИЗИРАНЕ. За да видите как изглежда, натиснете бутона ПРЕГЛЕД.

В раздела за персонализиране имате опции за промяна на ЗАГЛАВИЕТО на лайтбокса, РАЗМЕРИ НА ФОРМАТА, СТИЛ, ЦВЕТОВЕ и опция за ОТВАРЯНЕ НА СТРАНИЦАТА ПРИ ЗАРЕЖДАНЕ или не.

5. Не забравяйте да щракнете върху бутона ЗАПАЗИ ПРОМЕНИ, след което копирайте генерирания код.

Персонализиране на призива за използване на изображение:

Заменете следния ред:

<a class="btn lightbox-1234567890" style=""> Contact Form </a>

… със следното:

<img src="IMAGE URL HERE" class="btn lightbox-1234567890">

Трябва да замените 1234567890 с вашия действителен формов идентификатор. Стойността class = “” е много важна за лайтбокса, за да работи при щракване върху изображението. Идентификаторът на формата е низ от числа в края на URL адреса на формата. URL НА ИЗОБРАЖЕНИЕТО ТУК също трябва да бъде заменен с действителния URL адрес на изображението.

Демо: https://shots.jotform.com/elton/jotform_lightbox_demo.html

Готови сте! Как мина? Дали инструкциите бяха достатъчно ясни? Как можем да ги подобрим? Моля споделете вашите коментари в секцията по-долу.

Беше ли това ръководство полезно?
Свържете се с екипа за поддръжка:

Нашият екип за поддръжка на клиенти е на разположение денонощно и средното ни време за реакция е между един и два часа.
С нашия екип можете да се свържете чрез:

Форум за поддръжка: https://www.jotform.com/answers/

Свържете се с поддръжката на Jotform: https://www.jotform.com/contact/

Изпратете коментар:

Jotform Avatar
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

Коментар:

Podo CommentБъдете първите, които коментират.