Създаване и показване на изскачащи формуляри

Published: 16 юли 2026 г. · Last updated: 21 юли 2026 г. · By Marcus Biel

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

Изскачащите прозорци са полезни за оферти за бюлетини, отстъпки, регистрации за събития, lead magnet-и и други целенасочени призиви за действие. Тъй като прекъсват нормалното изживяване на страницата, времето и честотата са също толкова важни, колкото и дизайнът.

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

Създаване на изскачащ прозорец

Отворете „Signup Forms“, кликнете върху „Create Form“ и изберете „Popup“. Въведете ясно вътрешно име и продължете към създателя.

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

Използвайте име, което обяснява офертата или мястото на поставяне, например „Homepage Discount Popup“, „Webinar Registration Popup“ или „Guide Download Popup“. Вътрешното име не се показва автоматично на посетителите.

Избор на шаблон за изскачащ прозорец

Изскачащите прозорци предлагат празен формуляр, стандартен формуляр и четири готови шаблона:

• Изчистена отстъпка
• Топло ръководство
• Тъмен уебинар
• Мека общност

Изберете шаблон, чийто размер и структура на съдържанието са подходящи за офертата. След това можете да промените целия текст, полета, цветове, изображения, разстояния и оформление.

Дизайн на изскачащия прозорец

Използвайте визуалния създател, за да подредите изскачащия прозорец. Можете да комбинирате формуляра за абонамент с текст, изображения, видео, списъци, бутони, връзки към социални мрежи, брояч на абонатите, празни пространства и разделители.

Основното послание трябва да е достатъчно кратко, за да бъде разбрано веднага. Ясно заглавие, едно кратко обяснение и конкретен бутон за изпращане обикновено са по-ефективни от няколко конкуриращи се послания.

Изберете блока на формуляра за абонамент, за да конфигурирате полетата, задължителната информация, скритите тагове, индикатора за напредъка, брояча на абонатите, полетата за въвеждане и бутона за изпращане. Отворете „Page settings“, за да промените общия фон на изскачащия прозорец и настройките му за външен вид по подразбиране.

Изскачащият прозорец се показва над уебсайта с контролен елемент за затваряне. Оставете достатъчно визуално пространство около важния текст и полетата, за да остане формулярът лесен за използване на малък екран.

Конфигуриране на поведението на изскачащия прозорец

Изберете блока на формуляра за абонамент и отворете „Widget Settings“. Този раздел определя кога се показва изскачащият прозорец и колко често посетителят може да го вижда.

Забавяне на показването

„Display Delay“ определя колко секунди Maildroppa изчаква, преди да покаже изскачащия прозорец на вградена страница на уебсайт.

Въведете 0, за да го покажете без допълнително забавяне. Използвайте по-голяма стойност, когато посетителите трябва да имат време да прочетат страницата, преди да се появи офертата. Създателят приема забавяне до 86 400 секунди.

Изберете забавянето според страницата. Кратко забавяне може да е подходящо за целева страница на кампания, докато по-дълго забавяне може да е по-малко натрапчиво в статия.

Честота на показване

„Display Frequency“ определя периода, след който изскачащият прозорец може да бъде показан отново на същия посетител. Наличните опции са:

• Винаги
• Веднъж на час
• Веднъж дневно
• Веднъж седмично
• Веднъж месечно

Използвайте „Always“ внимателно. Изскачащ прозорец, който многократно прекъсва същия посетител, може да стане дразнещ. Ежедневната или седмичната честота често е по-добра начална настройка за обща оферта на уебсайт.

Честотата се съхранява в браузъра на посетителя. Затова тестването в друг браузър, в частен прозорец или след изчистване на съхранените данни на браузъра може да даде различен резултат.

Използване на намерение за излизане

Активирайте „Exit Intent Popup“, когато изскачащият прозорец трябва да се отвори, след като посетителят премести показалеца извън областта на страницата, което показва, че може да се готви да напусне.

Когато намерението за излизане е активирано, изскачащият прозорец изчаква това поведение, вместо да следва нормалното забавено показване. Избраната честота на показване все още не му позволява да се показва отново твърде скоро.

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

Отваряне на изскачащ прозорец ръчно от елемент на страницата

Изскачащият прозорец може да се отвори, когато посетител кликне върху конкретен бутон, изображение или връзка на уебсайта ви. Това е ръчно задействане чрез кликване. То се различава от „Exit Intent Popup“, който реагира, когато посетителят премести показалеца извън страницата.

Конфигурирайте и инсталирайте ръчното задействане чрез кликване, както следва:

