WordPress Tips – Lean Divi Theme

Menggunakan “All in one” Theme pada wordpress memerlukan optimasi dikarenakan banyak fungsi yang membuat template ini keren membutuhkan script dan code yang berat, parahnya tidak semua fitur ini kita gunakan. Artikel ini secara spesifik akan membahas salah satu theme favorit saya yaitu Divi Themes dari ElegantThemes.com

Instalasi Default WordPress (“Twenty Seventeen”) vs Divi Theme pada situs blank/awal

Twenty Seventeen
Total File: 405 Kb
Total Request: 13

Divi Theme
Total File: 911 Kb
Total Request: 18

Seperti anda lihat bahwa template Divi blank ini ternyata membutuhkan resource lebih dari 2 kali resource yang dibutuhkan.

Apa yang bisa kita optimasi ?

1. Hilangkan penggunaan Font OpenSans secara default (berkurang 3kb)
   buka function.php, pada baris 140 nonaktifkan pemanggilan font ini:

   add_action( 'wp_enqueue_scripts', 'et_divi_load_fonts' );

2. Hilangkan font modules.ttf. Font ini digunakan pada saat anda melakukan front end building, jika anda tidak dalam editing, font ini akan membuang resource anda (berkurang 81.3kb)Cara menghapus: buka style.css , pada baris 6080, hapus pemanggilan font ini:

   /*@font-face {*/
      /*font-family: "ETmodules";*/
      /*src: url("core/admin/fonts/modules.eot");*/
      /*src: url("core/admin/fonts/modules.eot?#iefix") format("embedded-opentype"), url("core/admin/fonts/modules.ttf") format("truetype"), url("core/admin/fonts/modules.woff") format("woff"), url("core/admin/fonts/modules.svg#ETmodules") format("svg");*/
      /*font-weight: normal;*/
      /*font-style: normal;*/
   /*}*/
   
   

3. Woocommerce ?! Tidak perlu !
   Tidak semua website menggunakan woocommerce, namun karena Divi Theme ini support woocommerce, maka dalam deklarasi style.css banyak tag woocommerce yang hanya buang buang resource saja (berkurang 56kb)caranya buka file styles.css, kemudian hapus selector (class atau id) yang mengandung kata ‘woo’,’shop’,’cart’
4. Optimasi CSS
   Divi hadir tanpa css yang teroptimasi/minified. (berkurang 44kb)Cara optimasi hasil no.3 di situs seperti di http://csscompressor.com/
5. Compress JS
   3 File yang bisa anda compress: includes/builder/js/frontend-builder-scripts.js (berkurang 81kb),  js/custom.js (berkurang 32kb) , dan includes/builder/scripts/frontend-builder-global-functions.js (berkurang 4kb)

Demikian tips mengoptimasi Divi Theme, semoga menginspirasi !