Cara Mengatasi Gambar Blur Buram di Homepage Blogger Terbaru

Baca Juga

Gambar thumbnail di halaman depan (homepage) CB tiba-tiba blur atau buram. Berikut ini Mengatasi Gambar Blur Buram di Homepage Blogger terbaru.

Sejak versi baru Blogger telah tiba, mengubah ukuran thumbnail di Blogger. Banyak blogger terganggu oleh masalah thumbnail buram. 

Di antarmuka Blogger lama, gambar thumbnail terlihat jelas dan bersih, tetapi di antarmuka Blogger baru, gambar mini di beranda tidak jelas seolah-olah ada yang memperhatikan. 

Mengatasi Gambar Blur Buram di Homepage Blogger Terbaru

Berikut ini beberapa beberapa cara untuk mengatasi gambar blur di homepage. Cara yang cocok untuk blog CB adalah Cara 1. Mungkin tidak cocok untuk blog Anda. Coba cara lain.

Ini hasilnya.

Sebelum: Blur

Sesudah: Jelas/Jernih

Sangat jelas ya perbedaannya?

Berikut ini Cara Mengatasi Gambar Blur Buram di Homepage Blogger Terbaru.

Cara 1

Ubah kualitas gambar dari "72" menjadi "1600" di kode HTML template blog Anda. Ubah angka 72 menjadi 1600 di kode HTML berikut ini:

- Tema

- Edit HTML
- Klik mouse Anda di area HTML mana saja
- Tekan Ctrl+F dan masukkan (copas) kode resizeImage

Akan ada kode berikut ini:

<img alt='' border='0' expr:src='resizeImage(data:post.thumbnail, 72, &quot;1:1&quot;)'/>

Ganti dengan kode ini:

<img alt='' border='0' expr:src='resizeImage(data:post.thumbnail, 1600, &quot;1:1&quot;)'/>

Save!

Itu dia cara mengatasi gambar buram di homepage Blogger, yang cocok untuk template yang digunakan CB Blogger. Semoga cocok juga untuk blog Anda. Jika tidka cocok, coba cara lainnya berikut ini.

Cara 2

Cara lainnya, jika cara di atas tidak berfungsi, adalah dengan mengganti kode:

<img class="post-thumbnail" src="'+e.replace(/\/s[0-9]+(\-c)?\//,
"/"+q.thumbnailSize+"/")+'" alt="'+d+'"></a>';-1!=e.indexOf("img.youtube.com")&&(c='<a class="thumbimgx" title="'+d+'" href="'+h+'"><img class="post-thumbnail" src="'+e.replace("default","0")+'" alt="'+d+'"></a>');k=k.replace(/<(.*?)>/g,"").replace(/[\n\r]+/g," ")

dengan kode

<a class='thumbimgx' expr:href='data:post.url' expr:title='data:post.title'><span class='mark'/><img class='post-thumbnail' expr:alt='data:post.title' expr:src='resizeImage(data:post.firstImageUrl, 300)' height='72' itemprop='url image' width='150'/></a>

atau dengan kode ini:

<b:if cond='data:post.thumbnailUrl'><img class='post-thumb' expr:alt='data:post.title' height=' ' expr:src='resizeImage(data:post.firstImageUrl, 300)' expr:title='data:post.title' width=' '/></b:if>

Cara 3

- Tema > Edit HTML > cari kode <b:if cond='data:post.thumbnailUrl'>

- Ganti kode script warna merah dalam kode berikut ini:

<b:if cond='data:post.thumbnailUrl'>
<a expr:href='data:post.url'><script type='text/javascript'>
document.write(fs_thumbnail_resize(&quot;<data:post.thumbnailUrl/>&quot;,&quot;<data:post.title/>&quot;));
</script>
</a>
<b:else/>

dengan kode biru berikut ini:

<b:if cond='data:post.thumbnailUrl'>
<a expr:href='data:post.url'>
<img expr:alt='data:post.title' expr:src='resizeImage(data:post.thumbnailUrl, 991, )' expr:title='data:post.title'/>
</a>
<b:else/>

Cara yang no. 3 ini berhasil di template seperti yang digunakan Komunikasi Praktis.

Cara 4

Ganti kode warna merah dalam kode <b:if cond='data:post.thumbnailUrl'> berikut ini:

<b:if cond='data:post.thumbnailUrl'>
<a expr:href='data:post.url'>
<script type='text/javascript'>
document.write(bp_thumbnail_resize(&quot;<data:post.thumbnailUrl/>&quot;,&#39;<data:post.title/>&#39;));
</script>
</a>
<b:else/>

dengan kode:

<b:if cond='data:post.thumbnailUrl'>
<a expr:href='data:post.url'>
<img expr:alt='data:post.title' expr:src='resizeImage(data:post.thumbnailUrl, 991, )' expr:title='data:post.title'/>
</a>
<b:else/>

Itu dia Cara Mengatasi Gambar Blur Buram di Homepage Blogger Terbaru. Semoga berhasil. Cara lama perbaiki gambar blur ada di dua link internal di awal postingan ini. 

Good Luck and Happy Blogging!