Δημιουργία και εμφάνιση φορμών Popup

Published: 16 Ιουλίου 2026 · Last updated: 21 Ιουλίου 2026 · By Marcus Biel

Ένα Popup εμφανίζεται πάνω από το περιεχόμενο του ιστότοπού σας. Τοποθετεί την προσφορά εγγραφής ακριβώς στο οπτικό πεδίο του επισκέπτη, ενώ η σελίδα από κάτω παραμένει στη θέση της.

Τα Popup είναι χρήσιμα για προσφορές newsletter, εκπτώσεις, εγγραφές σε εκδηλώσεις, lead magnets και άλλες στοχευμένες παροτρύνσεις για ενέργεια. Επειδή διακόπτουν την κανονική εμπειρία της σελίδας, ο χρόνος εμφάνισης και η συχνότητα είναι εξίσου σημαντικά με τον σχεδιασμό.

Αυτός ο οδηγός εξηγεί τις ρυθμίσεις που αφορούν ειδικά τα Popup. Οι διατάξεις, τα μπλοκ περιεχομένου, τα πεδία συνδρομητών, οι ετικέτες, η τυπογραφία, τα επίπεδα και οι ροές εγγραφής καλύπτονται στον κύριο οδηγό του Signup Form Builder.

Δημιουργία Popup

Ανοίξτε το “Signup Forms”, κάντε κλικ στο “Create Form” και επιλέξτε “Popup”. Πληκτρολογήστε ένα σαφές εσωτερικό όνομα και συνεχίστε στον builder.

Μπορείτε επίσης να επεξεργαστείτε ένα υπάρχον Popup κάνοντας κλικ στο όνομά του στην Επισκόπηση Signup Forms.

Χρησιμοποιήστε ένα όνομα που εξηγεί την προσφορά ή την τοποθέτηση, όπως “Homepage Discount Popup”, “Webinar Registration Popup” ή “Guide Download Popup”. Το εσωτερικό όνομα δεν εμφανίζεται αυτόματα στους επισκέπτες.

Επιλογή προτύπου Popup

Τα Popup προσφέρουν μια κενή φόρμα, μια τυπική φόρμα και τέσσερα σχεδιασμένα πρότυπα:

• Καθαρή έκπτωση
• Ζεστός οδηγός
• Σκοτεινό webinar
• Απαλή κοινότητα

Επιλέξτε ένα πρότυπο του οποίου το μέγεθος και η δομή περιεχομένου ταιριάζουν στην προσφορά. Όλα τα κείμενα, τα πεδία, τα χρώματα, οι εικόνες, τα περιθώρια και η διάταξη μπορούν να αλλάξουν αργότερα.

Σχεδιασμός του Popup

Χρησιμοποιήστε τον οπτικό builder για να οργανώσετε το Popup. Μπορείτε να συνδυάσετε τη φόρμα εγγραφής με κείμενο, εικόνες, βίντεο, λίστες, κουμπιά, συνδέσμους κοινωνικών δικτύων, μετρητή συνδρομητών, κενά και διαχωριστικά.

Κρατήστε το βασικό μήνυμα αρκετά σύντομο ώστε να γίνεται κατανοητό αμέσως. Μια σαφής επικεφαλίδα, μία σύντομη εξήγηση και ένα συγκεκριμένο κουμπί υποβολής είναι συνήθως πιο αποτελεσματικά από πολλά ανταγωνιστικά μηνύματα.

Επιλέξτε το μπλοκ της φόρμας εγγραφής για να ρυθμίσετε τα πεδία, τις απαιτούμενες πληροφορίες, τις κρυφές ετικέτες, την ένδειξη προόδου, τον μετρητή συνδρομητών, τα πεδία εισαγωγής και το κουμπί υποβολής. Ανοίξτε τις “Page settings” για να αλλάξετε το συνολικό φόντο του Popup και τις προεπιλεγμένες ρυθμίσεις εμφάνισης.

Το Popup εμφανίζεται πάνω από τον ιστότοπο και διαθέτει στοιχείο κλεισίματος. Αφήστε αρκετό οπτικό χώρο γύρω από τα σημαντικά κείμενα και πεδία, ώστε η φόρμα να παραμένει εύχρηστη σε μικρή οθόνη.

