Wednesday, February 21, 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).*

0 comments:

Post a Comment

    Unordered List

    Text Widget

    Pages