Cara Membuat Gambar Diatas Judul (First Thumbnail)

cara meletakkan gambar postingan di atas judul - hallo sobat blogger, apakah blog anda ingin melakukan perbaikan yang lebih bagus lagi ? anda menemukan artikel yang tepat untuk blog anda.

apakah anda pernah mengunjung arlina design dan blog lain, mereka memasang gambar postingannya di atas judul, keren juga bukan ? nah, apabila anda tertarik meniru tata letak gambar blog mereka bisa mengikuti tutorial ini.

Cara Memasang First Thumbnail Diblog

1. Buka akun blogger anda.
2. Theme > Edit HTML.
3. Cari <b:if cond='data:post.title'> , biasanya lebih dari 1 code tersebut, pilih yang pertama saja.
4. Salin script HTML di bawah ini, letakkan di tag <H1></H1>. lihat gambar

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='coverImage'>
<b:if cond='data:post.firstImageUrl'>
<img class='firstimage' expr:alt='data:post.title' expr:src='data:post.firstImageUrl'/>
<b:else/>
<img class='firstimage' expr:alt='data:post.title' src='URL_GAMBAR_NOIMAGE'/>
</b:if>
</div>
</b:if>

5. Cari </body> letakkan script javascript di atas </body>

<script type='text/javascript'>
//<![CDATA[
$(function() {
   $(".separator:first").remove();
      $(".post-body > img:first").remove();
                      });
//]]>
</script>

6. Cari </style> salin dan letakkan di atas </style>

.post img.firstimage {
       width:100%;
       height:auto;
       max-width:100%;
   }
.post-body .separator:nth-child(1) {
       display:none;
   }

7. Simpan Themeplate.

Setelah anda memasang fitur ini, gambar postingan anda akan menjadi double(dua). tetapi tenang saja, beberapa waktu akan menghilang dengan sendiri.

Berbagi :