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/AVvXsEiVvcNpXsG-2ZlYiTCNLeAYtYzwNvfe6kj3o5sEwCMl28EqlxvPqcSAM6bJQpA8QRvHi-2Fz3Eb0jOzwFy_XKnmAfLUQZ93xYFgfZb66d6453s05mVmVPBU1bKwhUm5HOiCvlihG13Idac/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
Intinya sobat harus bisa menyesuaikannya dengan template anda
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
0 comments:
Posting Komentar