מדריך מדריך להכנת סוג פוסט מיוחד נדלן - חלק ג'

[תמנתי ווב דיזיין]

ADVANCED CUSTOM FIELDS​

יצירת שדות מיוחדים ACF

כדי ליצור דינמיות אנחנו צריכים להגדיר לסוג הפוסט CPT שלנו שדות מיוחדים ACF בהתאם למה שעיצבנו. שדות מיוחדים אנחנו יוצרים עם התוסף ACF שהתקנו מקודם.


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

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



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

הגדרות ACF

נעבור על כל ההגדרות לפני שנתחיל ליצור שדות.

סגנון – באפשרות הזו אנחנו משאירים את האופציה של ברירת המחדל. אין עניין לשנות את זה.

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

מיקום תוית – פה נבחר איפה תהיה התווית שלנו ממוקמת. האם היא תהיה ממוקמת מעל השדה או לצד השדה.

מיקום הוראות – גם פה נוכל לבחור אם מיקום ההוראות יהיו מיד מתחת לתוית או מתחת לשדה.


מיקום – נוכל לבחור את הסדר שבו יופיעו השדות. ככל שהמספר יותר נמוך מיקום השדות יהיה יותר גבוה.

תיאור – אופציונלי אם אנחנו רוצים לתת תיאור לקבוצת השדות. זה נוח כשיש לנו כמה קבוצות של שדות כדי שנזכור עבור מה יצרנו כל קבוצת שדות.

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

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

יצירת השדות ACF

נתחיל ביצירת השדות לפי העיצוב שיצרנו מקודם באלמנטור.

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

סוגי שדות

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

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

ערך ברירת מחדל – פה ניתן להגדיר את ערך ברירת המחדל של השדה.

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

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

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

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

תנאי לוגי – ניתן ליצור תנאים לוגיים של הופעה או העלמות של שדות מיוחדים כשמצבים מסויימים קורים. נאמר שיש לי באתר גם שדה כתובת וגם שדה עיר. אני רוצה ששדה העיר יופיע רק כששדה הכתובת לא ריק. אם ממלאים כתובת ימלאו עיר אבל אם לא ממלאים כתובת ששדה העיר לא יופיע בכלל. אז ניצור שדה עיר ונסמן לו בתנאי לוגי, שאם בשדה הכתובת יש ערך has any value אז השדה יוצג. מה שיקרה זה שהלקוח לא יראה בכלל את השדה של העיר עד שהוא לא יתחיל להקליד משהו בשדה של הכתובת.



מאפייני עוטף – פה נוכל להגדיר לשדה כמה שטח הוא ייקח עם שאר השדות. אם נרצה שכמה שדות יופיעו אחד ליד השני, נוכל להגדיר לשדה שיהיה 25% או 50% לפי הצורך.

נתחיל ליצור שדות

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

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



עכשיו נוכל להתחיל ליצור שדות מתאימים לפרטי הנכס.

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



את השאר נשאיר ללא שינוי חוץ מהעוטף, שפה אני רוצה להגדיר לשדה שיהיה 25% ברוחב כדי שיהיו לפחות 4 שדות בשורה אחת. אחרי שסיימנו נסגור את השדה.

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


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

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

סוג הנכס - השדה הבא יהיה שדה סוג הנכס. נפתח שדה חדש, נגדיר לו תוית סוג הנכס ונגדיר שיהיה משדה מסוג סלקט select כי אנחנו לא רוצים שהלקוח ירשום לבד את סוג הנכס. אנחנו רוצים לשמור על התאמת טקסטים בין כל הנכסים. נגדיר למשל דירה, דירת גן, דירת גג, דירת יוקרה, וילות ובתים, קוטג' / דו משפחתי, יחידת דיור, פנטהאוז, מיני פנטהאוז, דופלקס. נגדיר אותו שיהיה חובה. בערך ברירת המחדל נוכל לכתוב "לחץ כאן כדי לבחור את סוג הנכס..." כדי שלא תופיע ברירת מחדל אחרת.



נסמן שיהיה ממשק משתמש מסוגנן ונסמן גם את AJAX. מה שה AJAX עושה זה שכשמתחילים לכתוב הוא מוצא אוטומטית את הטקסט הרלוונטי. נגדיר גם את זה 25%.



ככה נראים השדות שלנו עד כה.



מספר חדרים - השדה הבא יהיה שדה מספר חדרים. נפתח שדה חדש, נגדיר לו תוית מספר חדרים, נבחר בשדה מסוג מספר ונגדיר אותו שיהיה חובה. במציין הטקסט נוכל לרשום "הקלד מספר חדרים כאן..." ונגדיר גם את השדה הזה ברוחב 25%.

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

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

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

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

נגדיר גם את השדה הזה ברוחב 25%.

פרטים נוספים

עכשיו נעבור לסדר את החלק שנקרא פרטים נוספים. הוא קצת יותר מורכב ממה שעשינו עד כה.



אז דבר ראשון בואו ניצור שדה חדש מסוג לשונית ונקרא לו פרטים נוספים. זה יעשה לנו קצת סדר בשדות. אם נרצה שהלשונית לא תהיה מסוג טאב אלא תוצג בנפרד למטה, נסמן ללשונית שתהיה מסוג endpoint – לשונית קצה ואז הם ישבו אחד מתחת לשני.



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

אז איך עושים את זה?

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



עכשיו צריך ליצור דינמיות לכל השדות. כדי לעשות זאת נתחיל מיצירת פוסט יחיד.