שם השיעור: דף החנות – חלק 1
אין לכם גישה לתוכן זה
לקבלת גישה לשיעור זה, יש לבחור מסלול מתאים ולהירשם תחילה
תוכן הקורס
מודול: דף הבית
- סקשן מוצרים חדשים (28:43)
- סקשן השירותים שלנו (27:43)
- סקשן אודותינו (27:52)
- סקשן טיפים ומאמרים (28:03)
- סיום Footer ודף הבית בדסקטופ (27:39)
- בניית Header (27:18)
- בניית Hero Section (27:48)
- בניית כרטיס מוצר (27:09)
- סקשן מבצע קיץ ולמה אנחנו (28:45)
- התאמה למובייל של דף הבית (27:07)
מודול: הגדרות כלליות
- הגדרות שרת ויצירת אפליקציה (37:56)
- הגדרות גלובליות (27:18)
מודול: התאמה למובייל
- התאמה למובייל (36:28)
- התאמה למובייל חלק 2 (25:26)
- התאמה למובייל חלק 3 (26:20)
מודול: עמודי האתר
- התאמה למובייל של דף הבית (27:07)
- דף מאמר בודד (26:55)
- דף שאלות נפוצות (25:55)
- דף אודות (27:05)
- דף יצירת קשר (26:17)
- דפים כלליים (26:05)
- דף ארכיון השירותים שלנו (27:10)
- דף שירות בודד (26:34)
- דף בלוג ודף תוצאות חיפוש (27:11)
מודול: עמודי ווקומרס והרחבה נוספת
- הסרת דף עגלה ושימוש בעגלה צפה (27:48)
- דף תשלום ותודה לאחר תשלום (25:52)
- דף אזור אישי (27:07)
- חיבורי לינקים (26:24)
- הגדרות ווקומרס (27:27)
- דף החנות – חלק 1 (28:21)
- דף החנות – חלק 2 (28:14)
- דף המוצר – חלק 1 (28:25)
- דף המוצר – חלק 2 (27:49)
- הזמנות, לקוחות, דוחות ושיווק (26:46)
נו..? איך היה השיעור?
אחח חבל.. אם היית מנוי - היית יכול ללמוד ולדרג את השיעור!
מה נלמד בשיעור הזה?
- נבצע עדכון לוורדפרס
- נשכפל את הHeader כדי להציג את השקוף בדף הבית ואת האחד עם הרקע הכחול כהה בשאר הדפים. נבצע את ההתניה בעזרת מודול Dynamic Visibility
- נבין את כוחו של המודול הזה לעומת פיטשר "רספונסיביות" של אלמנטור שלא מסתיר את האלמנטים מהDOM
- נפנה לבניית דף החנות
- נתחיל את בניית כרטיס המוצר
וקצת יותר בפירוט...
שלב ראשון בבניית דף החנות כולל עדכון למערכת וורדפרס, צעד חשוב שמבטיח יציבות, אבטחה, ותמיכה בפיצ'רים המתקדמים של התוספים והכלים שבהם נעשה שימוש. לאחר עדכון זה, נעבור לשלב התאמת ה-Header עבור האתר. כאן נשכפל את ה-Header כדי להציג גרסה שקופה בדף הבית, וגרסה נוספת עם רקע כחול כהה לשאר הדפים. השימוש במודול Dynamic Visibility יאפשר לנו לבצע את ההתניה הזו בצורה חכמה ויעילה, כך שהמעבר בין הגרסאות יתבצע אוטומטית על סמך ההקשר.
מודול Dynamic Visibility מציע גמישות רבה יותר בהשוואה לפיצ'ר "רספונסיביות" של Elementor, שכן הוא אינו משאיר את האלמנטים המוסתרים ב-DOM. עובדה זו משפרת את ביצועי האתר, במיוחד עבור אתרים מורכבים או כאלו עם תנועה רבה. לאחר הגדרת ה-Header והבנת הכלים העומדים לרשותנו, נעבור לשלב המרכזי של פרויקט זה: בניית דף החנות.
בניית דף החנות מתחילה בעיצוב כרטיס המוצר. כרטיס זה מהווה את לב הדף, ובו יוצגו פרטים חשובים כגון תמונה, שם המוצר, מחיר, וכפתור קריאה לפעולה. בשלב זה יש לשים דגש על עיצוב רספונסיבי ונקי, שמאפשר למשתמשים חוויה נעימה ואינטואיטיבית, בין אם הם גולשים מהמחשב או מהמובייל. עיצוב כרטיס המוצר מהווה בסיס לתצוגת מוצרים מקצועית ומהווה הזדמנות ליישם טכניקות עיצוב ולמידה מבניית אתרי וורדפרס, תוך שימוש באלמנטים מתקדמים שמציעים כלים כמו Elementor ו-Dynamic Visibility.