היפוך עמודות במובייל ובטאבלט באלמנטור
נכתב ע"י יוחאי ירמיהו9 שאלות
תיאור קצר לשיעור: בשיעור זה נלמד איך אפשר להפוך עמודות באלמנטור בתצוגות המסך השונות (טלפון וטאבלט) על מנת להתאים את האתר באופן טוב יותר לתצוגות המסך השונות.
אורך השיעור: 3:17 דקות
קורסים המכילים את השיעור וידאו:
תוכן השיעור:
בשיעור זה נלמד איך אפשר להפוך עמודות בתצוגת מסך שונה כך שבמחשב עמודה אחת תוצג בצד שמאל אבל במובייל נדאג שהיא תוצג בחלק העליון ולא בחלק התחתון של העמוד.
למה צריך לבצע החלפה של מיקום עמודות
באופן רגיל כאשר אנחנו יוצרים תוכן באתר השורה או הטקסט העליון יופיעו מעל בתצוגת המובייל. בעבודה עם עמודות בדרך כלל העמודה שתופיע בצד הימני (באתרים שנבנו בעברית) היא העמודה שתופיע ראשונה בתצוגה של הטלפון הנייד.
במקרים שבהם נרצה לשנות את הסדר של התצוגה כמו אם למשל בצד השמאלי יש תמונה שאנחנו רוצים שתופיע לפני הטקסט במובייל נוכל לעשות זאת על ידי היפוך עמודות באלמנטור.
באופן כללי הייתי ממליץ לנסות ולהימנע מהאפשרות הזאת אלא אם כן זה ממש חשוב, העדיפות היא לבנות את האתר והסדר של האלמנטים באותה צורה גם במחשב הנייח וגם בטלפון הנייד.
איך ליצור היפוך עמודות במובייל?
במידה ואנחנו רוצים לבצע היפוך של עמודות בתצוגת מסך שונה כמו במובייל או בטאבלט נרצה לשנות את מצב התצוגה של אלמנטור למצב של תצוגה במובייל.
לאחר מכן נבחר את השורה שמכילה את העמודות באתר ונלחץ עליה כדי לצפות בהגדרות שורה. מתוך ההגדרות שורה נבחר באפשרות של מתקדם ונלחץ על רספונסיביות.
בחלונית של רספונסיביות נבחר האם אנחנו רוצים להפוך את העמודות במובייל או בטאבלט (או אפילו בשניהם) ונלחץ על האפשרות שאנחנו רוצים לסמן. לאחר מכן נוודא שהסדר של העמודות משתנה במובייל או בטאבלט ועדיין מופיע כמו שצריך גם במחשב הנייח.
הצטרפו לקהילות המובילות של בוני האתרים בישראל
זה הזמן להצטרף לקהילה שלנו ולקבל סיוע ותמיכה בקבוצות המובילות בארץ לבוני אתרים בוורדפרס (-:
קורסים מקיפים ומומלצים ללימוד בניית אתרים
לבנות אתר ב-10 ימים
קורס מזורז שילמד אותך לבנות אתרים ב-10 ימים. נקודת כניסה מעולה לתחום של בניית אתרים במחיר משתלם.
- לבנות אתר ב-10 ימים 56 שיעורים שילמדו אותך הכל על בניית אתרים
- בונוס 1: לבנות אתר מתבנית מוכנה לאנשים עסוקים שלא רוצים להשקיע 10 ימים
- בונוס 2: גיבוי, שחזור, ותחזוקה לאתר איך לבצע גיבויים ולתחזק אתר ללא תקלות
- בונוס 3: אלמנטור קונטיינר (Container) איך ליצור תוכן באמצעות אלמנטור קונטיינר
- בונוס 4: אחסון אתרים ב-Cloudways אחסון אתרים על גבי חברות השרתים המובילות בעולם
- בונוס 5: קלאודפלייר + מייל עסקי בחינם איך להשתמש בקלאודפלייר + יצירת מייל עסקי בחינם
- בונוס 6: לעבור אחסון ולהישאר בחיים איך להעביר אתר מאחסון אחד לאחר ללא תקלות
- בונוס 7: יצירה וניהול של רשימות תפוצה ברב מסר איך ליצור סדרות מיילים ואוטומציות שיכניסו כסף על אוטומט
- תמיכה לשנה לשאלות בעמודי השיעורים
- גישה לקבוצת הפייסבוק
- גישה לכל החיים
- תעודה הכשרה בסיום הלימודים (קובץ PDF)
- גישה לעדכונים ושיעורים חדשים
- 100% החזר כספי ל-14 ימים
רכשו את הקורס 1078 סטודנטים לפניך (-:
מסלול וורדפרס 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 ימים
רכשו את הקורס 765 סטודנטים לפניך (-:
אם אהבתם את השיעור ואתם רוצים לשתף אותו ניתן לעשות זאת על ידי לחיצה על כפתורי השיתוף מתחת:
עוסק בתחום של פיתוח אתרים ועיצוב גרפי למעלה מ-15 שנה. נינג'ה מומחה לוורדפרס, מפתח תוספים ותבניות בהתאמה אישית והמרצה שלכם בקורס הדיגיטלי המקיף והמוביל בישראל ללימוד בניית אתרים בוורדפרס בצורה נכונה.
שאלות ותשובות לשיעור
9 שאלות
באסה, היכולת לשאול שאלות בשיעור פתוחה רק למשתמשים שרכשו את הקורס
היי,
האם ההיפוך עובד גם על עיצוב תפריט עליון/תחתון.
משום מה האופציה של רספונסיביות מציג לי רק את האופציות של הסתרת פריטים.
לא מופיעות לי האופציות של היפוך.
ניסיתי גם עם החלון ניווט אבל עדיין לא מופיע.
היי אוראל,
כן זה עובד גם בתפריט העליון והתחתון.
את צריכה לוודא שאת נמצאת על ההגדרות של השורה ולא על ההגדרות של העמודה.
בדרך כלל בהגדרות של עמודה יש לך רק את האפשרות של הסתרת פריטים ותחת האפשרות של שורה יש לך גם את היכולת לבצע היפוך של מיקומים.
אם את נמצאת בהגדרות שורה ואת עדיין לא רואה את היכולת להפוך עמודות אז תנסי אולי ליצור שורה חדשה ולבדוק אם בהגדרות של השורה יש לך את האפשרות.
אם את לא יודעת איך להיכנס להגדרות שורה תודיע לי ואני אנסה להעלות צילום מסך שמראה איך לבחור את ההגדרות האלו.
אכן הייתי בהגדרות עמודה.
אבל כשאני עוברת למובייל זה הופך לי מיקומים של הלוגו מתחת לתפריט ולא להיפך.
איך אני יכולה לשנות את בכל זאת?
ניסיתי לשנות מיקומים אבל זה גם שינה לי באתר בתצוגה של מחשב.
אני לא כל כך בטוח מה את מנסה לעשות. אבל אם הלוגו מופיע בצד ימין והתפריט בצד שמאל אז ברגע שאת עושה היפוך עמודות במובייל הסדר שמושפע זה מה יופיע מעל ומה מתחת.
ככה שאם הלוגו הופיע בצד ימין (נמצא לפני התפריט) במובייל הוא יופיע בצד שמאל. ובמידה והאזור שיצרת במובייל לא נמצא בשורה אחת אז השוני זה מה מופיע לפני ומה מופיע אחרי בסדר הצגה של העמוד.
במקרה הכי גרוע שאת לא מצליח לפתור את זה את יכולה ליצור 2 שורות שונות ולהסתיר אחת במובייל ואחת במחשב אבל זה משהו שאני פחות ממליץ עליו.
היי יוחאי, למה לא ממליץ על שתי שורות שהאחת מוסתרת במובייל?
יצרי עמוד של ההודעה נשלחה בהצלחה וברגע שאני כותבת מלל של שלוש שורות זה תמיד במובייל עולה אחד על השני המלל אז יצרתי שתי שורות. למה זה קרה בעצם?
היי, זה בסדר לעשות את זה עם שורה קטנה של טקסט ועמוד יצירת קשר שהוא יותר שולי.
אבל תוכן שמופיע בעמוד כמה פעמים והוא תוכן זהה (כמו למשל תפריט ניווט שמופיע בכל עמודי האתר) אז זה עשוי להיות קצת בעייתי מבחינת הנושא של קידום אתרים.
לגבי השאלה שהטקסט עולה אחד על השני זה לא אמור לקרות אלא אם כן הוספת מרווחים שליליים. אז אם זה משהו שמפריע לך ולא מוצג בצורה טובה באתר תנסי פשוט לבנות את האזורים האלו מחדש ולראות אם זה פותר את הבעיה.
תודה יוחאי!
אין מרווחים שליליים.. לא יודעת למה זה קרה אבל בניתי מחדש וזה פתר את הבעיה! תודה!
היי,
האם זה שהעמודות מופיעות במובייל אחת מתחת לשניה ולא אחת ליד השניה כמו במחשב זה קורה לבד, או שזה מגיע מהתבנית אסטרה?
כן זה מתבצע באופן אוטומטי אבל דרך אלמנטור ולא דרך התבנית (אם בנית את האזור באלמנטור).
לאלמנטור יש הגדרות בתוך התוסף שמנסות לבצע התאמה לאזורים שונים עבור המובייל ובמידה וההתאמה האוטומטית לא מתבצעת בצורה טובה אז יש לך אפשרות לעקוף את ההגדרות של האזורים השונים במובייל (כמו שתלמד בהמשך הקורס).