איך מקימים סיידבר ותפריט עליון באלמנטור?

איך מקימים סיידבר ותפריט עליון באלמנטור?

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

בניית אתר באמצעות מערכת וורדפרס:

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

שימוש באלמנטור לבניית אזורים שונים באתר:

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

מהו תפריט עליון ומה יהיה בו?

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

כיצד נבנה תפריט עליון באלמנטור?

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

נתחיל מהשלב הראשון:

התחברו ללוח הבקרה של האתר שלכם ובתפריט הצדדי לחצו על “עיצוב” -> “תפריטים”. כעת תוכלו לערוך את התפריט הראשי הקיים שלכם או ללחוץ על “צור תפריט חדש”. אל תפריט זה הוסיפו את העמודים הראשיים שאתם רוצים וסדרו אותם בהתאם לצורך שלכם. שימו לב שתוכלו גם לשלב עמודים כתת קטגוריה לעמודים אחרים ובכך יצא לכם בעריכה תפריט נפתח. לאחר שבחרתם את העמודים הרצויים וסידרתם אותם בסדר שאתם רוצים – תגללו למטה וסמנו בV את האופציה main menu או primary navigation תלוי מה מופיע לכם. לבסוף לחצו על שמור. מומלץ גם לתת שם לתפריט שיצרתם כי תכף תצטרכו לבחור אותו באלמנטור ולכן כדאי לדאוג לזה כבר עכשיו.

עיצוב תפריטים

יצירת תפריט

בשלב השני:

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

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

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

בניית HEADER

מהו סיידבר ומה נרצה שיהיה בו?

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

כיצד נבנה סיידבר באלמנטור?

היכנסו ללוח הבקרה של האתר שלכם ותחת טמפלטים -> הוספת חדש – נגדיר שאנו רוצים “עמוד יחיד” וניתן לו שם “סיידבר”. כעת כשניצור את העמוד נוכל לבחור בתבנית מוכנה שאלמנטור פרו מאפשר לנו בלוק מעוצב מוכן עם 2 עמודות – אחת לתוכן ואחת לסיידבר. נבחר אחת מהן או ניצור בעצמנו מאפס. במידה ובחרנו עיצוב מוכן עם עליית העמוד לאחר היצירה שלו נוכל לראות שאזור הסיידר כולל אלמנט סיידר שאם יצרנו באזור הווידג’טים של וורדפרס (עיצוב -> ווידג’טים) סיידר אז נוכל פשוט לבחור אותו כאן והוא יופיע לנו עם כל האלמנטים שכבר יצרנו. במידה ואין לנו אחד כזה פשוט נמחק את האלמנט הזה ונתחיל להוסיף לעמוד זו אלמנטים שונים מסרגל האלמנטים שאנו רוצים שיופיעו שם. לדוגמה: פוסטים אחרונים. נגדיר את המאפיינים כך שיוצגו בצורה יפה ואסתטית בסיידבר שלנו ונמשיך להוספה של אלמנטים שונים בעמודה. לאחר שסיימנו לעצב את התפריט הצדדי נפרסם את העמוד ונגדיר היכן אנו רוצים שהסיידבר יופיע (כל עמודי האתר, רק עמודים, רק פוסטים וכו’). לעתים תרצו ליצור יותר מתפריט צדדי אחד לאזורים שונים באתר.

טמפלטים