איך ליצור טופס בטפסים הישנים של ג'ט

איך ליצור טופס בטפסים הישנים של ג'ט

במדריך זה נלמד איך ליצור טפסים עם הכלי של ג'ט שנקרא Forms(legacy) שהכוונה טפסים בעברית
חשוב לדעת שקרוקובלוק הפסיקו לתמוך בפיצ'ר זה והם מתקנים רק תקלות קריטיות ולא מנסים לשדרג אותו או לתקן כל בעיה קטנה שיש בוא
כך שאם אתם ניגשים לבנות אתר שקלו טוב האם לבנות את כל הטפסים באתר עם זה מומלץ לבנות עם התוסף של קרוקובלוק שנקרא JetFormBuilder

 

דרישות מקדימות בשביל לעבוד עם המדריך הזה:

אלמנטור (אפשר אפילו רק את הגרסה החינמית)

JetEnging התקנה של התוסף והפעלה

הפעלת הפיצ'ר בדשבורד של JetEnging

הכנס לדשבורד של וורדפרס > JetEnging > אמור להופיע שם מלא פיצ'רים כמו בתמונה הזו

הפעילו את Forms ולחצו על Save

 

יצירת טופס חדש

יצירת הטופס 

הכנס לתפריט תחת JetEnging  בשם Forms ולחץ על הכפתור הוסף חדש(Add New)

שדות של הטופס

בשורה העליונה ניתן להכניס את השם בשביל הטופס שלך
ומתחת לזה מגיע טופס חדש עם 2 שדות שכמובן ניתן לשנות / להסיר אותם

סוגי השדות שישנם בטופס

ישנם סוגי שדות לכל נתון אשר תרצו להכניס לטפסים שלכם בוא נעבור עליהם:

  • Text נועד עבור שם פרטי, שם משפחה, וכו'
  • Textarea נועד עבור לתת למשתמשים להשאיר הודעה וכדומה
  • Hidden נועד עבור הוספת ID לטופס (שימושי בדרך כלל לעדכון של משהו)
  • Select — Checkbox — Radio נועד עבור להוסיף לטופס שלכם אפשרויות בחירה
  • Number נועד עבור הוספת ערך מספרי כגון בחירת כמות של משהו
  • Date/Time.
  • Media נועד עבור לתת אופציה למשתמשים לשלוח קבצים
  • WYISWYG נועד עבור הוספת טקסט אבל עם אופציה של לעצב את הטקסט
  • Range נועד עבור בחירת טווח מסויים לדוגמא טווח מחירים
  • Heading שנועד עבור אם תרצו להוסיף כותרת מסויימת בתוך הטופס שלכם

ניתן ללמוד עוד על סוגי השדות של הטפסים של ג'ט במדריך > סוגי השדות בטפסים הישנים של ג'ט

 

חשוב לדעת!!!
שמתי שיוצרים שדה מסויים בתת ההגדרות השדה Name חייב להכיל אך ורק אותיות קטנות באנגלית, או מספרים, או מקף(-)
לא אותיות גדולות או רווחים זה יכול ליצור לכם תקלות תזכרו

חילוק הטופס לחלקים וכן שאיבת נתונים מוגדרים מראש

Add Page Break זהו כפתור שמופיע ליד הכפתור של הוספת שדה חדש כמו שמופיע בתמונה

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

ככה מעצבים את זה

  • ב-Label ניתן להוסיף את השם של הכפתור שיופיע למשתמש בסוף אותו החלק של הטופס (לצורך הדוגמא: הבא)
  • ב-Disabled message זה החלק שניתן להוסיף הודעה שתוצג למשתמש כל עוד הוא לא מילא את כל הפרטים (לדוגמא: עוד לא מלאו כל הפרטים בשביל לעבור לשלב הבא)
  • ב-Custom CSS ניתן להוסיף עיצוב אישי דרך CSS

ב-שאיבת נתונים מוגדרים מראש זה נועד בשביל טפסים שאמורים לשנות נתונים שקיימים כבר במערכת לדוגמא: עריכת פרטי משתמש, עריכת פוסט קיים וכו'

כמו שניתן לראות אם אנו מפעילים את האופציה הזו נפתח לנו חלון קטן של הגדרות

