Default Thumbnail Pada Auto Readmore Tanpa Javasript - Assalamualaikum wr.wb di malam ini sebelum tidur saya akan berbagi tutorial kepada anda mengenai cara membuat default thumbnail ( gambar ) pada auto read more tanpa java script . ukuran default thumbnail ini adalah 72 px yaitu sama dengan thumbnail popular post , karena kode ii diambilkan dari widget popular post hehehhehe :)
|
Default Thumbnail Pada Auto Readmore Tanpa Javasript |
Berikut Cara Mudah membuat Default Thumbnail pada Auto Readmore Tanpa Javascript :
1. Pertama sobat Simpan kode CSS di bawah ini tepat di atas kode
]]></b:skin> atau
</style>
.post-thumbnail{background:#4e4d4d;width:88px;height:88px;text-align:center;float:left;position:relative;margin-right:10px;margin-top:10px;border:1px solid #555;}
.post-thumb {width:72px;height:72px;transition:all .3s ease-in;padding:0;margin-top:5px;margin-left:5px;border:3px solid #5e5e5e;}
.post-thumb:hover{transition:all .3s ease-in;opacity:.7}
2 Langkah Kedua sobat Copy kode di bawah ini dan letakkan di bawah kode
<div class='post hentry' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.url'>
<div class='post-thumbnail'>
<b:if cond='data:post.thumbnailUrl'>
<img class='post-thumb' expr:alt='data:title' expr:src='data:post.thumbnailUrl' expr:title='data:post.title' height='72' width='72'/>
<b:else/>
<img class='post-thumb' expr:alt='data:title' expr:title='data:post.title' height='72' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2_4f7gKVEGtNQL08qIfvmNCKCwjMsAjV-gzOep3-5a-E-jJDkg121Ab7ZxLms1u8MA7q3Vvatz4uOU7-bCtIL-C3rhQPLNF86swXDzjFkuMah6ItC1hXSsBbew5Xg-RMCwE2f97baRmg/s1600/icon72x72.png' width='72'/>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
Note :
Yang Perlu anda ingat Brow bahwa kode disetiap template berbeda, cara di atas merupakan cara yang saya gunakan di template yang saya pakai ini. Anda juga bisa menyimpannya di bawah <h2 class='post-title'>...</h2>
atau juga <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
Intinya sobat harus bisa menyesuaikannya dengan template anda