Ρύθμιση συμπεριφοράς Popup

Επιλέξτε το μπλοκ της φόρμας εγγραφής και ανοίξτε το “Widget Settings”. Αυτή η ενότητα καθορίζει πότε εμφανίζεται το Popup και πόσο συχνά μπορεί να το βλέπει ένας επισκέπτης.

Display Delay

Το “Display Delay” καθορίζει πόσα δευτερόλεπτα περιμένει το Maildroppa πριν εμφανίσει το Popup σε μια σελίδα ενσωματωμένου ιστότοπου.

Πληκτρολογήστε 0 για να εμφανιστεί χωρίς επιπλέον καθυστέρηση. Χρησιμοποιήστε μεγαλύτερη τιμή όταν θέλετε οι επισκέπτες να έχουν χρόνο να διαβάσουν τη σελίδα πριν εμφανιστεί η προσφορά. Ο builder δέχεται καθυστέρηση έως και 86.400 δευτερόλεπτα.

Επιλέξτε την καθυστέρηση ανάλογα με τη σελίδα. Μια σύντομη καθυστέρηση μπορεί να είναι κατάλληλη σε μια στοχευμένη σελίδα καμπάνιας, ενώ μια μεγαλύτερη καθυστέρηση μπορεί να είναι λιγότερο ενοχλητική σε ένα άρθρο.

Display Frequency

Το “Display Frequency” καθορίζει το διάστημα μετά το οποίο το Popup μπορεί να εμφανιστεί ξανά στον ίδιο επισκέπτη. Οι διαθέσιμες επιλογές είναι:

• Always
• Once per hour
• Once per day
• Once per week
• Once per month

Χρησιμοποιήστε το “Always” με προσοχή. Ένα Popup που διακόπτει επανειλημμένα τον ίδιο επισκέπτη μπορεί να γίνει ενοχλητικό. Η καθημερινή ή εβδομαδιαία συχνότητα είναι συχνά καλύτερο σημείο εκκίνησης για μια γενική προσφορά ιστότοπου.

Η συχνότητα αποθηκεύεται στο πρόγραμμα περιήγησης του επισκέπτη. Επομένως, οι δοκιμές σε άλλο πρόγραμμα περιήγησης, σε παράθυρο ιδιωτικής περιήγησης ή μετά τη διαγραφή του αποθηκευτικού χώρου του προγράμματος περιήγησης μπορεί να δώσουν διαφορετικό αποτέλεσμα.

Χρήση Exit Intent

Ενεργοποιήστε το “Exit Intent Popup” όταν θέλετε το Popup να ανοίγει αφού ο επισκέπτης μετακινήσει τον δείκτη έξω από την περιοχή της σελίδας, γεγονός που υποδεικνύει ότι μπορεί να είναι έτοιμος να αποχωρήσει.

Όταν το exit intent είναι ενεργοποιημένο, το Popup περιμένει αυτή τη συμπεριφορά αντί να ακολουθεί την κανονική καθυστερημένη εμφάνιση. Η επιλεγμένη συχνότητα εμφάνισης εξακολουθεί να αποτρέπει την επανεμφάνισή του πολύ σύντομα.

Το exit intent βασίζεται στην κίνηση του δείκτη και επομένως αφορά κυρίως προγράμματα περιήγησης σε επιτραπέζιους και φορητούς υπολογιστές. Οι συσκευές αφής δεν παρέχουν το ίδιο σήμα εξόδου. Βεβαιωθείτε ότι οι επισκέπτες από κινητές συσκευές μπορούν να ανακαλύψουν την προσφορά εγγραφής σας μέσα από την ίδια τη σελίδα ή άλλη κατάλληλη φόρμα.

Άνοιγμα Popup χειροκίνητα από στοιχείο σελίδας

Ένα Popup μπορεί να ανοίγει όταν ένας επισκέπτης κάνει κλικ σε συγκεκριμένο κουμπί, εικόνα ή σύνδεσμο στον ιστότοπό σας. Αυτό είναι το χειροκίνητο έναυσμα κλικ. Διαφέρει από το “Exit Intent Popup”, το οποίο αντιδρά όταν ο επισκέπτης μετακινεί τον δείκτη έξω από τη σελίδα.

