מבוא לסקשנים
כל חתך אופקי הוא Section – כך, אלו הם הקופסאות הירוקות שאנחנו רואים ב-Builder.
יש כל מיני סקשנים אופייניים, בין היתר סקשנים של טקסט, קופסאות על סוגיהן, תמונות וגלריות, לקוחות, המלצות, קריאות לפעולה, טפסים וציטוטי אווירה, מספרים רצים, סרטונים משובצים, פוסטים ומוצרים.
מימוש לא נכון של סקשן אומר שצריך לבנות אותו מחדש, וזה בזבוז משאבים ומאמצים מיותר לחלוטין.
חשוב! טעויות להימנע מהן: מרווחים מובנים וקוד CSS מובנה
בסקשנים לעולם לא נשתמש ב-Section Padding, כל מרווח יתווסף רק באמצעות אלמנט Divider כדי שיהיה קל לראות, וקל לערוך מרווחים, וכדי שניתן יהיה לבצע התאמות לסלולר למרווחים.
כמו כן, לעולם לא נכתוב קוד CSS מובנה (inline), גם בגלל שלא ניתן להתאימו לסלולר, גם בגלל שקשה למצוא היכן הוא שובץ, וגם בגלל שאנחנו רוצים לרכז את כל התאמות ה-CSS באזור ה-Custom CSS.
מימוש סקשן
השלבים במימוש סקשן הם הבאים:
- טעינה של מבנה בסיס לסקשן מתוך הקטלוג לחסכון בזמן.
- בחירה אם להגדיל את הסקשן לרוחב מלא (Full Width, עם אופציה ל-70%,80%,90%) או להישאר בתוך ה-GRID של האתר.
- הגדרה של הרקע ומימוש הרקע (שילוב פרלקס לפי בחירה)
- בנייה של האלמנטים והתוכן של הסקשן עצמו
- התאמות רספונסיביות
סקשני טקסט
קופסאות
תמונות וגלריות
לקוחות / ספקים
לקוחות וספקים תמיד ישובצו ע"י מודול הלקוחות (Clients) – ע"י שיבוץ לוגואים. ניתן להציג אותם בתצורה של סליידר לוגואים (שינוי פרמטרים מפורט כאן) או בתצורת GRID.
המלצות
המלצות תמיד ישובצו ע"י מודול ההמלצות (Testimonials) – ע"י הוספת הלקוחות וההמלצות שלהם. כאן ניתן להגדיר סליידר מתחלף או לחלופין המלצות רצות (אפשר ב-2 עמודות או ב-3 עמודות).
קריאות לפעולה, טפסים וציטוטי אווירה
מספרים רצים
סרטונים משובצים
פוסטים ומוצרים (בלוג / חנות)
פרלקסים וציטוטי אווירה
טפסים וקריאות לפעולה
ישנה תבנית לטפסים וקריאות לפעולה, (קריאה לפעולה – CTA). ולהלן כמה קישורים לפירוט נוסף על טפסים:
מבני אייקונים
ישנה תבנית למבנה אייקונים, כך "אייקונים", שמומלץ להשתמש בה.
למבנה של אייקונים קטנים צמודים לטקסט, כמו למשל בדף צור קשר, יש פירוט על המימוש כאן.
טקסט / תמונה
גריד תמונות / גלריה