כפתור שמור התקדמות ב-Fluent Forms #

ה-שמור והמשך שדה (Save & Resume field) ב-Fluent Forms מאפשר למשתמשים לשמור את התקדמותם בטופס במסד הנתונים ללא צורך בהתחברות. נוצרת קישור ייחודי המאפשר למשתמשים להמשיך למלא את הטופס מאוחר יותר מכל התקן.

מדריך זה יעזור לך בהוספה והתאמה של שדה ה-שמור והמשך ב-Fluent Forms.

שדה ה-Input שמור והמשך הוא תכונה מתקדמת של תוסף Fluent Forms. כדי להשתמש בו, אתה צריך את Fluent Forms Pro Add-on.

הוספת שדה כפתור שמור התקדמות #

כדי ללמוד כיצד להוסיף את שדה ה-Input שמור והמשך ל-Fluent Forms, בצע את השלבים הבאים:

ראשית, עבור לקטע טפסים (Forms) מתוך סרגל הניווט של Fluent Forms, בחר טופס רצוי, ולחץ על סמל עריכה (Edit) כדי לפתוח את דף העורך של הטופס.

ברגע שאתה בדף העורך (Editor), לחץ על סמל הפלוס (Plus Icon) בעורך הטופס שלך ופתח את מודול שדות מתקדמים (Advanced Fields). אתה יכול גם למצוא אפשרות זו בסרגל הצד הימני תחת הכרטיסייה שדות Input (Input Fields).

כעת, בחר את שדה ה-Input שמור והמשך בעצם לחיצה או גרירה שלו והנחתו בעורך שלך.

התאמה של שדה Input שמור והמשך #

ברגע שהוספת את שדה ה-Input שמור והמשך, תוכל להתאים אותו בעצם הסעת העכבר עליו ולחיצה על סמל העיפרון (Pencil Icon). זה יקח אותך לכרטיסייה התאמה של Input (Input Customization) בצד הימני, המציעה את אפשרויות ההתאמה הבאות.

• אפשרויות שדה שמור והמשך (Save & Resume Field Options)
• אפשרויות מתקדמות (Advanced Options)

אפשרויות שמור והמשך עשיר #

תחת כרטיסייה התאמה של Input, תמצא אפשרויות הגדרות שונות להתאמה של השדה. אפשרויות אלה מאפשרות לך להגדיר היבטים חיוניים של שדה ה-Input שמור והמשך.

כל ההגדרות תחת שדה ה-Input שמור והמשך שהוזכרו לעיל מוסברות בקצרה להלן:

א. טקסט כפתור (Button Text): אתה יכול לבחור את טקסט הכפתור שלך ברירת מחדל (Default) או תמונה (Image). משתמשים יכולים להתאים אישית טקסט כפתור באמצעות שדה זה אם אתה שומר טקסט כפתור כברירת מחדל. איזה טקסט משמש לשדה זה יוצג כטקסט הכפתור.

אם תבחר את אפשרות Image (תמונה), תוכל להוסיף תמונה ככפתור שלך עם ה-URL של התמונה. כמו כן, תוכל להוסיף טקסט Alt של תמונה (Image Alt text) עבור הכפתור שלך.

ב. סגנון כפתור (Button Style): אתה יכול לבחור את אפשרות הסגנון של הכפתור מתוך תפריט הנפתח בצד ימין. כמו כן, אתה יכול לבחור את אפשרויות Custom (מותאם אישית) כדי להתאים סכימות צבע שהוגדרו מראש, מיקום ותפקוד.

• Background Color (צבע רקע): בחר צבע רקע מתאים עבור הכפתור בהתאם לסכימת הצבע של האתר שלך. במקרה שלי, צבע הרקע ברירת המחדל הוא כחול.

• Text Color (צבע טקסט): בהתאם לצבע הרקע, תוכל לתן צבע חלק לטקסט הכפתור.

• Border Color (צבע גבול): לכפתור יש כברירת מחדל גבול בעובי פיקסל אחד. אתה יכול גם להגדיר צבע לגבול.

• Border Radius (רדיוס גבול): הזן את border-radius המתאים לטפסים שלך.

• Min-Width (רוחב מינימלי): תוכל לתן רוחב מינימלי לכפתור בפיקסלים ובאחוזים, אלה המתאימים לטופס שלך. רוחב min-width של 100% יהיה כפתור ברוחב מלא.

ג. גודל כפתור (Button Size): בחר את גודל הכפתור המתאים לטופס שלך. ישנן שלוש אפשרויות: קטן (Small), בינוני (Medium), וגדול (Large). אתה יכול לבחור אפשרות אחת.

