Mengatasi Thumbnail Image Tidak Muncul & Buram (Blur) di Blog

Mengatasi Thumbnail Image Tidak Muncul & Buram (Blur) di Blog

No Image Available
Cara Mengatasi Thumbnail Image Tidak Muncul di Halaman Depan Blog sekaligus mengatasi Gambar Thumbnail yang Buram (Blur).

THUMBNAIL image yaitu gambar ukuran kecil yang muncul di halaman depan blog, bisa di bawah judul atau di sampingnya. Gambar thumbnail ini biasa ada di homepage blog yang menggunakan Auto Readmore atau ringkasan posting di homepage.

Banyak template blog yang mungkin "jadul" sehingga gambar thumbnail tidak muncul. Sebagai gantinya, biasanya muncul gambar lain bertuliskan "No Image Available", seperti gambar ilustrasi posting ini.

Cara Mengatasi Thumbnail Image Tidak Muncul

GANTI:
<b:if cond='data:post.thumbnailUrl'> ..... kode lainnya ..... </b:if>

DENGAN:
<b:if cond='data:post.thumbnailUrl'>
  <a expr:href='data:post.url'>
    <img alt='thumbnail' class='post-thumbnail' expr:src='data:post.thumbnailUrl'/>
  </a>
<b:else/>
  <b:if cond='data:post.firstImageUrl'>
    <a expr:href='data:post.url'>
      <img alt='thumbnail' class='post-thumbnail' expr:src='data:post.firstImageUrl'/>
    </a>
  <b:else/>
    <a expr:href='data:post.url'>
      <img alt='no image' class='noimage post-thumbnail' src='http://lh4.googleusercontent.com/-ZlvikLB3yVw/VXHIr0JIJOI/AAAAAAAAAv0/2-P8lhEpmqE/s265-no/no-image.png'/>
   </a>
 </b:if>
</b:if>

Mengatasi Gambar Thumbnail Buram

Gambarnya Jadi Buram?
Jika gambar thumbnail jadi buram (blur), maka untuk memperjelasnya simpan (copas) kode berikut ini:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
  <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <script>
//<![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('Blog1', 300);
//]]>
    </script>
  </b:if>
</b:if>
<div class='clear'/>

di bawah kode:

<b:section class='main' id='box-posting' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'>
<b:includable>
... ada rangkaian kode lainnya di sini ....
</b:includable>
</b:widget>
</b:section>

Itu dia cara Mengatasi Thumbnail Image Tidak Muncul & Buram (Blur) di Halaman Depan Blog.*

Labels: Desain Blog

Related Posts

1 Komentar untuk "Mengatasi Thumbnail Image Tidak Muncul & Buram (Blur) di Blog"

thanks
image rezisenya work
cuma kalo bisa tambahin penjelasan cara kerja kodenya

1. Komentar spam, menyertakan link aktif dan alamat blog tidak akan muncul.
2. Tidak semua pertanyaan sempat atau bisa dijawab.
3. Bagi yang mau tanya, sebelum bertanya, silakan cari dulu di Kotak Pencarian di Sidebar.
Thanks for visiting and the comment :)

Contact Form

Name

Email *

Message *