ימים
שעות
דקות
שניות
הזדרזי! המבצע בתוקף עד 04.04.2024

איך אני מגדירה בהצגת הגריד שיהיה מיושר לאמצע? הוא אמור להציג 2-4 פוסטים, ואני רוצה שיהיה בכל פעם ממורכז לאמצע.

כדי ליישר את הגריד למרכז את צריכה להוסיף קוד CSS לוידג’ט. בכרטיסיה מתקדם > CSS מותאם אישית > הדביקי את הקודים הבאים לפי הצורך.

יישור ליסטינג גריד של ג’ט אנג’ין למרכז

הכי קל להשתמש בליסטינג גריד של ג’ט אנגי’ן, ולהוסיף לו שורת קוד אחת בCSS, המגדירה לו יישור אוטומטי למרכז:

selector .jet-listing-grid__items{
    justify-content: center !important;
}

יישור גריד פוסטים של אלמנטור למרכז

באלמנטור הגריד מתבסס על css-grid, ולכן הקוד יהיה קצת יותר מסובך.

הכי טוב להחליף את שיטת הגריד לflex, עם הקוד הזה:

selector .elementor-posts-container{
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap;
}

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

בכל מקרה, אם את רוצה לחלק ל4 עמודות, עם מרווח של 30px בין העמודות, הקוד הבא יתאים לך:

selector .elementor-grid-item{
    flex-basis: calc(25% - 22.5px) !important;
}

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

2 תגובות

כתיבת תגובה

הדרכות נוספות שיכולות לעזור לך

טיפים לסגירת עסקה מוצלחת עם לקוח שכבר קבל הצעת מחיר

פתחתי ללקוח תיבת מייל עם הדומיין של האתר, איך מחברים אותה לחשבון גוגל? שההודעות יוכלו להגיע כמו חשבון ג’ימייל רגיל, ולא לתיבה שפותחים באחסון של האתר?

איך אפשר לצרף גולשים לרשימת תפוצה במיילצ’ימפ עם טופס אלמנטור פרו?

איך אפשר למחוק דף שעולה בתוצאות החיפוש של גוגל? הדף כבר כבר לא רלוונטי כי מחקתי אותו מהאתר

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

האם ניתן להציג את מספר הצפיות בפופאפ של ג’ט באמצעות Data Stores, או שזה עובד רק בפוסט-טייפ עצמו?

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

איך יוצרים גלילת רוחב באתר שבנוי באלמנטור?

כלים אלופים

10 כלים מומלצים
שיעזרו לך לעבוד מהר יותר
דילוג לתוכן