אין לכם גישה לתוכן זה
לקבלת גישה לשיעור זה, יש לבחור מסלול מתאים ולהירשם תחילה
תוכן הקורס
מודול: בניית הדף
- סאב דומיין, התקנת אתר והגדרות (26:35)
- בניית הדף (26:04)
- דף אופציה וחיבור אל Header (25:53)
- Hero Section (30:00)
- סקשן אודות (27:51)
- סקשן מונה, השירותים שלנו ויתרונות (28:34)
- סקשן מנהל המרפאה והמחירים שלנו (28:38)
- CCT להמלצות ויצירת Listing תואם (28:35)
- סקשן שאלות ותשובות (28:02)
- Footer (30:46)
- לימוד Image Accordion (28:09)
- סקשן המחירים (27:43)
- יצירת מפה דינמית (28:35)
- מערכת קביעת פגישות חלק 1 (28:28)
- מערכת קביעת פגישות חלק 2 (28:27)
- חיבורי לינקים והקמת דפים כלליים (30:44)
- התאמה למובייל חלק 1 (27:35)
- התאמה למובייל חלק 2 (28:15)
- בדיקת ושיפור ביצועים (28:45)
נו..? איך היה השיעור?
אחח חבל.. אם היית מנוי - היית יכול ללמוד ולדרג את השיעור!
מה נלמד בשיעור הזה?
- נייצר CCT של "הסניפים שלנו" עבור המפה הדינמית כולל יצירת שדה מטא מסוג "Map"
- נגדיר את המפה דרך שימוש בLeaflet כספק מפה ובOpenstreet Map ומקודד מיקומים
- נראה איך לייצר פוסטים בCCT ולהוסיף להם מיקומים דרך השדה הייחודי
- נייצר ליסטינג מתאים ונחבר אותו בהתאם
- נחבר את הכל אל הווידג'ט Map Listing בדף הנחיתה ונתאים את הסטיילינג שלו
- נראה דוגמא לשימוש במפה דינמית באתר של עזרום
וקצת יותר בפירוט...
בשיעור "יצירת מפה דינמית" בקורס בניית דף הנחיתה של מרפאת "דנטליס", התלמידים לומדים כיצד לשלב מפות אינטראקטיביות שמציגות נתוני מיקום דינמיים. תחילה, יוצרים CCT (Custom Content Type) חדש בשם "הסניפים שלנו", הכולל שדה מטא ייחודי מסוג "Map". שדה זה מאפשר להגדיר בקלות מיקומים מדויקים עבור כל סניף, ומספק גמישות מרבית בתצוגת נתוני המפה.
המפה מוגדרת באמצעות Leaflet כספק מפה, בשילוב OpenStreetMap, המספקת פתרון אמין ויעיל להצגת מיקומים. כחלק מהשיעור, התלמידים מתנסים בקידוד מיקומים בצורה ידידותית, כך שניתן להוסיף נתונים גיאוגרפיים בקלות לכל פוסט ב-CCT. היכולת להוסיף ולנהל מיקומים ישירות מתוך לוח הבקרה של וורדפרס הופכת את המערכת לדינמית ונוחה לשימוש.
לאחר הכנסת המידע, יוצרים ליסטינג שמותאם אישית ומחברים אותו למפה באמצעות הווידג'ט Map Listing. חיבור זה מאפשר להציג את המיקומים בצורה מאורגנת ואינטראקטיבית בדף הנחיתה. בנוסף, מתבצעת התאמת סטיילינג באמצעות CSS על מנת להבטיח שהמפה תשתלב באופן הרמוני עם העיצוב הכללי של האתר, תוך שימת דגש על אסתטיקה ונגישות.
כדי להדגים את הפוטנציאל של מפות דינמיות, מוצגת דוגמה חיה מהאתר של עזרום, הממחישה כיצד אלמנט זה יכול לשפר את חוויית המשתמש ולספק מידע שימושי בצורה אטרקטיבית. שיעור זה מעניק למשתתפים כלים מתקדמים לעיצוב וניהול של מפות דינמיות, המותאמות אישית לצרכים של אתרי וורדפרס, ומאפשר להם להציע פתרונות עיצוביים וטכניים מתקדמים עבור פרויקטים עתידיים.