1. Отворете изскачащия прозорец в Signup Form Builder.
2. Кликнете върху блока на формуляра за абонамент върху платното и отворете „Settings“ вдясно.
3. Разгънете „Widget Settings“ и активирайте „Open popup when a customer clicks a page element“.
4. Кликнете върху „Save changes“.
5. Върнете се към общия преглед на формулярите за абонамент и активирайте изскачащия прозорец, ако е неактивен.
6. Кликнете върху „Show Code Snippet“ в реда на този изскачащ прозорец.

Диалоговият прозорец съдържа двете стойности, необходими на уебсайта ви:

1. Копирайте целия код от раздела „JavaScript“ и го добавете към страницата на уебсайта, на която изскачащият прозорец трябва да е достъпен.
2. Под кода копирайте ID, показано под „Add this ID to element from which you want to manually trigger Popup“.
3. Добавете тази точна стойност към атрибута id на бутона, изображението или връзката, които трябва да отворят изскачащия прозорец.

ID следва този формат:

maildroppa-popup-btn-[form-id]

Например:

<button id="maildroppa-popup-btn-[form-id]">Get the guide</button>

JavaScript зарежда изскачащия прозорец. ID свързва изскачащия прозорец с избрания елемент на страницата. И двете трябва да присъстват на една и съща публикувана страница. Когато посетител кликне върху елемента с точно това ID, скриптът на Maildroppa отваря изскачащия прозорец.

Ако бутонът на уебсайта ви вече има ID от друга система за изскачащи прозорци, заменете го с ID за задействане на Maildroppa, когато Maildroppa трябва да обработва кликването. Не поставяйте изскачащия прозорец на Maildroppa в друг изскачащ прозорец, предоставен от създателя на уебсайта ви.

Използвайте всеки HTML ID само веднъж на страница. Ако няколко елемента трябва да отварят един и същ изскачащ прозорец, помолете човека, който реализира уебсайта, да свърже тези елементи, без да дублира същото ID.

Свързване на процеса на абониране

Прегледайте зададения процес на абониране в заглавната част на създателя. Той контролира непосредствения отговор след изпращане, имейла за Double Opt-in и резултата след потвърждението.

Можете да изберете съществуващ процес, да го редактирате или да създадете отделен процес за този изскачащ прозорец. Специално създаденият процес е полезен, когато офертата се нуждае от собствено съобщение за потвърждение или доставка на lead magnet.

Преглед и запазване

Кликнете върху „Preview“, за да проверите дизайна и поведението на изскачащия прозорец, без да променяте версията, използвана на уебсайта ви. Прегледайте оформлението, контрола за затваряне, реда на полетата, мястото за валидация и отговора след изпращане.

Кликнете върху „Save changes“, когато изскачащият прозорец е готов. След това се върнете към общия преглед на формулярите за абонамент.

Активиране и автоматично вграждане на изскачащия прозорец

Активирайте изскачащия прозорец от менюто с действия с три точки, ако още не е активен. След това кликнете върху „Show Code Snippet“ и копирайте целия код от раздела „JavaScript“.

Добавете скрипта към всяка страница на уебсайта, на която изскачащият прозорец трябва да е достъпен. Кодът съдържа уникалното ID на формуляра и зарежда текущата му запазена конфигурация.

Разделът „HTML“ предоставя генерираната маркировка за персонализирани реализации. Ако го използвате, тествайте внимателно цялото поведение и всички стъпки за изпращане, тъй като кодът и стиловете на уебсайта ви могат да повлияят на резултата.

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

.

За общи инструкции за вграждане вижте Създаване и вграждане на вграден формуляр.

Тестване на изскачащия прозорец на уебсайта ви

Тествайте изскачащия прозорец на реалната страница на уебсайта, след като добавите кода:

1. Проверете конфигурираното забавяне.
2. Тествайте бутона за затваряне и кликването извън формуляра.
3. Ако е активирано, преместете показалеца извън страницата, за да тествате намерението за излизане.
4. Ако е активирано, кликнете върху конфигурирания елемент на страницата, за да тествате ръчното задействане.
5. Проверете оформлението на тесен екран.
6. Изпратете формуляра и завършете процеса Double Opt-in.
7. Проверете абоната и скритите тагове в Maildroppa.

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

Актуализиране или деактивиране на изскачащия прозорец

За да актуализирате изскачащия прозорец, отворете го в Maildroppa, редактирайте дизайна или поведението, прегледайте го и кликнете върху „Save changes“. Фрагментът JavaScript продължава да използва същото ID на формуляра.

За да спрете временно показването му, изберете „Deactivate“ от менюто с действия. Деактивирането запазва изскачащия прозорец и предишните му отчетни данни. Премахнете и скрипта или елемента за задействане от уебсайта, ако вече не са необходими.