Sobat 2-Bersaudara entah kenapa siang hari ini saya tertarik dengan blog tetangga yang dibawah judul postingnya sangat begus dan bikin saya tertarik ingin memilikinya soalnya dibawah judul postingnya terdapat Nama Author, Tanggal Post dan Jumlah Komentar. Sebagian blog sobat sudah terpasang nah untuk yang belum terpasang yukkk mari ngumpul kesini dan akan segera saya bahas cara pemasanggannya.
Cara memasangnya tidak terlalu sulid hanya diperlukan ketelitian dan kesabaran dalam bekerja, jika sobat tidak bisa memiliki itu dan tidak bisa berjiwa seperti itu maka pemasangan ini bisa jadi malah berantakan ettts bukan hanya pekerjaan ini saja tetapi setiap pekerjaan yang lain juga harus memiliki dan sangat diperlukan ketelitian dan harus sabar.
Okedeh mungkin hanya itu yang dapat saya samapaikan kepada sobat 2-Bersaudara, heee maaf jika perkataan saya diatas kurang sopan terhadap kalian semua.
Langkah ke I : Pemasangan kode CSS
NB:Sebelum memulai pekerjaan edit template alangakah baiknya berdo'a dan BackUp terlebih dahulu templatenya.
- Cari kode ]]></b:skin> tekan CTRL + F untuk mempermudahkan pencarian.
- Copy kode CSS dibawah ini lalu pastekan sebelum kode ]]></b:skin>
/* CSS Author, Tgl Post dan Jml Komen by www.ber2saudara.blogspot.com
------------------------------------------------------------------------ */
h2.date-header {
font: 9px Arial;
text-transform: uppercase;
font-weight: 400;
color: #191970;
line-
height: 1.3em;
margin: .1em 0;
}
.postmeta {
font: 9px Arial;
text-transform: uppercase;
font-weight: 400;
padding: 5px 20px;
line-height: 1.3em;
border-bottom: 1px solid #bbb;
}
.author {
color: #191970;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAlCrh-G1pui9SifIkjkxv7WLwvUt6cFHTor90QBaRMzwNG4ZeuwFABhyk0nFyetl2Tnft3l0fyhH_zerFYPhVOe6kAE6EIHA22N0kT7wNgMlYDk4dAo0jszt2s1mXnyQDFU-wIB9CI_NU/s1600/user.png) left center no-repeat;
padding: 2px 5px 2px 17px;
}
.author a,.clock a,.comment a {
color: #191970;
}
.author a:hover,.clock a:hover,.comment a:hover {
color: #20c1ea;
}
.clock {
color: #999;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr8fFbd4fXeaQcMYSI67muCZL-Yrj_WOdUs3ApPqItkgZnU4At1gMsHjTj8H8Xk5_pwmoNCFKpGuysWC22BnWoMTcwwui5qNVkPlvks_SHKZ3vRVWCxajKxeHml5tngbMoYroXR1cj2cUW/s1600/time.png) left center no-repeat;
padding: 2px 5px 2px 17px;
}
.updated {
border-bottom: none;
}Langkah ke II : Pemasangan kode JavaScript
- Copy kode ini post-header
- Cari kode yang mirip dengan kode dibawah ini, biasanya terdapat 2 kode yang mirip dengan kode dibawah lalu sobat pilih kode yang kedua (Terakhir)
<div class='post-header'>
<div class='post-header-line-1'/>
</div>
- Copy kode JavaScript dibawah ini dan pastekan tepat dibawah kode diatas
<b:if cond='data:post.dateHeader'>
<script>var ultimaFecha = '<data:post.dateHeader/>';</script>
<h2 class='date-header'><span class='author'><b:if cond='data:top.showAuthor'><data:top.authorLabel/></b:if> : <a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
<span class='post-author vcard'>
<span class='fn'><data:post.author/></span>
</span></a> </span>
<span class='clock'> Posted on <data:post.dateHeader/> - <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 >= 2'><data:post.numComments/> comments</b:if></a></b:if></span></h2>
<b:else/>
<h2 class='date-header'>
<script>document.write(ultimaFecha);</script>
</h2>
</b:if> Untuk lebih jelas Silahkan lihat gambar dibawah ini Klick Untuk Memperbesar Gambar.