החלק הבא הוא חלק חשוב(כי זה החלק שאנחנו שואבים נתונים מהדטא בייס שלנו)

  • Source אנחנו מגדירים מה אנחנו רוצים לשנות כעת אנחנו נדבר רק עם פוסטים ומשתמשים במדריכים אחרים ניגע בשאר האופציות
    אנחנו בחורים משתמשים אם אנחנו רוצים לתת אופציה של שינוי נתונים במשתמש
    ואפשר גם לבחור פוסטים אם נרצה לתת אופציה למשתמש לערוך פוסט קיים
  • Get post/User ID from: כאן אנו מגדירים מהיכן הוא מקבל את הנתונים בדרך כלל נשאיר את זה על האופציה של Current Post/User
    שזה אומר שהוא שואב נתונים לפי הפוסט/המשתמש הספציפי שעליו מנסים לעשות שינוי
  • Fields Map: זה החלק שאנחנו מגדירים איזה נתון יופיע באיזה שדה של הטופס שלנו
    לדוגמא: אם נבנה טופס לשינוי פרטים של משתמש, אז אנחנו נרצה שכשהמשתמש ילחץ על הכפתור לשינוי פרטים יופיע לו הטופס עם הפרטים שלו והוא יוכל לשנות אותם ואנחנו נרצה להזין לשם את הפרטים שכבר שמורים אצלנו בדטא בייס
    אז אנחנו נגדיר שהשם הפרטי של המשתמש יופיע בשדה שנקרא לה שם פרטי

כמו שניתן לראות בתמונה בחרתי שיופיע השם הפרטי של המשתמש בשדה של first-name בטופס שיצרתי

 

הגדרת התראות

והגענו לחלק האחרון של הטפסים שהוא החלק שבוא אנחנו מגדירים מה קורה אחרי שהמשתמש לוחץ על שלח/עדכון

ישנם כמה וכמה אופציות מה יקרה ברגע שהמשתמש ילחץ על שלח

  1. Send Email - המוכר והידוע כמו כל טופס אחר בשניה שהמשתמש ילחץ על שלח ישלח מייל למייל שנגדיר מראש עם כל הפרטים של אותו הטופס ישנם כמה תתי הגדרות בכל אחד להלן:
    · Mail to: כאן אנו מגדירים למי ישלח המייל:
    1. Admin mail הכוונה למנהל האתר ישלח המייל
    2. Email from submitted form field שאיבת מייל דינאמי מתוך שדה שנמצא בתוך הטופס עצמו, אם נבחר באופציה זו יפתח לנו
    אופציה תחת לזה בשם Form Field ששם אנחנו נבחר את השדה הרצויה מהטופס לשאיבת המייל שאליו נשלח את ההודעה
    3. Custom email מייל ייחודי לטופס הזה אלו
    · Replay to: ישנה אופציה לעשות תשובה אוטוטית אחרי שנשלח המייל וגם כאן יש לנו 3 אופציות לבחירה
    1. Not selected הכוונה שהוא לא יגיב על המייל הזה
    2. Email from submitted form field שאיבת מייל דינאמי מתוך שדה שנמצא בתוך הטופס עצמו, אם נבחר באופציה זו יפתח לנו
    אופציה תחת לזה בשם Form Field ששם אנחנו נבחר את השדה הרצויה מהטופס לשאיבת המייל שאליו נשלח את ההודעה
    3. Custom email מייל ייחודי לטופס הזה אלו
    · Subject: זהו החלק שאנחנו כותבים מה יהיה הנושא של המייל (לדוגמא: ליד חדש מאתר devdes.co.il)· From Name: כאן אנחנו
    מגדירים ממי המייל הזה (לדוגמא: מייל מאתר DevDes)
    · From Email Address: כאן אנחנו מגדירים מאיזה מייל הגיע המייל הזה (לדוגמא: [email protected])
    · Content type: אין צורן לגעת בשדה זה
    · Content: החלק הכי חשוב זה גוף המייל ניתן לראות בתמונה המצורפת שישנם Available macros 
    שאלו הנתונים שנשאבים מהטופס שהם זמינים לשליחה דרך המייל כמו שניתן לראות בתמונה
    ניתן לראות שיש לי אופציה להוסיף את %post_id% , %first-name% אלו קיצור של הנתונים שהמשתמש הכניס בתוך אותם שורות
    בטופס
  2. Insert/Update Post - את אופציה זו נפעיל אם נרצה להעלאות פוסט חדש או לעדכן פוסט קיים וגם פה יש לנו כמה הגדרות
    1. Post Type: להיכן הפוסט הזה שייך ניתן לנו אופציה לבחור כמו בתמונה

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

    3. Fields Map: כאן אנו נגדיר להיכן יכנס כל חלק שבטופס לפוסט החדש (לדוגמא: כותרת הפוסט תכנס לכותרת של הפוסט)כמובן חשוב בסוף לעשות שמירהמומלץ לראות את המדריך הספציפי ליצירת פוסטים חדשים באתר > להעלאות פוסט חדש / עדכן פוסט קיים
  3. Register New User - את האופציה הזו נפעיל אם נרצה ליצור טפסים ליצירת משתמש חדש באתר וגם כאן ישנם כמה הדרות חשובות
    1. Allow creating new users by existing users - אני אישית לא הייתי מאשר את זה סביר להניח שזה יכול לגרום לצרות
    2. Fields Map: מיפוי הפרטים של המשתמש בדטא בייס שלנו ישנם כמה שדות שלא יכולים להישאר ריקים בוא נעיף מבט בתמונה ונבין
    כל שדה

    כתוב לנו שהשדות: User Login, Email, Password לא יכולים להיות ריקים, לכן אנחנו נזין להם את הנתונים הבאים
    בשדות User Login ו- Email נזין את האימייל שקיבלנו בטופס
    ובשדות Password ו- Confirm Password נזין את הסיסמא שקיבלנו בטופס
    כל שאר השדות הם רשות אבל כמובן שאנחנו ננסה להזין כמה שיותר פרטים על המשתמשים שלנובתמונה הבאה ישנם עוד כמה דברים שנצטרך להגדיר,3. User Rule - בשדה זה נגדיר איזה תפקיד המשתמש יקבל באתר שלנו (לדוגמא: אם זה מנוי או מנהל וכו')
    4. User Meta - אם הוספנו שדות מיוחדים למשתמש אנו נרצה להזין את הנתונים שביקשנו בטופס לדטא בייס שלנו (לדוגמא: נניח והספנו
    מספר פלאפון לכל משתמש זה משהו ייחודי שאנחנו הוספנו ואנחנו נצטרך להגדיר ידנית לאיזה שדה להכניס את הנתון הזה
    5. Log In User after Register: בחירה שלנו האם לחבר את המשתמש אחרי שהוא נרשם או לאמומלץ לראות את המדריך הספציפי ליצירת משתמשים חדשים באתר > יצירת משתמש חדש באתר
  4. Update User - עדכון פרטים של משתמש קיים בחלק הזה אין לנו הרבה פרטים להכניס
    נעיף מבט בתמונה ונעבוד לפיה1. Fields Map: מיפוי של הפרטים החדשים שהמשתמש הזין בטופס לתוך הדטא בייס שלנו (לדוגמא: שינוי שם וכדומה)
    2. User Rule - בשדה זה נגדיר איזה תפקיד המשתמש יקבל באתר שלנו לאחר עדכון הפרטים (לדוגמא: אם זה מנוי או מנהל וכו')מומלץ לראות את המדריך הספציפי לעדכון משתמשים קיימים באתר > עדכון פרטי משתמש קיים באתרלא לשכוח לעשות שמור שינויים

 

החלק האחרון זה הגדרת ההודעות של הטופס (לדוגמא: הטופס נשלח בהצלחה וכו')

ניתן לראות בתמונה שישנם מלא הדעות בשביל מלא מצבים מסויימים

נעבור כעת ונתרגם הודעה הודעה וכמובן שאפשר לשים שם טקסט בעברית

  1. Form successfully submitted - הודעה שהטופס נשלח בהצלחה.
  2. Submit failed - השליחה של הטופס נכשלה.
  3. Validation error - בעיית אימות כלשהי בדרך כלל מומלץ לשים שם הודעה גנרית שניתן לנסות עוד כמה דקות.
  4. Entered an invalid email - המשתמש הזין מייל לא תקין.
  5. Required field is empty - ישנה שדה מסויימת שהיא חובה והיא לא מולאה ע"י המשתמש.
  6. Register User specific: Passwords mismatch - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהסיסמאות שהוזנו אינם תואמות
  7. Register User specific: Username Exists - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהשם משתמש שהוא בחר כבר קיים במערכת וצריך לבחור שם חדש
  8. Register User specific: Email exists - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהמייל שהוא בחר כבר קיים במערכת וצריך להזין מייל אחר.
  9. Register User specific: Incorrect username - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהשם משתמש שהוא ניסה להכניס לא תקין/נכון.
  10. Register User specific: Empty username - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהמשתמש השאיר את השדה של השם משתמש ריקה.
  11. Register User specific: Empty email - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהמשתמש השאיר את השדה של המייל ריקה.
  12. Register User specific: Empty password - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהמשתמש השאיר את השדה של הסיסמא ריקה.
  13. Register User specific: Logged in (appears only if register user is only notification) - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהמשתמש שמנסה ליצור משתמש חדש כבר מחובר למערכת.
  14. Captcha validation failed - הודעת שגיאה שהאימות של גוגל לא צלח.
  15. Internal server error - שגיאה פנימית של השרת שלכם.
  16. Media Specific: Max files limit - זה הודעת שגיאה לטופס שמאפשר להעלאות מדיה, שהמשתמש מנסה להעלאות מדיה גדולה מהמשקל שהגדרתם.
  17. Media Specific: Max size reached - זה הודעת שגיאה לטופס שמאפשר להעלאות מדיה, שהמשתמש הגיע למגבלה של המשקל שהצבתם בשביל העלאת מדיה.
  18. Media Specific: File type error -  זה הודעת שגיאה לטופס שמאפשר להעלאות מדיה, שהמשתמש מנסה להעלאות סוג מדיה מסויים שלא מורשה.

עריכה ועיצוב הטופס דרך אלמנטור

עריכה ועיצוב הטופס דרך אלמנטור

אחרי שסיימתם להגדיר את הטופס לצרכים שלכם כעת הגיע החלק הבא, להטמיע אותו באתר שלכם
ניכנס לדף שנרצה לשים שם את הטופס נכפס את המילה form בחיפוש ונוסיף את הוויג'ט הבא

כשנוסיף את הוויג'ט הזה יפתח לנו ההגדרות שלו

וכאן נגדיר את ההגדרות כדי להציג את הטופס שלנו

  1. Choose Provider - בחלק הזה נבחר איפה בנינו את הטופס כי יש לנו גם את הטפסים הישנים של ג'ט וגם את התוסף החדש שלהם JetFormBuilder אנחנו נבחר JetEnging
  2. Select Form - כאן אנחנו נחפש את השם שנתנו לטופס שלנו
  3. Field layout - כאן ניתן לבחור האם נרצה שהטופס יהיה בשורות אחד אחרי השני או עמודות אחד מעל השני
  4. Field label HTML tag - זה חלק של SEO אפשר להשאיר את זה על DIV אלא אם כן המקדם של האתר שלכם אמר לכם אחרת.
  5. Submit type - מה נרצה שיקרה ברגע שהמשתמש ילחץ על שלח:
    AJAX - זה לא ירענן את העמוד אחרי שליחת הטופס
    Reload - ירענן את העמוד אחרי שליחת הטופס

עכשיו נעבור לחלק של העיצוב בהסבר מלמעלה מה כל חלק מעצב

 

  • Rows - עיצוב כללי של כל אחד מהשורות בטופס.
  • Feilds - עיצוב של השדות של הטופס.
  • Checkbox & Radio Fields - עם יש לכם טופס עם צ=תיבות בחירה מרובות או תיבות בחירה יחידות כאן אתם יכולים לעצב אותם
  • Calculated Fields - עיצוב של חישוב מסויים שבניתם בתוך הטופס.
  • Range Feilds - עיצוב של שדה שקבל טווח (לדוגמא: טווח מחירים).
  • Heading - אם הוספתם כותרת באמצע הטופס שלכם, כאן ניתן לעצב אותה.
  • Repeater - עיצוב שדה רפיטר שנמצא בטופס שלכם.
  • Group Break - אם חילקתם את הטופס שלכם לקבוצות אז הוא מייצר מאין פס ביניהם ואותו ניתן לעצב.
  • Requierd mark - אם עשיתם שדה מסויימת שהיא חובה ויש לה סימון חובה (*) ניתן לעצב אותו (לדוגמא: גודל, צבע).
  • Submit - עיצוב כפתור השליחה של הטופס.
  • Next Page Button - אם חילקתם את הטופס שלכם לשלבים כאן ניתן לעצב את הכפתור שעובר לשלב הבא בטופס.
  • Prev Page Button - אם חילקתם את הטופס שלכם לשלבים כאן ניתן לעצב את הכפתור שחוזר לשלב הקודם בטופס.
  • Messages - כאן ניתן להגדיר צבעים להודעות שהטופס יציג (כגון הודעות שהטופס נשלח או שהייתה בעיה כלשהי)

תוכן עניינים

איך ליצור טופס בטפסים הישנים של ג'ט

תוכן עניינים

איך ליצור טופס בטפסים הישנים של ג'ט

0 אנשים נעזרו במדריך

הפעלת הפיצ'ר בדשבורד של JetEnging

הכנס לדשבורד של וורדפרס > JetEnging > אמור להופיע שם מלא פיצ'רים כמו בתמונה הזו

הפעילו את Forms ולחצו על Save

 

יצירת טופס חדש

יצירת הטופס 

הכנס לתפריט תחת JetEnging  בשם Forms ולחץ על הכפתור הוסף חדש(Add New)

שדות של הטופס

בשורה העליונה ניתן להכניס את השם בשביל הטופס שלך
ומתחת לזה מגיע טופס חדש עם 2 שדות שכמובן ניתן לשנות / להסיר אותם

סוגי השדות שישנם בטופס

ישנם סוגי שדות לכל נתון אשר תרצו להכניס לטפסים שלכם בוא נעבור עליהם:

  • Text נועד עבור שם פרטי, שם משפחה, וכו'
  • Textarea נועד עבור לתת למשתמשים להשאיר הודעה וכדומה
  • Hidden נועד עבור הוספת ID לטופס (שימושי בדרך כלל לעדכון של משהו)
  • Select — Checkbox — Radio נועד עבור להוסיף לטופס שלכם אפשרויות בחירה
  • Number נועד עבור הוספת ערך מספרי כגון בחירת כמות של משהו
  • Date/Time.
  • Media נועד עבור לתת אופציה למשתמשים לשלוח קבצים
  • WYISWYG נועד עבור הוספת טקסט אבל עם אופציה של לעצב את הטקסט
  • Range נועד עבור בחירת טווח מסויים לדוגמא טווח מחירים
  • Heading שנועד עבור אם תרצו להוסיף כותרת מסויימת בתוך הטופס שלכם

ניתן ללמוד עוד על סוגי השדות של הטפסים של ג'ט במדריך > סוגי השדות בטפסים הישנים של ג'ט

 

חשוב לדעת!!!
שמתי שיוצרים שדה מסויים בתת ההגדרות השדה Name חייב להכיל אך ורק אותיות קטנות באנגלית, או מספרים, או מקף(-)
לא אותיות גדולות או רווחים זה יכול ליצור לכם תקלות תזכרו

חילוק הטופס לחלקים וכן שאיבת נתונים מוגדרים מראש

Add Page Break זהו כפתור שמופיע ליד הכפתור של הוספת שדה חדש כמו שמופיע בתמונה

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

ככה מעצבים את זה

  • ב-Label ניתן להוסיף את השם של הכפתור שיופיע למשתמש בסוף אותו החלק של הטופס (לצורך הדוגמא: הבא)
  • ב-Disabled message זה החלק שניתן להוסיף הודעה שתוצג למשתמש כל עוד הוא לא מילא את כל הפרטים (לדוגמא: עוד לא מלאו כל הפרטים בשביל לעבור לשלב הבא)
  • ב-Custom CSS ניתן להוסיף עיצוב אישי דרך CSS

ב-שאיבת נתונים מוגדרים מראש זה נועד בשביל טפסים שאמורים לשנות נתונים שקיימים כבר במערכת לדוגמא: עריכת פרטי משתמש, עריכת פוסט קיים וכו'

כמו שניתן לראות אם אנו מפעילים את האופציה הזו נפתח לנו חלון קטן של הגדרות

החלק הבא הוא חלק חשוב(כי זה החלק שאנחנו שואבים נתונים מהדטא בייס שלנו)

  • Source אנחנו מגדירים מה אנחנו רוצים לשנות כעת אנחנו נדבר רק עם פוסטים ומשתמשים במדריכים אחרים ניגע בשאר האופציות
    אנחנו בחורים משתמשים אם אנחנו רוצים לתת אופציה של שינוי נתונים במשתמש
    ואפשר גם לבחור פוסטים אם נרצה לתת אופציה למשתמש לערוך פוסט קיים
  • Get post/User ID from: כאן אנו מגדירים מהיכן הוא מקבל את הנתונים בדרך כלל נשאיר את זה על האופציה של Current Post/User
    שזה אומר שהוא שואב נתונים לפי הפוסט/המשתמש הספציפי שעליו מנסים לעשות שינוי
  • Fields Map: זה החלק שאנחנו מגדירים איזה נתון יופיע באיזה שדה של הטופס שלנו
    לדוגמא: אם נבנה טופס לשינוי פרטים של משתמש, אז אנחנו נרצה שכשהמשתמש ילחץ על הכפתור לשינוי פרטים יופיע לו הטופס עם הפרטים שלו והוא יוכל לשנות אותם ואנחנו נרצה להזין לשם את הפרטים שכבר שמורים אצלנו בדטא בייס
    אז אנחנו נגדיר שהשם הפרטי של המשתמש יופיע בשדה שנקרא לה שם פרטי

כמו שניתן לראות בתמונה בחרתי שיופיע השם הפרטי של המשתמש בשדה של first-name בטופס שיצרתי

 

הגדרת התראות

והגענו לחלק האחרון של הטפסים שהוא החלק שבוא אנחנו מגדירים מה קורה אחרי שהמשתמש לוחץ על שלח/עדכון

ישנם כמה וכמה אופציות מה יקרה ברגע שהמשתמש ילחץ על שלח

  1. Send Email - המוכר והידוע כמו כל טופס אחר בשניה שהמשתמש ילחץ על שלח ישלח מייל למייל שנגדיר מראש עם כל הפרטים של אותו הטופס ישנם כמה תתי הגדרות בכל אחד להלן:
    · Mail to: כאן אנו מגדירים למי ישלח המייל:
    1. Admin mail הכוונה למנהל האתר ישלח המייל
    2. Email from submitted form field שאיבת מייל דינאמי מתוך שדה שנמצא בתוך הטופס עצמו, אם נבחר באופציה זו יפתח לנו
    אופציה תחת לזה בשם Form Field ששם אנחנו נבחר את השדה הרצויה מהטופס לשאיבת המייל שאליו נשלח את ההודעה
    3. Custom email מייל ייחודי לטופס הזה אלו
    · Replay to: ישנה אופציה לעשות תשובה אוטוטית אחרי שנשלח המייל וגם כאן יש לנו 3 אופציות לבחירה
    1. Not selected הכוונה שהוא לא יגיב על המייל הזה
    2. Email from submitted form field שאיבת מייל דינאמי מתוך שדה שנמצא בתוך הטופס עצמו, אם נבחר באופציה זו יפתח לנו
    אופציה תחת לזה בשם Form Field ששם אנחנו נבחר את השדה הרצויה מהטופס לשאיבת המייל שאליו נשלח את ההודעה
    3. Custom email מייל ייחודי לטופס הזה אלו
    · Subject: זהו החלק שאנחנו כותבים מה יהיה הנושא של המייל (לדוגמא: ליד חדש מאתר devdes.co.il)· From Name: כאן אנחנו
    מגדירים ממי המייל הזה (לדוגמא: מייל מאתר DevDes)
    · From Email Address: כאן אנחנו מגדירים מאיזה מייל הגיע המייל הזה (לדוגמא: [email protected])
    · Content type: אין צורן לגעת בשדה זה
    · Content: החלק הכי חשוב זה גוף המייל ניתן לראות בתמונה המצורפת שישנם Available macros 
    שאלו הנתונים שנשאבים מהטופס שהם זמינים לשליחה דרך המייל כמו שניתן לראות בתמונה
    ניתן לראות שיש לי אופציה להוסיף את %post_id% , %first-name% אלו קיצור של הנתונים שהמשתמש הכניס בתוך אותם שורות
    בטופס
  2. Insert/Update Post - את אופציה זו נפעיל אם נרצה להעלאות פוסט חדש או לעדכן פוסט קיים וגם פה יש לנו כמה הגדרות
    1. Post Type: להיכן הפוסט הזה שייך ניתן לנו אופציה לבחור כמו בתמונה

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

    3. Fields Map: כאן אנו נגדיר להיכן יכנס כל חלק שבטופס לפוסט החדש (לדוגמא: כותרת הפוסט תכנס לכותרת של הפוסט)כמובן חשוב בסוף לעשות שמירהמומלץ לראות את המדריך הספציפי ליצירת פוסטים חדשים באתר > להעלאות פוסט חדש / עדכן פוסט קיים
  3. Register New User - את האופציה הזו נפעיל אם נרצה ליצור טפסים ליצירת משתמש חדש באתר וגם כאן ישנם כמה הדרות חשובות
    1. Allow creating new users by existing users - אני אישית לא הייתי מאשר את זה סביר להניח שזה יכול לגרום לצרות
    2. Fields Map: מיפוי הפרטים של המשתמש בדטא בייס שלנו ישנם כמה שדות שלא יכולים להישאר ריקים בוא נעיף מבט בתמונה ונבין
    כל שדה

    כתוב לנו שהשדות: User Login, Email, Password לא יכולים להיות ריקים, לכן אנחנו נזין להם את הנתונים הבאים
    בשדות User Login ו- Email נזין את האימייל שקיבלנו בטופס
    ובשדות Password ו- Confirm Password נזין את הסיסמא שקיבלנו בטופס
    כל שאר השדות הם רשות אבל כמובן שאנחנו ננסה להזין כמה שיותר פרטים על המשתמשים שלנובתמונה הבאה ישנם עוד כמה דברים שנצטרך להגדיר,3. User Rule - בשדה זה נגדיר איזה תפקיד המשתמש יקבל באתר שלנו (לדוגמא: אם זה מנוי או מנהל וכו')
    4. User Meta - אם הוספנו שדות מיוחדים למשתמש אנו נרצה להזין את הנתונים שביקשנו בטופס לדטא בייס שלנו (לדוגמא: נניח והספנו
    מספר פלאפון לכל משתמש זה משהו ייחודי שאנחנו הוספנו ואנחנו נצטרך להגדיר ידנית לאיזה שדה להכניס את הנתון הזה
    5. Log In User after Register: בחירה שלנו האם לחבר את המשתמש אחרי שהוא נרשם או לאמומלץ לראות את המדריך הספציפי ליצירת משתמשים חדשים באתר > יצירת משתמש חדש באתר
  4. Update User - עדכון פרטים של משתמש קיים בחלק הזה אין לנו הרבה פרטים להכניס
    נעיף מבט בתמונה ונעבוד לפיה1. Fields Map: מיפוי של הפרטים החדשים שהמשתמש הזין בטופס לתוך הדטא בייס שלנו (לדוגמא: שינוי שם וכדומה)
    2. User Rule - בשדה זה נגדיר איזה תפקיד המשתמש יקבל באתר שלנו לאחר עדכון הפרטים (לדוגמא: אם זה מנוי או מנהל וכו')מומלץ לראות את המדריך הספציפי לעדכון משתמשים קיימים באתר > עדכון פרטי משתמש קיים באתרלא לשכוח לעשות שמור שינויים

 

החלק האחרון זה הגדרת ההודעות של הטופס (לדוגמא: הטופס נשלח בהצלחה וכו')

ניתן לראות בתמונה שישנם מלא הדעות בשביל מלא מצבים מסויימים

נעבור כעת ונתרגם הודעה הודעה וכמובן שאפשר לשים שם טקסט בעברית

  1. Form successfully submitted - הודעה שהטופס נשלח בהצלחה.
  2. Submit failed - השליחה של הטופס נכשלה.
  3. Validation error - בעיית אימות כלשהי בדרך כלל מומלץ לשים שם הודעה גנרית שניתן לנסות עוד כמה דקות.
  4. Entered an invalid email - המשתמש הזין מייל לא תקין.
  5. Required field is empty - ישנה שדה מסויימת שהיא חובה והיא לא מולאה ע"י המשתמש.
  6. Register User specific: Passwords mismatch - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהסיסמאות שהוזנו אינם תואמות
  7. Register User specific: Username Exists - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהשם משתמש שהוא בחר כבר קיים במערכת וצריך לבחור שם חדש
  8. Register User specific: Email exists - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהמייל שהוא בחר כבר קיים במערכת וצריך להזין מייל אחר.
  9. Register User specific: Incorrect username - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהשם משתמש שהוא ניסה להכניס לא תקין/נכון.
  10. Register User specific: Empty username - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהמשתמש השאיר את השדה של השם משתמש ריקה.
  11. Register User specific: Empty email - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהמשתמש השאיר את השדה של המייל ריקה.
  12. Register User specific: Empty password - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהמשתמש השאיר את השדה של הסיסמא ריקה.
  13. Register User specific: Logged in (appears only if register user is only notification) - זה הודעת שגיאה לטופס שמנסה ליצור משתמש חדש, שהמשתמש שמנסה ליצור משתמש חדש כבר מחובר למערכת.
  14. Captcha validation failed - הודעת שגיאה שהאימות של גוגל לא צלח.
  15. Internal server error - שגיאה פנימית של השרת שלכם.
  16. Media Specific: Max files limit - זה הודעת שגיאה לטופס שמאפשר להעלאות מדיה, שהמשתמש מנסה להעלאות מדיה גדולה מהמשקל שהגדרתם.
  17. Media Specific: Max size reached - זה הודעת שגיאה לטופס שמאפשר להעלאות מדיה, שהמשתמש הגיע למגבלה של המשקל שהצבתם בשביל העלאת מדיה.
  18. Media Specific: File type error -  זה הודעת שגיאה לטופס שמאפשר להעלאות מדיה, שהמשתמש מנסה להעלאות סוג מדיה מסויים שלא מורשה.

עריכה ועיצוב הטופס דרך אלמנטור

עריכה ועיצוב הטופס דרך אלמנטור

אחרי שסיימתם להגדיר את הטופס לצרכים שלכם כעת הגיע החלק הבא, להטמיע אותו באתר שלכם
ניכנס לדף שנרצה לשים שם את הטופס נכפס את המילה form בחיפוש ונוסיף את הוויג'ט הבא

כשנוסיף את הוויג'ט הזה יפתח לנו ההגדרות שלו

וכאן נגדיר את ההגדרות כדי להציג את הטופס שלנו

  1. Choose Provider - בחלק הזה נבחר איפה בנינו את הטופס כי יש לנו גם את הטפסים הישנים של ג'ט וגם את התוסף החדש שלהם JetFormBuilder אנחנו נבחר JetEnging
  2. Select Form - כאן אנחנו נחפש את השם שנתנו לטופס שלנו
  3. Field layout - כאן ניתן לבחור האם נרצה שהטופס יהיה בשורות אחד אחרי השני או עמודות אחד מעל השני
  4. Field label HTML tag - זה חלק של SEO אפשר להשאיר את זה על DIV אלא אם כן המקדם של האתר שלכם אמר לכם אחרת.
  5. Submit type - מה נרצה שיקרה ברגע שהמשתמש ילחץ על שלח:
    AJAX - זה לא ירענן את העמוד אחרי שליחת הטופס
    Reload - ירענן את העמוד אחרי שליחת הטופס

עכשיו נעבור לחלק של העיצוב בהסבר מלמעלה מה כל חלק מעצב

 

  • Rows - עיצוב כללי של כל אחד מהשורות בטופס.
  • Feilds - עיצוב של השדות של הטופס.
  • Checkbox & Radio Fields - עם יש לכם טופס עם צ=תיבות בחירה מרובות או תיבות בחירה יחידות כאן אתם יכולים לעצב אותם
  • Calculated Fields - עיצוב של חישוב מסויים שבניתם בתוך הטופס.
  • Range Feilds - עיצוב של שדה שקבל טווח (לדוגמא: טווח מחירים).
  • Heading - אם הוספתם כותרת באמצע הטופס שלכם, כאן ניתן לעצב אותה.
  • Repeater - עיצוב שדה רפיטר שנמצא בטופס שלכם.
  • Group Break - אם חילקתם את הטופס שלכם לקבוצות אז הוא מייצר מאין פס ביניהם ואותו ניתן לעצב.
  • Requierd mark - אם עשיתם שדה מסויימת שהיא חובה ויש לה סימון חובה (*) ניתן לעצב אותו (לדוגמא: גודל, צבע).
  • Submit - עיצוב כפתור השליחה של הטופס.
  • Next Page Button - אם חילקתם את הטופס שלכם לשלבים כאן ניתן לעצב את הכפתור שעובר לשלב הבא בטופס.
  • Prev Page Button - אם חילקתם את הטופס שלכם לשלבים כאן ניתן לעצב את הכפתור שחוזר לשלב הקודם בטופס.
  • Messages - כאן ניתן להגדיר צבעים להודעות שהטופס יציג (כגון הודעות שהטופס נשלח או שהייתה בעיה כלשהי)
המדריך עזר לך?