Cara Membuat Post Meta Dengan Font Awesome

Halo selamat malam :D Kali ini saya akan share sebuat tutorial singkat, mungkin udah banyak yang share, kali ini saya akan membuat tutorialnya, ada yang belum tahu apa itu post meta? kurang lebih bisa lihat gambarnya di bawah ini :D

Kalau kamu bikin template sendiri, pasti belum ada yang seperti itu, kalaupun ada pasti masih standar dari blogscepot. Jadi bagi yang pengen tambah keren, silahkan lihat di bawah ini.
Heheh.. pengen tahu gimana buatnya Silahkan di simak :D

Copy code di bawah dan pastekan di atas </b:skin> atau </style>
.postmeta{font:10px Tahoma;text-transform:uppercase;font-weight:400;padding:5px 0;line-height:1.3em;border-bottom:1px solid #bbb} .author{color:#666;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE3WzXrA8EtVxfmNkdYi_WpxP9pF7QwrjAgLsu5uYX9QE__47klSMuCYzwPPp3Y3dpbFGMYr3wG0zgZ48PSFH7pYtEUyw6ZsMn9S4B3Hb9Z906lK-gMWFmfOsz6VSkoSuS7xe7rFkIwtzB/s1600/user.png) left center no-repeat;padding:2px 5px 2px 17px} .author a,.clock a,.comment a{color:#666} .author a:hover,.clock a:hover,.comment a:hover{color:#f4782c} .clock{color:#666;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivfS-nTtroI5KeWjy5rZvrlTNbkzc-VJWJ0BeYbyzpBiOPqBx3m9zrkJ__J-u-fujZZcitSEnlyLwku01kImWzP9c6hIx0ElsESRn8484BkRFHrx8pNUaBcp1tN70k1sEivUcAoWTK1Gm4/s1600/time.png) left center no-repeat;padding:2px 5px 2px 17px} .updated{border-bottom:none}
Setelah itu cari kode <div class='post-header'> dan taruh kode di bawah ini di atasnya
<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:blog.pageType != &quot;item&quot;'> <div class='postmeta'> <h3 class='date-header'><span class='author'><a class='g-profile' expr:href='data:post.authorProfileUrl' rel='author' target='_blank' title='Author Profile'> <span class='post-author vcard'> <span class='fn'><data:post.author/></span> </span></a> </span> <span class='clock'> On <a class='updated' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='updated' expr:title='data:post.timestampISO8601'> <data:post.timestamp/></abbr></a></span></h3> </div> </b:if></b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='postmeta'> <h3 class='date-header'><span class='author'><a class='g-profile' expr:href='data:post.authorProfileUrl' rel='author' target='_blank' title='Author Profile'> <span class='post-author vcard'> <span class='fn'><data:post.author/></span> </span></a> on <span class='post-labels'> <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' expr:title='data:label.name' rel='tag nofollow'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if> </b:loop> </b:if> </span></span> <span class='clock'> On <a class='updated' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='updated' expr:title='data:post.timestampISO8601'> <data:post.timestamp/></abbr></a><b:if cond='data:post.allowComments'> with <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' title='Comments'><b:if cond='data:post.numComments == 0'>No comments</b:if><b:if cond='data:post.numComments == 1'>1 comment</b:if><b:if cond='data:post.numComments &gt;= 2'><data:post.numComments/> comments</b:if></a></b:if></span></h3> </div> </b:if> <b:if cond='data:blog.pageType == &quot;static_page&quot;'> <div class='postmeta'> <h3 class='date-header'><span class='author'>Posted by : <a class='g-profile' expr:href='data:post.authorProfileUrl' rel='author' target='_blank' title='Author Profile'> <span class='post-author vcard'> <span class='fn'><data:post.author/></span> </span></a> </span> <span class='clock'> On <a class='updated' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='updated' expr:title='data:post.timestampISO8601'> <data:post.timestamp/></abbr></a><b:if cond='data:post.allowComments'> with <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' title='Comments'><b:if cond='data:post.numComments == 0'>No comments</b:if><b:if cond='data:post.numComments == 1'>1 comment</b:if><b:if cond='data:post.numComments &gt;= 2'><data:post.numComments/> comments</b:if></a></b:if></span></h3> </div> </b:if>
Simpan template dan lihat hasilnya.
Bagi yang masih bingung bisa ditanyakan lewat komentar

Cara Membuat Post Meta Dengan Font Awesome 2014-03-08T19:53:00+07:00 Rating: 4.5 Diposkan Oleh: fizzi