Blogger thumbnail öne çıkan resim alanı nasıl oluşturulur

Benim paylaştığım kodlar diğer sitelerde paylaşılan kodlara göre biraz farklılık göstermekte. Bu farklılık eğer yazıya hiç görsel eklenmemişse yazı önünde hiç görsel gösterilmiyor. Normalde görsel yok, görsel eklenmemiş gibi boş resimler eklenebiliyor fakat ben görüntü kirliği yaptığı için bu kısmı kaldırdım.
Yazı başlığı önüne sağına veya soluna aşağıdaki kod eklenilir
<b:if cond='data:post.thumbnailUrl'>
<b:if cond='data:blog.pageType == "index"'>
<a class='postimg' expr:href='data:post.url'>
<img alt='thumbnail' class='post-img' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' expr:title='data:post.title'/>
</a>
</b:if>
<b:else/>
<!-- burası boş kalacak -->
</b:if>
CSS ile düzenleme yapmak için
.postimg img{/*float:left; gibi*/}
Eğer görseller büyük halde, şuan benim kullanmış olduğum gibi gösterilecek ise </body> öncesine aşağıdaki javascript kodları eklenir ve css ile height ve width değerleri verilir.
<script type='text/javascript'>
$(document).ready(function() {$('.postimg img').attr('src', function(i, src) {return src.replace( 's72-c', 's1600' );});});
</script>