Kamis, 22 Februari 2018

Cara mengubah atau memperbesar Ukuran Gambar Thumbnail Auto Readmore Posting di Homepage Blogger



Mengubah ukuran Standar Thumbnail 72 × 72 piksel s72-c menjadi ukuran yang lain, misalnya s200-c.

Contoh: Mengubah Ukuran Image Thumbnail dari 72px menjadi 200px


Cara 1: Menggunakan JavaScript Murni
Copas kode berikut ini di atas kode </body>
 
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<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;
    }
}
resizeThumb('main-wrapper', 200);
//]]>
</script>
</b:if>
</b:if>
 
Metode 2: Menggunakan JQuery
Salin kode ini dan letakkan di atas kode </head> atau </body>:


<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
function resizeThumb(el, from, to) {
    $(el).each(function() {
        $(this).attr({
            'src': $(this).attr('src').replace('/s'+from+'-c/', '/s'+to+'-c/'),
            'width': to, 'height': to
        });
    });
}
$(function() {
    resizeThumb('.post-thumbnail', '72', '200'); 
});
//]]>
</script>
</b:if>
</b:if>
 
Mengubah Ukuran Thumbnail Image Posting Blogger di Homepage untuk lebih menonjolkan gambar agar menarik. (Sumber: dte).*
Share this post:  

0 komentar: