Cara Tampilkan Tanggal Di Postingan Blog

Selamat Sore Teman-teman Blogsmanado, pas lagi ada waktu mari kita sama-sama belajar tips-trik design template blogger. Ok langsung saja kita buat Cara Tampilkan Tanggal Di Postingan Blog.

1. Login ke Blogger
2. Masuk ke Rancangan >> Edit HTML
3. Centang Expand Template Widget
4. Tambahkan kode CSS dibawah ini sebelum kode ]]></b:skin>

.tanggal, .penulis, .kategori { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqWO4ShlvjKoAfh1557HFvXZD79rmkBteTz8T8bi6bMD_lH6zef3KoazVDL3FugtC9ajQO_OAhhlfwARddlSle2Zj23t-G5GwAJyC6UnuhE_afKcCTjKVHeEWhzYhvq7ySMZWQ56J_Fxjf/s320/icons.png) no-repeat }
.date { padding:0px; float:right; text-align:right; font-weight:normal; font-size:13px; margin:0 0 0 13px; }
.tanggal {background-position: 3px -66px; height:16px; padding:0 0 0 23px; color:#333; }
.info{margin-top:-7px;padding-top:-5px;line-height:2em;font-size:13px; text-align:left; }
.penulis {background-position:3px 0; height:16px; padding:0 0 0 23px; color:#333; margin-right:6px; }
.kategori {background-position:3px -22px; height:16px; padding:0 0 0 23px; margin:0 0 0 4px }

5. Jika sudah cari kode seperti ini :
<article class='post hentry' expr:id='data:post.id'>
atau kode mirip seperti ini:
<b:else/>
<h1 class='post-title entry-title'> <b:if cond='data:post.link'> <a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a> <b:else/> <b:if cond='data:post.url'> <a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a> <b:else/> <data:post.title/> </b:if>
</b:if>
</h1>

Kalau dapat kode seperti ini: <article class='post hentry' expr:id='data:post.id'> taruh kode dibawah diatas kode <article class='post hentry' expr:id='data:post.id'>.


Kalau kode yang yang mirip seperti ini: <b:else/>
<h1 class='post-title entry-title'> <b:if cond='data:post.link'> <a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a> <b:else/> <b:if cond='data:post.url'> <a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a> <b:else/> <data:post.title/> </b:if>
</b:if>
</h1> taruh kode dibawah ini diatas kode tadi:

<div class='info'><span class='penulis'><span class='vcard'><span class='hcard'> <span class='fn n'> <span class='given-name'><data:post.author/></span></span></span></span></span> <span class='kategori'><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if> </b:loop> </b:if></span>
<span class='tanggal'><abbr class='updated published' expr:title='data:post.timestampISO8601'><data:post.dateHeader/></abbr></span><div class='clear'/></div>

6. Setelah itu Simpan, dan lihat Tampilkan Tanggal Di Postingan seperti BlogsManado. Kalau ingin seperti Tampilkan Tanggal Di Postingan seperti BlogsManado taruh kode diatas, diatas kode <article class='post hentry' expr:id='data:post.id'>. Semoga bermanfaaf.