ד. יישור תוכן (Content Alignment): אפשרות זו מגדירה כיצד התוכן יישור.

ה. הודעת הצלחה (Success Message): הזן טקסט המוצג כאשר המשתמש רואה שההתקדמות שלו נשמרה.

ו. אפשר רק למשתמשים מחוברים (Allow Only for Logged-in Users): אם תבחר בחיבור כן (Yes) כאן, אז רק משתמשים מחוברים יוכלו להשתמש בשמור והמשך. אם תבחר את אפשרות לא (No), כל המשתמשים יוכלו לשמור את ההתקדמות.

ז. הפעל קישור דוא”ל (Enable Email Link): אתה יכול לאפשר למשתמשים לקבל קישור דוא”ל של המשך (Email Resume Link) בעצם בחירת אפשרויות כן (Yes) או לא (No).

ח. נושא דוא”ל (Email Subject): אתה יכול להשתמש ב-placeholder {form_name} כדי לקבל את שם הטופס.

ט. גוף דוא”ל (Email Body): הזן את טקסט גוף הדוא”ל כאן.

אתה יכול גם להשתמש בתכונות סגנון זהות עבור מצבי Hover של הכפתור. לחץ על מצב ה-Hover והחל את אותן תכונות הסגנון המתאימות לסגנונות המצב הפעיל.

אפשרויות מתקדמות #

הגדרות מתקדמות מאפשרות התאמה נוספת כדי לעמוד במקרי שימוש ספציפיים. כל ה-הגדרות תחת כרטיסייה אפשרויות מתקדמות שהוזכרו בצילום המסך מוסברות בקצרה להלן:

א. Container Class (מחלקת מיכל): השתמש באפשרות זו כדי להוסיף את מחלקות ה-CSS המותאמות שלך לעטיפת השדה.

ב. Element Class (מחלקת אלמנט): הוסף מחלקות CSS מותאמות אישית לשדה ה-Input.

ג. Name Attribute (תכונה name): תכונת ה-name של שדה ה-Input היא המקבילה ב-HTML של אותו שם. אתה לא צריך לשנות זאת.

ד. Conditional Logic (לוגיקה תנאית): אפשרות זו מאפשרת לך ליצור כללים ספציפיים כדי להסתיר/הצגת דינמית את שדה ה-Input לתפקוד בתנאי על סמך ערכי ההגשה שלך בהתאם לקבוצת הלוגיקה התנאית שלך.

ה. Send Email on Partial Entry Created (שלח דוא”ל בעת יצירת כניסה חלקית): אם אתה רוצה להפעיל את המשתמש לקבל דוא”ל כאשר הם בתחילה משמרים את ההתקדמות, בחר את אפשרויות כן, או אם אתה לא מקבל דוא”ל כאשר הם בתחילה משמרים את ההתקדמות, בחר את אפשרויות לא.

ו. Send Email on Partial Entry Updated (שלח דוא”ל בעת עדכון כניסה חלקית): אם אתה רוצה שהמשתמשים לא יקבלו דוא”ל כאשר הם מעדכנים את ההתקדמות שנשמרה שלהם, בחר את אפשרות לא, או אם אתה הולך לקבל דוא”ל כאשר הם מעדכנים את ההתקדמות שנשמרה שלהם, בחר את אפשרות כן.

הטמע את הטופס בחזית #

לאחר שתסיים את ההתאמה, לחץ על כפתור שמור טופס (Save Form) כדי לשמור את כל השינויים שלך. לחץ על כפתור Preview & Design (תצוגה מקדימה ועיצוב) באמצע כדי לראות את תצוגה מקדימה של הטופס.

כדי לשלב ולהציג את הטופס בדף או פוסט ספציפי, העתק את ה-Shortcode (קוד קצר) מהחלק העליון הימני ו-הדבק אותו לתוך ה-דף או פוסט הרצוי שלך.

כפתור שמור התקדמות חל באופן שווה על הטופס בצעדים (Step Form).

תצוגה מקדימה של שדה שמור והמשך #

הנה תצוגה מקדימה של שדה שמור והמשך שנוסף תחת הטופס.

המנהל יכול כעת להוסיף את קוד ה-Shortcode של הטופס הזה לכל דף. משתמשים יכולים לראות את הטופס, ולאחר לחיצה על כפתור שמור התקדמות, קישור יהיה יוצר כך שהם יוכלו להשתמש בקישור זה כדי לצפות בטופס מכל דפדפן בכל עת. להבנה טובה יותר, ראה את צילום המסך להלן.

ברכות! הוספת בהצלחה שדה שמור והמשך לטופס Fluent Forms שלך.