Tips Mengubah Ukuran Gambar Thumbnail dan Solusi Buram

Salam sejahtera semua, berjumpa lagi dengan artikel terbaru yang membahas Tips Mengubah Ukuran Gambar Thumbnail dan Solusi Buram pada blog. Bagi yang suka oprek - oprek template blognya pasti akan berjumpa dengan masalah ketidakcocokkan ukuran gambar thumbnail serta gambar di homepage menjadi buram. Saya juga pernah mengalaminya kok (hehehhe).

Kalian pasti tahu alasan kenapa gambar menjadi buram (blur) adalah karena ukuran aslinya lebih kecil dari ukuran thumbnail pada homepage atau sebab ukuran defaultnya lebih kecil lagi daripada yang ditampilkan.

Baca Juga:

Artikel tips kali ini akan saya jadikan satu artikel saja, agar cepat dimengerti serta masalah yang dihadapi supaya cepat terselesaikan. Oke langsung saja tanpa basa - basi lagi, mari kita simak caranya di bawah ini:

Tips Mengubah Ukuran Gambar Thumbnail dan Solusi Buram di Blogger

Thumbnail Homepage

Login terlebih dahulu ke Blogger tercinta dan tersayang.
Masuk ke Template, lalu Edit HTML
Copy paste kode dibawah ini lalu tempatkan di kode </body>

&lt;b:if cond=&#039;data:blog.pageType != &amp;quot;static_page&amp;quot;&#039;&gt;
&lt;b:if cond=&#039;data:blog.pageType != &amp;quot;item&amp;quot;&#039;&gt;
&lt;script type=&#039;text/javascript&#039;&gt;
//&lt;![CDATA[
function resizeThumb(parentID, size) {
    var parent = document.getElementById(parentID),
        image = parent.getElementsByTagName(&#039;img&#039;);
    for (var i = 0; i &lt; image.length; i++) {
        image[i].src = image[i].src.replace(/\/s72\-c/, &quot;/s&quot; + size + &quot;-c&quot;);
        image[i].width = size;
        image[i].height = size;
    }
}
resizeThumb(&#039;main-wrapper&#039;, 300);
//]]&gt;
&lt;/script&gt;
&lt;/b:if&gt;
&lt;/b:if&gt;

main-wrapper diatas merupakan id widget, tiap template akan berbeda - beda tinggal sesuaikan saja.

Thumbnail di Popular Posts

Copy paste kode di bawah ini tepat di atas kode </body>

<script type='text/javascript'>
//<![CDATA[
function resizeThumb(parentID, size) {
    var parent = document.getElementById(parentID),
        image = parent.getElementsByTagName('img');
    for (var i = 0; i < image.length; i++) {
        image[i].src = image[i].src.replace(/\/s72\-c/, "/s" + size + "-c");
        image[i].width = size;
        image[i].height = size;
    }
}
// Mengubah ukuran thumbnail widget Posting Populer
resizeThumb('PopularPosts1', 300);
//]]>
</script>

Tulisan PopularPosts1 merupakan id widget, tiap template akan berbeda - beda tinggal sesuaikan saja.

Biasanya ukuran gambar thumbnail popular posts 72 x 72, jika mau dibesarkan ukurannnya silahkan pakai kode di atas agar tidak mengalami gambar buram (blur).

Demikian artikel saya kali ini Tips Mengubah Ukuran Gambar Thumbnail dan Solusi Buram, semoga berhasil mengatasi gambar buram atau blur. Saya sudah mencobanya dan berhasil, kadang juga tidak berhasil tergantung template sih. Good Luck (https://iamryll09.blogspot.co.id/)