Chapters
- בונה טפסי הרשמה: עיצוב טפסים
- בנייה ופרסום של דפי נחיתה
- בנייה והטמעה של טפסי הרשמה
- יצירה והצגה של טפסים קופצים
- יצירה ומיקום של טפסי Slide-in
Contents
the email tool that makes email marketing simple
- Guides and Tutorials
- בנייה והטמעה של טפסי הרשמה
בנייה והטמעה של טפסי הרשמה
Published: · Last updated: · By Marcus Biel
In brief
מדריך ליצירה ולעיצוב של טפסי הרשמה מוטמעים ב‑Maildroppa, להפעלתם ולהטמעתם באתר באמצעות קוד JavaScript או HTML, כולל בדיקה, עדכון וחיבור זרימת ההרשמה.
טופס מוטמע ממוקם ישירות בתוך עמוד קיים באתר שלך. הוא נשאר חלק מהתוכן שסביבו במקום להופיע מעליו.
טפסים מוטמעים מתאימים במיוחד למאמרי בלוג, דפי נחיתה באתר שלך, אזורי ניוזלטר, סרגלים צדדיים ותחתיות עמוד. המיקום שבו מוסיפים את קוד הטופס קובע היכן הטופס יופיע.
המדריך הזה עוסק בשלבים הייחודיים לטפסים מוטמעים. הפונקציות החזותיות הנפוצות לעריכה מוסברות במדריך הראשי בניית טפסי הרשמה.
יצירת טופס מוטמע
פתחו את “טפסי הרשמה”, לחצו על “יצירת טופס” ובחרו “טופס מוטמע”. הזינו שם פנימי ברור והמשיכו לבונה.
אפשר גם לערוך טופס קיים על ידי לחיצה על שמו בסקירת טפסי ההרשמה.
השם הפנימי לא מוצג אוטומטית למבקרים. תנו לטופס שם לפי המיקום או המטרה שלו, למשל “ניוזלטר בדף הבית”, “תחתית הבלוג” או “עדכוני מוצר”.
בחירת עיצוב התחלתי
טפסים מוטמעים מציעים טופס ריק, טופס רגיל וארבע תבניות מעוצבות:
- פתק רגוע
- רצועת קופון
- עריכה כהה
- כחול מינימליסטי
בחרו בעיצוב שמתאים ביותר למרחב ולאופי של האתר שבו הטופס יופיע. ניתן לשנות כל עיצוב התחלתי לחלוטין לאחר הבחירה.
עיצוב הטופס המוטמע
השתמשו ב“פריסה” וב“תוכן” כדי לסדר את הטופס. טופס מוטמע יכול לכלול את טופס ההרשמה יחד עם טקסט תומך, תמונות, רשימות, כפתורים, קישורים חברתיים, מונה מנויים, מרווחים או קווים מפרידים.
בסרגל צדדי או בתחתית עמוד צרים, עיצוב בעל עמודה אחת בדרך כלל קל יותר לקריאה. באזור רחב יותר בעמוד, פריסה בעלת שתי עמודות יכולה להציב הסבר קצר או תמונה לצד השדות.
בחרו בבלוק טופס ההרשמה כדי לבחור שדות מנוי, שדות חובה, תוויות, תגיות מוסתרות, מחוון התקדמות ומונה מנויים אופציונלי. לאחר מכן תוכלו לעצב בנפרד את מיכל הטופס, השדות וכפתור השליחה.
פתחו את “הגדרות העמוד” כדי לשנות את הרקע ואת ברירות המחדל של העיצוב הכללי עבור בד הציור של הטופס המוטמע. התחשבו באתר שסביבו. רקע שקוף או פשוט משתלב לעיתים קרובות בצורה טבעית יותר, בעוד שרקע בעל ניגודיות עוזר להצעת ההרשמה לבלוט.
ההוראות המלאות לפריסות, תוכן, שכבות, שדות, תגיות, טיפוגרפיה ומראה נמצאות בשימוש בבונה טפסי ההרשמה.
חיבור תהליך ההרשמה
השתמשו בפקד תהליך ההרשמה בכותרת הבונה כדי לבדוק מה קורה לאחר השליחה, איזה אימייל אישור כפול נשלח ומה המבקר רואה לאחר האישור.
אפשר לבחור תהליך קיים, לערוך את התהליך המשויך או ליצור תהליך חדש. אם התהליך שנבחר משותף לטפסים אחרים, זכרו שעריכתו עשויה להשפיע גם על הטפסים האלה.
תצוגה מקדימה ושמירה
לחצו על “תצוגה מקדימה” כדי לבדוק את הטופס המלא לפני הצבתו באתר. בדקו את סדר השדות, התוויות, המקום לשגיאות, טקסט הכפתור וכמות התוכן התומך.
לחצו על “שמירת שינויים” כדי לשמור את הגרסה הנוכחית. חזרו לסקירת טפסי ההרשמה כאשר אתם מוכנים להטמיע אותו.
הפעלת הטופס
הטופס המוטמע חייב להיות פעיל לפני שניתן להשתמש בקוד הציבורי שלו.
אם הטופס אינו פעיל, פתחו את תפריט הפעולות בעל שלוש הנקודות שלו בסקירת טפסי ההרשמה ובחרו “הפעלה”. טופס פעיל מציג את הפעולה “הצגת קטע קוד”.
השביתו את הטופס כאשר אין עוד צורך שיהיה זמין באתר. השבתת הטופס מוציאה אותו מאתר האינטרנט בלי למחוק את העיצוב שלו או נתוני הדוחות הקודמים.
העתקת קוד JavaScript
לחצו על “הצגת קטע קוד” ופתחו את הכרטיסייה “JavaScript”. Maildroppa מספקת סקריפט קצר שמכיל את מזהה הטופס הייחודי.
הקוד בנוי כך:
<script async src="https://form.maildroppa.com/md-form-loader.js" data-md-form="[form-id]"></script>
העתיקו את הקוד המלא בלי לשנות את כתובת הסקריפט או את מזהה הטופס.
אפשרות JavaScript טוענת את הטופס השמור הנוכחי באמצעות סביבת ההרצה של טפסי Maildroppa. כאשר תערכו ותשמרו מאוחר יותר את אותו טופס ב-Maildroppa, קטע הקוד הקיים עדיין יפנה לאותו מזהה טופס. אין צורך ליצור טופס חדש רק כדי לשנות את הטקסט או העיצוב שלו.
הוספת הטופס לאתר
הדביקו את הסקריפט במיקום בעמוד שבו הטופס המוטמע אמור להופיע.
השלבים המדויקים תלויים במערכת האתר שלכם. בבונה עמודים או במערכת לניהול תוכן, השתמשו בבלוק שמקבל HTML מותאם אישית או קוד סקריפט. באתר מותאם אישית, הוסיפו את הסקריפט לתבנית או לסימון העמוד הרלוונטיים.
עורכי אתרים מסוימים מסירים תגיות סקריפט מטעמי אבטחה. אם הטופס אינו מופיע לאחר פרסום העמוד, בדקו תחילה אם העורך שמר את הסקריפט המלא של Maildroppa. ייתכן שתצטרכו להשתמש באזור הקוד המותאם אישית הייעודי של המערכת או לפנות לאדם שמנהל את האתר.
אל תדביקו את אותו קטע טופס מוטמע כמה פעמים באותו עמוד, אלא אם אתם מעוניינים במכוון להציג את אותו טופס בכמה מיקומים ובדקתם את ההגדרה הזו.
שימוש בכרטיסייה HTML
הכרטיסייה “HTML” מספקת את סימון הטופס שנוצר. אפשרות זו מיועדת להטמעות מותאמות אישית שבהן רוצים לעבוד ישירות עם ה-HTML שנוצר.
אם בחרתם בשיטה הזו, העתיקו את הסימון המלא. מכיוון ששילוב HTML מותאם אישית עלול להיות מושפע מסגנונות האתר ומהאופן שבו הוא מיושם, בדקו בקפידה את השדות, האימות, השליחה ותהליך האישור.
עבור טופס רגיל המנוהל על ידי Maildroppa, קטע ה-JavaScript הוא שילוב קצר יותר וטוען את תצורת הטופס הציבורית הנוכחית לפי המזהה שלו.
בדיקת הטופס המוטמע
פרסמו או הציגו בתצוגה מקדימה את עמוד האתר שמכיל את הקוד. לאחר מכן בדקו את הטופס כפי שמבקר היה עושה:
- בדקו שהטופס מופיע במיקום הנכון.
- הציגו את העמוד במסך רחב ובמסך צר.
- מלאו כל שדה חובה.
- שלחו את הטופס ובדקו את התגובה.
- פתחו את אימייל האישור הכפול.
- אשרו את הכתובת ובדקו את התגובה הסופית.
- ודאו שהמנוי וכל התגיות המוסתרות מופיעים כראוי ב-Maildroppa.
אם הטופס רחב יותר מהמיכל שלו באתר, התאימו את רוחב הטופס, את פריסת העמודות, את הריווח הפנימי או את הגדרות הערימה בנייד בבונה. הימנעו מתיקון בעיות פריסה באמצעות שינוי הקוד שנוצר על ידי Maildroppa.
עדכון טופס מוטמע
פתחו את אותו טופס ב-Maildroppa, בצעו את השינויים, הציגו אותם בתצוגה מקדימה ולחצו על “שמירת שינויים”. קטע ה-JavaScript באתר שלכם ממשיך להשתמש באותו מזהה טופס וטוען את תצורת הטופס הציבורית שנשמרה.
אם צריך להסיר את הטופס באופן זמני, השביתו אותו מסקירת טפסי ההרשמה. אם אין בו עוד צורך, הסירו את קטע הקוד גם מהאתר כדי שהעמוד לא יכיל קוד שאינו בשימוש.
Ready to Send Better Emails?
Stop juggling bloated tools or overpriced plans. Maildroppa offers personal support, GDPR-level privacy, and powerful email marketing - starting free forever.
No credit card required. No time limit.