החלפת אייקון המבורגר בתפריט מובייל אלמנטור

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

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

.elementor-menu-toggle i:before {
    font-family: 'enter the family class of your cutom icons';
    content: "\f0c9";
    color: #003E7E;
}

.elementor-menu-toggle.elementor-active i:before {
    font-family: 'enter the family class of your cutom icons';
    content: "\f00d";
    color: #003E7E;
}

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

.eicon-menu-bar {
	display: inline-block;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.elementor-menu-toggle i:before {
  font-family: "Rubik"; /*change to your font family*/
  font-weight: 500; /*change to your weight*/
  font-size: 1rem; /*change to your size*/
  content: "תפריט"; /*or something else*/
}

.elementor-menu-toggle.elementor-active i:before {
  font-family: "Rubik"; /*change to your font family*/
  font-weight: 500; /*change to your weight*/
  font-size: 1rem; /*change to your size*/
  content: "סגור"; /*or something else*/
}

במקום "תפריט" ו"סגור" תוכלו גם לשים טקסט של חץ לכיוון מטה ואת הסימן X, שאלו סימנים שמובנים בכל שפה.

0 0 דירוגים
דרג את הפוסט
הרשמה
Notify of
0 תגובות
Inline Feedbacks
הצג את כל התגובות

גם הסניפטים הבאים יעניינו אותך

0
אשמח לשמוע את דעתכם, מוזמנים להשאיר תגובהx