Mengatasi Broken Image Pada Template Kompi Flexible

Ditulis oleh: Adhy Suryadi

Ditulis pada: 10/14/2021

Mengatasi Broken Image Pada Template Kompi Flexible - Akhir-akhir ini Blogger mengganti hosting gambarnya dari bp.blogspot.com menjadi blogger.googleusercontent.com yang ternyata menyebabkan masalah di beberapa tema Blogger. Namun anehnya, perubahan ini tidak terjadi pada semua blog. Masih banyak juga blog yang masih mendapatkan bp.blogspot.com untuk hosting gambar Blogger, salah satunya blog Kompi Ajaib ini seperti terlihat pada gambar berikut ini.

Dan tema Blogger yang bermasalah dengan hosting gambarnya dari bp.blogspot.com menjadi blogger.googleusercontent.com ini salah satunya adalah template Kompi Flexible Non AMP.

Hal ini terjadi karena Kompi Flexible menggunakan cdn.statically.io/img/ untuk URL gambarnya sementara cdn.statically.io/img/ tidak mendukung gambar tanpa ekstensi seperti pada blogger.googleusercontent.com yang tidak menggunakan ekstensi .jpg atau .png untuk nama file gambar di akhir URL gambarnya, akhirnya gambarnya menjadi broken.

Untuk itu, untuk mengatasi ini silahkan lakukan seperti berikut ini:

1. Silahkan masuk ke edit HTML.
2. Kemudian klik di sembarang tempat di edit HTML.
3. Kemudian silahkan tekan Ctrl + Shift + R di keyboard secara bersamaan, lalu masukan kompiflexible9_home1.min.js pada kotak Search-nya lalu tekan Enter.
4. Lalu masukan kompiflexible9_home1_3.min.js di kotak selanjutnya untuk Replace With, lalu tekan Enter.
5. Silahkan tekan Ctrl + Shift + R lagi di keyboard secara bersamaan, lalu masukan kompiflexible9_post1.min.js pada kotak Search-nya lalu tekan Enter.
6. Lalu masukan kompiflexible9_post1_3.min.js di kotak selanjutnya untuk Replace With, lalu tekan Enter.
7. Selesai.

Dan yang perlu diketahui, untuk saat ini data:post.thumbnail Blogger sudah mendukung hosting gambar Blogger blogger.googleusercontent.com, namun belum diketahui apakah hosting gambar ini akan digunakan seterusnya atau akan kembali lagi menggunakan bp.blogspot.com seperti sebelumnya.

Untuk tutorial cara mengatasi broken image pada tema Kompi Flexible, bisa juga ikuti video berikut ini:

UPDATE:

Ternyata dengan js baru di atas masih ada masalah yaitu thumbnail di related post nya blur, yang sudah mengikuti langkah di atas silahkan lakukan lagi ini:

1. kompiflexible9_home1_3.min.js ganti dengan kompiflexible9_home1_3b.min.js
2. kompiflexible9_post1_3.min.js ganti dengan kompiflexible9_post1_3b.min.js

Untuk pengguna tema v8.60, silahkan lakukan ini:

1. kompiflexible8_home6.min.js ganti dengan kompiflexible8_home6b.min.js
2. kompiflexible8_post16.min.js ganti dengan kompiflexible8_post16b.min.js