Posted on

Tips-trik Mengoptimalkan Plugin Elementor Pada Website WordPress

wpJakarta.Com – Tips-trik Mengoptimalkan Plugin Elementor Pada Website WordPress. Beberapa waktu lalu kami sempat tidak ingin melirik elementor atau plugin builder lainnya dalam membuat sebuah website. Kami lebih memaksimalkan desain website yang “plain”, simple dan minimalis. Karena kami berfikir bahwa kekuatan dari website adalah isi kontennya. Bukan pada desainnya. Untuk tipe atau jenis website blog atau tutorial pendapat kami memang ada benarnya. Lagian kami berfikir bahwa penggunaan plugin elementor mungkin akan membuat waktu loading website WordPress menjadi lebih lambat meskipun hanya sepersekian detik.

Teori tersebut mungkin ada benarnya. Karena logikanya website yang dibuat tanpa elementor maka tidak akan ada kode tambahan yang perlu di baca oleh prosesor saat mengkompile rangkaian skrip PHP. Sebaliknya website yang dibuat dengan elementor, maka akan ada tambahan kode atau skrip yang harus dibaca oleh prosesor yang dibawa oleh plugin elementor tersebut.

Namun banyak orang yang tentu ingin desain yang lebih “wah” untuk di tampilkan pada halaman homepage websitenya. Dan elementor adalah yang paling umum dipilih sebagai plugin page builder dibandingkan dengan plugin sejenis lainnya. Elementor atau plugin page builder lainnya memang membuat perkara bikin website menjadi sangat mudah. Bahkan untuk tingkat pemula, membuat website jauh lebih mudah ketimbang belajar microsoft excel.

Dan jika anda adalah salah satu yang membangun website WordPress menggunakan elementor, maka perkara “loading” lambat website elementor bukanlah perkara yang perlu anda khawatirkan. Ada satu tips-trik yang diyakini bisa membantu loading halaman elementor menjadi lebih cepat. Yaitu dengan mengimplementasikan deaktivasi tiga hal berikut :

Tips-trik mengoptimalkan plugin elementor Pada website WordPress dengan deaktivasi google font

Anda bisa mendeaktivasi google font pada setting elementor secara aman tanpa harus “kehilangan gaya”. Pasalnya tema website sudah pasti dibekali dengan segudang google font yang bisa anda pilih pada halaman customizer WordPress. Caranya :

  • Dari menu Elementor >> Setting >> General tab.
  • Centang “Disable Default Colors” dan ” Disable Default Fonts “.
  • Lalu tambahkan kode skrip berikut ke dalam file function.php. Atau pada file plugin buatan agar kode tersebut tidak terhapus saat ada pembaruan tema website.
 add_filter( 'elementor/frontend/print_google_fonts', '__return_false' );

Tips-trik mengoptimalkan plugin elementor Pada website WordPress dengan deaktivasi font awesome

 add_action( 'elementor/frontend/after_register_styles',function() {
 	foreach( [ 'solid', 'regular', 'brands' ] as $style ) {
		wp_deregister_style( 'elementor-icons-fa-' . $style );
	}
 }, 20 );

Tips-trik mengoptimalkan plugin elementor Pada website WordPress dengan deaktivasi Eicons

 add_action( 'wp_enqueue_scripts', 'remove_default_stylesheet', 20 ); 
 function remove_default_stylesheet() { 
 	wp_deregister_style( 'elementor-icons' ); 
 }

Tiga cara diatas efektif membuat loading halaman elementor menjadi lebih “kencang”. Namun dengan implementasi tiga cara diatas mungkin membuat anda mengalami masalah. Yaitu halaman yang dibuat dengan elementor dengan beberapa icons font awesome, maka icon-icon tersebut akan tidak tampil sempurna. Karena kode diatas akan menderegister icons pada semua halaman website.

Jika anda mengalami hal tersebut anda dapat membuat pengecualian terhadap halaman-halaman yang ingin tetap menampilkan icon. Misalnya halaman homepage atau halaman contact us / about us yang terdapat icons telepon atau marker. Anda dapat membuat pengecualian dengan kode seperti berikut : if ( ! is_page( array( 122, 519 ) ) ) {. Asumsi bahwa 122 adalah page id halaman about us dan 519 adalah page id halaman homepage.

 add_filter( 'elementor/frontend/print_google_fonts', '__return_false' );

 add_action( 'elementor/frontend/after_register_styles',function() {
     foreach( [ 'solid', 'regular', 'brands' ] as $style ) {
         if ( ! is_page( array( 122, 519 ) ) ) { // --> Pengecualian untuk page id 122 dan 519 (homepage atau about us)
             wp_deregister_style( 'elementor-icons-fa-' . $style );
         }
     }
 }, 20 );

 add_action( 'wp_enqueue_scripts', 'remove_default_stylesheet', 20 );
 function remove_default_stylesheet() { 
     if ( ! is_page( array( 122, 519 ) ) ) { // --> Pengecualian untuk page id 122 dan 519 (homepage atau about us)
         wp_deregister_style( 'elementor-icons' );
     }
 }