Ρυθμίστε και εγκαταστήστε το χειροκίνητο έναυσμα κλικ ως εξής:

1. Ανοίξτε το Popup στον Signup Form Builder.
2. Κάντε κλικ στο μπλοκ της φόρμας εγγραφής στον καμβά και ανοίξτε τις “Settings” στα δεξιά.
3. Αναπτύξτε τις “Widget Settings” και ενεργοποιήστε την επιλογή “Open popup when a customer clicks a page element”.
4. Κάντε κλικ στο “Save changes”.
5. Επιστρέψτε στην Επισκόπηση Signup Forms και ενεργοποιήστε το Popup, αν είναι ανενεργό.
6. Κάντε κλικ στο “Show Code Snippet” στη γραμμή του συγκεκριμένου Popup.

Ο διάλογος περιέχει τις δύο τιμές που απαιτούνται στον ιστότοπό σας:

1. Αντιγράψτε ολόκληρο τον κώδικα από την καρτέλα “JavaScript” και προσθέστε τον στη σελίδα του ιστότοπου όπου θα πρέπει να είναι διαθέσιμο το Popup.
2. Κάτω από τον κώδικα, αντιγράψτε το ID που εμφανίζεται κάτω από την επιλογή “Add this ID to element from which you want to manually trigger Popup”.
3. Προσθέστε αυτή την ακριβή τιμή στο χαρακτηριστικό id του κουμπιού, της εικόνας ή του συνδέσμου που θα ανοίγει το Popup.

Το ID ακολουθεί αυτή τη μορφή:

maildroppa-popup-btn-[form-id]

Για παράδειγμα:

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

Η JavaScript φορτώνει το Popup. Το ID συνδέει το Popup με το επιλεγμένο στοιχείο της σελίδας. Και τα δύο πρέπει να υπάρχουν στην ίδια δημοσιευμένη σελίδα. Όταν ένας επισκέπτης κάνει κλικ στο στοιχείο με το συγκεκριμένο ID, το script του Maildroppa ανοίγει το Popup.

Αν το κουμπί του ιστότοπού σας διαθέτει ήδη ID από άλλο σύστημα Popup, αντικαταστήστε το με το ID εναύσματος του Maildroppa όταν θέλετε το Maildroppa να διαχειρίζεται το κλικ. Μην τοποθετείτε το Popup του Maildroppa μέσα σε δεύτερο Popup που παρέχεται από τον builder του ιστότοπού σας.

Χρησιμοποιήστε κάθε HTML ID μόνο μία φορά ανά σελίδα. Αν πολλά στοιχεία πρέπει να ανοίγουν το ίδιο Popup, ζητήστε από το άτομο που υλοποιεί τον ιστότοπο να συνδέσει αυτά τα στοιχεία χωρίς να αντιγράψει το ίδιο ID.

Σύνδεση της ροής εγγραφής

Ελέγξτε την αντιστοιχισμένη ροή εγγραφής στην κεφαλίδα του builder. Καθορίζει την άμεση απόκριση μετά την υποβολή, το email Double Opt-in και το αποτέλεσμα μετά την επιβεβαίωση.

Μπορείτε να επιλέξετε μια υπάρχουσα ροή, να την επεξεργαστείτε ή να δημιουργήσετε ξεχωριστή ροή για αυτό το Popup. Μια ειδική ροή είναι χρήσιμη όταν η προσφορά χρειάζεται δικό της μήνυμα επιβεβαίωσης ή παράδοση lead magnet.

Προεπισκόπηση και αποθήκευση

Κάντε κλικ στο “Preview” για να ελέγξετε τον σχεδιασμό και τη συμπεριφορά του Popup χωρίς να αλλάξετε την έκδοση που χρησιμοποιείται στον ιστότοπό σας. Ελέγξτε τη διάταξη, το στοιχείο κλεισίματος, τη σειρά των πεδίων, τον χώρο για τα μηνύματα επικύρωσης και την απόκριση μετά την υποβολή.

