אין לכם גישה לתוכן זה
לקבלת גישה לשיעור זה, יש לבחור מסלול מתאים ולהירשם תחילה
תוכן הקורס
מודול: הגדרות כלליות
מודול: דף הבית
מודול: עמודי ווקומרס והרחבה נוספת
מודול: עמודי האתר
מודול: התאמה למובייל
מה נלמד בשיעור הזה?
- נתחיל בבניית הHeader
- נעלה את אייקון העגלה בSVG ונתאים אותו בתוך הקוד על ידי הגדרת הfill שיהיה עם ערך של Currentcolor (שיקבל את הצבע שלו מתוך אלמנטור ולא שיהיה מוגדר מראש)
- נבנה תפריט דמו שילווה אותנו בכל תהליך הפיתוח
- את אותה פעולה של שינוי קוד הSVG של אייקון העגלה נבצע גם באייקון האזור האישי ונבין שכיוון שהאייקון משתמש בstroke במקום בfill אז נדרשת התערבות של CSS ונבצע אותה
וקצת יותר בפירוט...
בשיעור זה נתחיל בבניית ה-Header, האלמנט המרכזי שמוביל את עיצוב האתר. תחילה, נעלה אייקון עגלה בפורמט **SVG** ונבצע התאמה מדויקת בקוד. ההתאמה כוללת שימוש במאפיין fill עם הערך Currentcolor, פעולה שמאפשרת לאייקון לקבל את צבעו באופן דינמי מתוך אלמנטור, במקום להיות מוגדר בצבע קבוע. גישה זו מעניקה גמישות עיצובית ומשפרת את הדינמיות של האתר.
בהמשך, ניצור **תפריט דמו** שישמש כבסיס פונקציונלי לדפי האתר במהלך הפיתוח. נבצע את אותה התאמה דינמית גם באייקון האזור האישי, תוך הבנה מעמיקה של ההבדלים בין שימוש במאפיינים stroke ו-fill באייקונים. במקרים שבהם נדרשת התאמה נוספת, נשתמש ב-CSS מתקדם כדי ליישר את העיצוב לדרישות הפרויקט.
שיעור זה מעניק ידע מעשי בעבודה עם אייקוני SVG, יצירת עיצובים דינמיים ושימוש מתקדם ב-CSS. המטרה היא להקנות מיומנויות לפיתוח ממשק משתמש אלגנטי ומקצועי, המשלב אסתטיקה ופונקציונליות.