Ersetzen von Eicons mit Font Awesome Header Elementor

Problem :
Der Hamburger Icon und einige andere Elemente in Elementor benutzen Eicons. Diese sind eigentlich unnötig und kosten Ladezeit. Ich mag sie persönlich überhaupt nicht.

Lösung:
Ersetzten mit Font Awesome

Elementor logo

Diese Lösung ersetzt die Eicons zuverlässig mit Font Awsome

Im Header von Elementor Pro ersceheinen Eicons, die lästig sind, Ladezeit kosten und eigentlich weg gehören, da Font Awesome ohnehin überall iim Einsatz ist.

Wir lösen das für den Hamburger Icon per CSS und später schmeißen wir Eicons per Code generell raus.

CSS für das Theme css (Child Theme)

/* Replace Eicons with FontAwesome */
.eicon {
display: inline-block;
font: normal normal normal 14px/1 'Font Awesome\ 5 Free';
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.eicon-menu-bar {
font-style: normal;
}
.elementor-menu-toggle i:before {
content:"\f0c9";
font-family:'Font Awesome\ 5 Free';
font-weight:900;
padding: 8px;
}
.elementor-menu-toggle.elementor-active i:before {
content: "\f00d";
font-family: 'Font Awesome\ 5 Free';
font-weight:900;
} 

PHP Code für die functions.php

<?php

// Deactivate Eicons at Elementor
add_action( 'elementor/frontend/after_enqueue_styles', 'js_dequeue_eicons' );
function js_dequeue_eicons() {
  
  // Don't remove it in the backend
  if ( is_admin() || current_user_can( 'manage_options' ) ) {
        return;
  }
  wp_dequeue_style( 'elementor-icons' );
} 

 

Happy coding :-)

Du brauchst hilfe zum Thema? Schreib mir....

Verwandte Artikel

web safe fonts schriften im web
Webdesign

Das Kreuz mit den Schriften im Web

Regel : Benutze web safe-Fonts bzw. websichere Schriften! Natürlich! Logisch! Nichts besser als Websafe Fonts. aber wie eigentlich? Erkenntnis: Es gibt kaum noch Websafe-Fonts! Wir haben doch Google Fonts! Natürlich. Das Erscheinen der

Weiter lesen »
woocommerce logo
WordPress

Eigenes Datenfeld in Woocommerce

Worum gehts? Der Kunde möchte noch zusätzliche, nicht im Standard enthaltene, Felder in der  WooCommerce Produktseite ausgeben. Im konkreten Fall sollte das die Füllmenge der Flaschen sein. Welche Felder könnten das sein? Text

Weiter lesen »

Teilen

Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn
Steffen Rössler

Steffen Rössler

Diplom-Webdesigner | dreifacher Vater | Klassik-Liebhaber | Schnellleser | UmDieEcke-Denker. Lebt und arbeitet in Braunau a. Inn

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Scroll to Top