Κάντε κλικ στο “Save changes” όταν το Popup είναι έτοιμο. Στη συνέχεια, επιστρέψτε στην Επισκόπηση Signup Forms.

Ενεργοποίηση και αυτόματη ενσωμάτωση του Popup

Ενεργοποιήστε το Popup από το μενού ενεργειών με τις τρεις τελείες, αν δεν είναι ήδη ενεργό. Στη συνέχεια, κάντε κλικ στο “Show Code Snippet” και αντιγράψτε ολόκληρο τον κώδικα από την καρτέλα “JavaScript”.

Προσθέστε το script σε κάθε σελίδα του ιστότοπου όπου θα πρέπει να είναι διαθέσιμο το Popup. Ο κώδικας περιέχει το μοναδικό form ID του Popup και φορτώνει την τρέχουσα αποθηκευμένη διαμόρφωσή του.

Η καρτέλα “HTML” παρέχει το δημιουργημένο markup για προσαρμοσμένες υλοποιήσεις. Αν τη χρησιμοποιήσετε, ελέγξτε προσεκτικά όλες τις συμπεριφορές και τα βήματα υποβολής, επειδή ο κώδικας και τα στυλ του ιστότοπού σας μπορούν να επηρεάσουν το αποτέλεσμα.

Αυτή η ενότητα ισχύει όταν το Popup πρέπει να ανοίγει αυτόματα με βάση την καθυστέρηση εμφάνισης ή τη συμπεριφορά exit intent. Για κουμπί, εικόνα ή σύνδεσμο που ανοίγει το Popup με κλικ, ακολουθήστε την ενότητα

.

Για γενικές οδηγίες ενσωμάτωσης, ανατρέξτε στην ενότητα Δημιουργία και ενσωμάτωση ενσωματωμένης φόρμας.

Δοκιμή του Popup στον ιστότοπό σας

Δοκιμάστε το Popup στην πραγματική σελίδα του ιστότοπου αφού προσθέσετε τον κώδικα:

1. Ελέγξτε την καθορισμένη καθυστέρηση.
2. Δοκιμάστε το κουμπί κλεισίματος και το κλικ έξω από τη φόρμα.
3. Αν είναι ενεργοποιημένο, μετακινήστε τον δείκτη έξω από τη σελίδα για να δοκιμάσετε το exit intent.
4. Αν είναι ενεργοποιημένο, κάντε κλικ στο διαμορφωμένο στοιχείο της σελίδας για να δοκιμάσετε το χειροκίνητο έναυσμα.
5. Ελέγξτε τη διάταξη σε στενή οθόνη.
6. Υποβάλετε τη φόρμα και ολοκληρώστε τη διαδικασία Double Opt-in.
7. Επαληθεύστε τον συνδρομητή και τις κρυφές ετικέτες στο Maildroppa.

Η ρύθμιση συχνότητας μπορεί να εμποδίσει την επανεμφάνιση του Popup κατά τη διάρκεια επαναλαμβανόμενων δοκιμών. Χρησιμοποιήστε ένα παράθυρο ιδιωτικής περιήγησης ή διαγράψτε τον σχετικό αποθηκευτικό χώρο του προγράμματος περιήγησης όταν χρειάζεστε μια καθαρή δοκιμαστική επίσκεψη.

Ενημέρωση ή απενεργοποίηση του Popup

Για να ενημερώσετε το Popup, ανοίξτε το στο Maildroppa, επεξεργαστείτε τον σχεδιασμό ή τη συμπεριφορά, κάντε προεπισκόπηση και κάντε κλικ στο “Save changes”. Το απόσπασμα JavaScript συνεχίζει να χρησιμοποιεί το ίδιο form ID.

Για να διακόψετε προσωρινά την εμφάνισή του, επιλέξτε “Deactivate” από το μενού ενεργειών. Η απενεργοποίηση διατηρεί το Popup και τα προηγούμενα δεδομένα αναφορών του. Αφαιρέστε επίσης το script ή το στοιχείο εναύσματος από τον ιστότοπο, αν δεν χρειάζονται πλέον.