Cara Mengatasi Gambar Buram (Blur) Thumbnail Image Blog

Post a Comment
Cara Mengatasi Gambar Buram (Blur)
Cara Mengatasi Gambar Buram (Blur) Thumbnail Image Blog.

Foto, image, atau gambar thumbnail (image thumbnail) di halaman depan ataupun di halaman postingan blog bisa buam (blur), jika ukurannya lebih dari ukuran standar 72x72 pixel.

Ukuran Thumbnail Image blogger standarnya sama dengan ukuran gambar widget popular post, yaitu 72x72 pixel.

Jika gambar thumbnail di homepage blog Anda ngebliur atau buram, tidak jelas, sehingga kurang sedap dipandang, berikut ini cara mengatasinya.

Cara Mengatasi Gambar Thumbnail Buram (Blur) di Blog

1. Tema > Edit HTML
2. Cari kode seperti di bawah ini:

<img expr:alt='data:post.title' expr:src='data:post.thumbnailUrl'/>

3. Hapus & Ganti kode di atas dengan kode di bawah ini:

<b:with value='data:post.thumbnailUrl ? resizeImage(data:post.thumbnailUrl, 300, &quot;4:3&quot;) : data:post.thumbnail' var='image_bro'>
<img expr:alt='data:post.title' expr:src='data:image_bro'/>
</b:with>

4. Save!

Dengan menggunakan kode di atas, secara otomatis akan mengubah kode s72-c menjadi w300-h225-p-k-no-nu dan membuat resolusi gambar thumbnail berubah dari 72px × 72px menjadi 300px × 200px.

Dengan demikian gambar thumbnail akan terlihat jelas meskipun ukurannya diperbesar.

Angka 300 bisa diganti sesuai dengan kebutuhan. Jika lebar maksimal untuk gambar thumbnail blog Anda hanya 200px, sebaiknya turunkan angkanya menjadi 200 saja.

Cara Lain Mengatasi Gambar Buram

Jika cara di atas tidak berfungsi, alternatifnya dengan memasang salah satu kode javascript berikut ini. Pilih salah satu.

Kode #1

Copas kode berikut ini di atas kode </body> 

<script type='text/javascript'> //<![CDATA[ function replaceText(){if(!document.getElementById){return;} bodyText = document.getElementById("Blog1"); theText = bodyText.innerHTML; theText = theText.replace(/s72-c/gi, "s200-c"); bodyText.innerHTML = theText; }replaceText(); //]]> </script>

Kode #2

<script type='text/javascript'> //<![CDATA[ $(document).ready(function() {$('.post-thumbnails').attr('src', function(i, src) {return src.replace( 's72-c', 's640' );});}); //]]> </script>

Demikian Cara Mengatasi Gambar Thumbnail Buram (Blur) di Blog.*


Related Posts

Post a Comment

Contact Form

Name

Email *

Message *