יצירת אזור עליון באתר (Header) והתאמה למובייל – חלק 2
נכתב ע"י יוחאי ירמיהו5 שאלות
תיאור קצר לשיעור: בשיעור הזה נלמד איך אפשר ליצור ולהגדיר את החלק העליון של האתר (Header) באמצעות בונה התבנית של אלמנטור.
אורך השיעור: 12:45 דקות
קורסים המכילים את השיעור וידאו:
תוכן השיעור:
תוכן ראשוני שיופיע בעמוד
כותרת ברמה 1
תוכן משני שיופיע בתוך העמוד
הצטרפו לקהילות המובילות של בוני האתרים בישראל
זה הזמן להצטרף לקהילה שלנו ולקבל סיוע ותמיכה בקבוצות המובילות בארץ לבוני אתרים בוורדפרס (-:
קורסים מקיפים ומומלצים ללימוד בניית אתרים
לבנות אתר ב-10 ימים
קורס מזורז שילמד אותך לבנות אתרים ב-10 ימים. נקודת כניסה מעולה לתחום של בניית אתרים במחיר משתלם.
- לבנות אתר ב-10 ימים 56 שיעורים שילמדו אותך הכל על בניית אתרים
- בונוס 1: לבנות אתר מתבנית מוכנה לאנשים עסוקים שלא רוצים להשקיע 10 ימים
- בונוס 2: גיבוי, שחזור, ותחזוקה לאתר איך לבצע גיבויים ולתחזק אתר ללא תקלות
- בונוס 3: אלמנטור קונטיינר (Container) איך ליצור תוכן באמצעות אלמנטור קונטיינר
- בונוס 4: אחסון אתרים ב-Cloudways אחסון אתרים על גבי חברות השרתים המובילות בעולם
- בונוס 5: קלאודפלייר + מייל עסקי בחינם איך להשתמש בקלאודפלייר + יצירת מייל עסקי בחינם
- בונוס 6: לעבור אחסון ולהישאר בחיים איך להעביר אתר מאחסון אחד לאחר ללא תקלות
- בונוס 7: יצירה וניהול של רשימות תפוצה ברב מסר איך ליצור סדרות מיילים ואוטומציות שיכניסו כסף על אוטומט
- תמיכה לשנה לשאלות בעמודי השיעורים
- גישה לקבוצת הפייסבוק
- גישה לכל החיים
- תעודה הכשרה בסיום הלימודים (קובץ PDF)
- גישה לעדכונים ושיעורים חדשים
- 100% החזר כספי ל-14 ימים
רכשו את הקורס 1076 סטודנטים לפניך (-:
מסלול וורדפרס Expert
למעלה מ-10 קורסים מלאים ומעל 700 שיעורים שילמדו אותך הכל על בניית אתרים ברמה הגבוהה ביותר בארץ.- בניית אתר ב-10 ימים איך לבנות אתר במהירות שיא
- וורדפרס Beginner לימוד בניית אתרים למתחילים – (2,250 ₪)
- וורדפרס Tool Kit הצעת מחיר + אפיון + צ'ק ליסט + התנהלות עם לקוחות
- וורדפרס Next Level מחיר 2,500 ₪
- וורדפרס SEO התאמת אתרים לגוגל – (750 ₪)
- : אלמנטור Ninja הקורס שיהפוך אותך לנינג'ה באלמנטור – (999 ₪)
- אלמנטור PRO + אנימציות יצירת אתרים מורכבים ואנימציה – (550 ₪)
- וורדפרס Rocket שיפור מהירות לאתר – (999 ₪)
- וורדפרס Security חיזוק אבטחה לאתר – (750 ₪)
- וורדפרס Global בניית אתרים דו לשוניים בכל השפות – (750 ₪)
- בונוס 1: גיבוי, שחזור, ותחזוקה לאתר תחזוקת אתרים ומניעת בעיות ותקלות
- בונוס 2: אנליטיקה ומעקב לאתר גוגל אנליטיקס, סרץ קונסול ויאנדקס מטריקה
- בונוס 3: איך לקבל יותר פניות מהאתר הוספת כפתורי יצירת קשר + שיפור המרות
- בונוס 4: קלאודפלייר + מייל עסקי בחינם שימוש בקלאודפלייר ויצירת מייל עסקי בחינם
- בונוס 5: התקנת אתר על המחשב איך להשתמש במחשב ולחסוך עלויות אחסון
- בונוס 6: Cloudways אחסון אתרים בחברות השרתים המובילות בעולם
- בונוס 7: לעבור אחסון ולהישאר בחיים איך להעביר אתר מאחסון אחד לאחר ללא תקלות
- בונוס 8: אופטימיזציה לתמונות איך להעלות תמונות שיעזרו לאתר להתקדם בגוגל
- בונוס 9: יסודות העיצוב לבוני אתרים כל מה שצריך לדעת כדי לעצב את האתר המושלם
- בונוס 10: זכויות יוצרים בדיגיטל איך להימנע מתביעה משפטית כאשר בונים אתר
- בונוס 11: 20 אלף בחודש מבניית אתרים איך למצוא לקוחות ולייצר הכנסה מבניית אתרים
- בונוס 12: משיחת מכירה לכסף בחשבון איך לשפר את התהליך מכירה ולסגור יותר עסקאות
- בונוס 13: התנהלות עם לקוחות + ניהול פרויקטים איך מתנהל פרויקט בניית אתרים כולל תחזוקה לאתר
- בונוס 14: יצירה וניהול של רשימות תפוצה ברב מסר איך ליצור סדרות מיילים ואוטומציות שיכניסו כסף על אוטומט
- 758 שיעורים למתחילים + למתקדמים
- תמיכה לשנה לשאלות בעמודי השיעורים
- גישה לקבוצת הפייסבוק של הקורס
- גישה לכל החיים
- תעודה הכשרה בסיום הקורס (קובץ PDF)
- גישה לעדכונים ושיעורים חדשים
- 100% החזר כספי ל-14 ימים
רכשו את הקורס 764 סטודנטים לפניך (-:
אם אהבתם את השיעור ואתם רוצים לשתף אותו ניתן לעשות זאת על ידי לחיצה על כפתורי השיתוף מתחת:
עוסק בתחום של פיתוח אתרים ועיצוב גרפי למעלה מ-15 שנה. נינג'ה מומחה לוורדפרס, מפתח תוספים ותבניות בהתאמה אישית והמרצה שלכם בקורס הדיגיטלי המקיף והמוביל בישראל ללימוד בניית אתרים בוורדפרס בצורה נכונה.
שאלות ותשובות לשיעור
5 שאלות
באסה, היכולת לשאול שאלות בשיעור פתוחה רק למשתמשים שרכשו את הקורס
הי,
יש לי קונטיינר- שאליו הכנסתי לוגו ותפריט.
הגדרתי את הקונטיינר כך שהפריסה תהיה מרכז-מרכז.
ב"מתקדם" הגדרתי את השולים הפנימיים: 20,90,20,30
הגדרתי את התפריט כgrow וכ"רוחב מלא", ואת הלוגו בחרתי ברוחב קבוע ע"י פיקסלים ולא אחוזים. (אגב, למה לא באחוזים? גם בגודל של מובייל וגם בגודל של דסקטופ ארצה שיראו את הלוגו באותו גודל?…)
(עשיתי ממש כמו שהיה בהדרכה שלך, למעט שאצלי האייטמים בתוך התפריט עצמו מיושרים לשמאל ולא ממורכזים, אבל זה לא משנה בשביל הבעיה שאתאר)
ולגבי הבעיה עצמה…
בתמונה מספר 1-
בצד ימין שמסומן באדום- רואים שיש מרווח. אני לא יודעת למה התפריט לא מתפרש על פני כל רוחב המסך. ובצד השמאלי שמסומן באדום- רואים שהמסגרת השחורה קטועה. כלומר יכול להיות שכמה "דחיפות" ימינה יפתרו את 2 הבעיות, אבל איך עושים את זה באלמנטור?
בתמונה מספר 2- (וגם ב1)
סימנתי בכחול את התפריט.
אני לא אוהבת את המיקום שלו. הייתי רוצה ב2 התמונות, שהוא יהיה באותה השורה של הלוגו, אבל בקצה הכי שמאלי של המסך.
בתמונה מספר 1 ממש רואים את כל המסגרת הסגולה שהתפריט נמצא בה.
איך אני גורמת ללוגו עצמו של התפריט(לספויילר), ולא לתפריט הנפתח, רק לו, לזוז שמאלה?
תודה!
היי מורן, זאת שאלה ארוכה אז יש כאן תשובה ארוכה (-:
1) את יכולה להגדיר גם את הלוגו באחוזים אם את רוצה. המטרה היא פשוט שלא יהיה מצב של תצוגת מסך שבה הלוגו פתאום הופך לגדול מידי או לקטן מידי (לדוגמה פתאום בטאבלט שהתמונה של הלוגו בחצי מהגודל שאת רוצה להציג אותו).
2) התקלה של המרווח המיותר זה אחד מהחסרונות הגדולים של אלמנטור. קצת קשה לדעת מבלי לראות מה עשית ובמקרים כאלו הדרך לפתור את זה היא באמצעות ניסוי וטעיה בהגדרות השונות.
– תנסי בתור התחלה לשחק עם השוליים של התפריט (חיצוניים ופנימיים) תנסי לראות אם את מגדירה 0 בשוליים של התפריט זה פותר את הבעיה?
– את יכולה גם לנסות ולשחק עם שוליים במינוס בצדדים ולראות אם זה עזור לפתור את הבעיה?? למשל מינוס 3 פיקסלים בצד השמאלי. למרות שגם אם זה עובד זה פתרון שאני פחות הייתי ממליץ עליו.
– את יכולה גם לבדוק אם ה-Grow משפיע על זה לטובה או לרעה?
– תנסי לשנות (להסיר או להוסיף כל הגדרה שהוספת בעצמך).
– ובמקרים ששום דבר לא עוזר הפתרון הוא ליצור את כל האזור מחדש. היו לי מקרים ששום דבר לא עזר ושיצרתי את האזור מחדש זה פתר את הבעיה.
3) כשאת נמצאת באלמנטור במסך של המובייל את יכולה להגדיר מחדש את הרוחב של האזורים השונים.
אז תעברי באלמנטור לתצוגה של המובייל ותתגדירי מחדש את הרוחב של הלוגו ושל התפריט. במובייל אלמנטור בחלק מהמקרים מעבירים את האזורים באופן אוטומטי לרוחב של 100% ואת צריכה להגדיר אותם מחדש כדי שזה יתאים לשורה אחת.
בנוגע ליישור לצד שמאל של התפריט אם את נותנת רוחב של 50% ל-2 האלמנטים (או כל רוחב אחר שתבחרי) ואת משנה את הסגנון של הכפתור ספוילר שיופיע בצד שמאל במקום באמצע זה אמור לאפשר לך להציג אותו בצד שמאל.
4) בלי קשר לנושא השאלה שימי לב שהלוגו נבלע ברקע של החלק העליון ובקושי אפשר לראות אותו. אז אם האזור הזה בגרסה סופית יהיה רעיון לסדר את הבעיה הזאת.
תודה רבה על התשובה המפורטת והזריזה!
אעבור על הדברים ואעדכן בפתרון 🙂
לגבי הלוגו, כן, זה סתם תמונה מpixaby, עד שיהיה לי לוגו אמיתי.אבל תודה!
היי יוחאי,
יש דרך לעשות את התפריט במצב מובייל שיהיה כמו התפריט במחשב ויופיע כרשימה אופקית?
עד כמה שאני יודע כן אם הבנתי נכון,
את צריכה לשחק עם ההגדרות אבל יש לך את האופציה הגם להגדיר שהתפריט לא יהפוך לתפריט נפתח או להקטין הנקודת שבירה ככה שהוא לא ייפתח.