Update Kompi Dark v2.00 Memperbaiki Loading Blog

Ditulis oleh: Adhy Suryadi

Ditulis pada: 4/14/2016

Lagi, Kompi Dark Premium Blogger Template kembali saya update ke versi 2.00. Beberapa perbaikan dilakukan pada template Kompi Dark di antaranya memperbaiki loading blog di homepage, meng-update font awesome, dan mengganti sitemap blog.

Template Kompi Dark dengan tampilan grid di homepage ini menggunakan masonry untuk merapihkan susunan grid. Namun karena sebelumnya penyimpanan script masonry secara inline, sehingga ini menyebabkan blocking render js. Untuk itu, dengan melakukan percobaan untuk men-defer script masonry, akhirnya berhasil mengatasi blocking render js dari masonry.js. Kemudian untuk font awesome juga diupdate dari versi 4.5.0 ke versi terbaru 4.6.0.

Untuk para pengguna template Kompi Dark, ada tips untuk menampilkan thambnail postingan ketika membuat postingan. Sebenarnya gambar pertama di postingan ini akan otomatis menjadi thumbnail post di atas postingan dan gambar pertama di postingan akan otomatis menghilang dengan bantuan CSS berikut:

.post-body>.separator:nth-of-type(1){display:none;visibility:hidden}

.separator adalah tag class yang membungkus image postingan blogger, dan .separator:nth-of-type(1) adalah tag .separator pertama, dan .post-body>.separator:nth-of-type(1) adalah tag .separatos pertama dan terdekat dengan .post-body.

Namun gambar pertama akan muncul terlebih dahulu baru kemudian menghilang. Oleh karena itu, untuk membuat thumbnail postingan, silahkan upload gambar di awal postingan, kemudian tambahkan tag class image pada tag class separator seperti di bawah ini.

Tampilan awal gambar postingan seperti di bawah ini.

<div class="separator" style="clear: both; text-align: center;">

<img alt="Membuat Es Mojito Kemangi Menyegarkan Dan Menyehatkan" height="500" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimhJT7kZ7_VerXzTJhCAvd79GxrE3aT2BVaZDDUDVhLiS16Dt5Ts-4mwkusKBdKOS7_ccXQGHNnIMhSvVdDMrEogIWyurSccWywuMpWzYuGR11_e0AZ2KToWXagtR-qvJTL27dTHCuKDQ/s1600/mojito.jpg" title="Membuat Es Mojito Kemangi Menyegarkan Dan Menyehatkan" width="750" /></div>

Kemudian tambahkan class image menjadi seperti di bawah ini.

<div class="separator image" style="clear: both; text-align: center;">

<img alt="Membuat Es Mojito Kemangi Menyegarkan Dan Menyehatkan" height="500" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimhJT7kZ7_VerXzTJhCAvd79GxrE3aT2BVaZDDUDVhLiS16Dt5Ts-4mwkusKBdKOS7_ccXQGHNnIMhSvVdDMrEogIWyurSccWywuMpWzYuGR11_e0AZ2KToWXagtR-qvJTL27dTHCuKDQ/s1600/mojito.jpg" title="Membuat Es Mojito Kemangi Menyegarkan Dan Menyehatkan" width="750" /></div>

Dan cara membuat gambar postingan seperti video di bawah ini, silahkan lihat dengan full screen agar lebih jelas.


Nah, untuk yang sudah menggunakan Kompi Dark Premium Blogger Template ini silahkan cek email-nya untuk update kali ini.

Bagi yang berniat ingin menggunakannya silahkan contact saya.