Satu tips dan trik lagi dari saya, tentang cara menambahkan icon penulis, date, dan icon label di bawah judul postingan. Penambahan icon ini hanyalah sebagai penghias halaman blog anda agar tampak lebih cantik. Langsung saja bagaimana cara menambahkan icon penulis, date, dan label dibawah judul postingan dengan mudah ? Silahkan ikuti caranya dibawah ini
1. Login ke dashboard blog anda.
2. Pilih Template, klik Edit HTML, kemudin klik Expand Widget. Jangan lupa untuk back up sebelum anda mengedit templatenya, untuk menghindari hal-hal yang tidak di inginkan
3. Setelah itu cari kode ini
<div class='post-header-line-1>
4. Setelah ketemu kodenya, kemudian Copy kode dibawah dan Paste-kan tepat dibawahnya
<font style='background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEO8q-btWTVSmflCQh4fwGgW6o1PoeZI7OEWLC-xe5-39c6MFTzBr57POsyKSoTENd_X3-J6rcMHHDsVAiZ7DIEzt_KsUyYEqdsjlM8Lchlt4SBELIIZA26_R2tI63ukwMM1bcNsgtRiQ/s1600/author.png) no-repeat scroll top left;padding-left:25px;font-size:11px;'><data:post.author/></font> | <font style='background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNLAYnwfBpYMtAVHgP_v2cKchhDgwg_V70cB3PRgG5jB1SWvAAl2bZOPOhCWhnoH_mjJVQhIvebGBPe2YjKieJQu_qekp44Wrd6NRiIQ0I4jvKxbzbJ6ltxarUoqB5xDi3AY_O_-1DAyY/s1600/calendar.gif) no-repeat scroll top left;padding-left:25px;font-size:11px;'><data:post.timestamp/></font> | <font style='background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKDYDsKEcRyIkCBPi7_Vg9sm6BKOyOcXP5WnGlxsgt8wuzRBotsdBdFmcE_13gzMeZp8xVCSRBmgecIdYof1Njk6yf6E78z4JGeuayQrDLcL7uJJVNBdNX5JD_RR4PvCIziHW8Fevmclc/s1600/icon_tags.png) no-repeat scroll top left;padding-left:25px;font-size:11px;'><b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url + "?max-results=8"' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != "true"'>|</b:if>
</b:loop>
</b:if></font><a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgq3tZPgiTV2Rk2RKnnbc2er0cnY8uNMKcYN0Ho02ya3nNHWrgIFaLqE1w8OqCyoaM0p1YT63EdBbEO_HdCq0aqhK94nkmZXBtnGSacVbrL97qyoSFNAjG0UqRhTcK2ZxjE4G7PgnAd8Gi7/s1600/best+blogger+tips.png'/></a>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url + "?max-results=8"' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != "true"'>|</b:if>
</b:loop>
</b:if></font><a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgq3tZPgiTV2Rk2RKnnbc2er0cnY8uNMKcYN0Ho02ya3nNHWrgIFaLqE1w8OqCyoaM0p1YT63EdBbEO_HdCq0aqhK94nkmZXBtnGSacVbrL97qyoSFNAjG0UqRhTcK2ZxjE4G7PgnAd8Gi7/s1600/best+blogger+tips.png'/></a>
Kode warna Biru adalah Icon untuk Penulis/Author
Kode warna Merah adalah Icon untuk Date/Kalender
Kode warna Kuning adalah Icon untuk Label
Pengaturan tambahan :
Anda bisa mengganti gambar/images icon di atas dengan icon kreasi anda sendiri. Caranya hanya menganti url gambar di atas dengan url gambar kreasi anda.
5. Setelah selesai save template.
Dan lihat hasil icon kreasi anda.
No comments:
Post a Comment