Membuat info hcard dibawah judul postingan

Salam buat sobat blogging juga teman online dan brader  semuanya senang rasanya  kita  masih
Bertatap muka dan bertemu kembali di  next  posts  saya ini semoga anda semua baik - baik saja
Baiklah pada  postingan saya  kali ini  akan sedikit  berbagi  tutorial  yang sebenarnya  tidak asing
Lagi di kalangan dunia web site ataupun  blogging tentang author ataupun seorang  penulis pada
Blog pada tips trik saya kali ini akan share cara membuat tulisan  author lengkap  dengan tanggal
Dan jumlah komentar saat kita membuat artikel dan tampil dibawah judul artikel  secara otomatis
Setelah kemarin saya publish Negara yang terkenal seni bela dirinya dan di pertemuan yang baik
Ini saya akan berbagi buat anda yang berminat  memasang info hcard pada postingan  blog anda

Baca juga artikel lainya :  Cara publikasikan postingan yang ideal

Membuat info hcard dibawah judul postingan ini mempermudah penulisan seorang  penulis blog
Secara otomatic  dan biasanya  penempatanya  ada  di bawah judul  postingan seperti  di blog ini
Atau juga di bawah akhir postingan dan  kegunaanya sudah pasti  banyak contoh  sedikitnya yaitu
Memberitahu pada pengunjung tentang si penulis  artikel juga tanggal waktu publish  dan jumlah
Komentator yang sudah ada pada artikel yang akan dibacanya kelebihan lain pastinya masih ada
Tutorial ini  sudah di  posting oleh   Kang Adhy Kompi Ajaib  namun saya reposts  dengan sedikit
Melengkapi teks penyajianya yang sedikit berbeda  namun intinya sama yang berminat silahkan :

Cara penerapanya :

Pastikan anda masuk di dasboard blog anda pilih template dan pilih edite template kemudian cari
Kode  ]]></b:skin>  atau  </style>  gunakan  Ctrl + F  untuk memudahkan pencarian
Lalu copy kode dibawah ini dan selanjutnya pastekan tepat diatas kode  ]]></b:skin>
atau diatas kode  </style>

h3.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/AVvXsEhNusAV0gh3PQMK0Mxys1mQLRbvTBxFiZU6ZKh1VW_echWjGriuzBegB85URGHyvv9Qm-MVt6yByCJVRJtE-KlPfhOjyiwZfmQCWP0AHIhue-u7KWKJZOPT-ykWGOp3PEaGbeLkBTACSPWP/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/AVvXsEiPLNiqV-r_HuVHpplqm53zvImSEvP6LCaD01u3UBxnykQ8Stn90WM-jHAj4sTwLfjWHDhifAFDwzeU2-44IOOIiesFGfZwiq5EVBkku1eoZsdB8iX6CEtBih4Nmrfz2BTBevSbPtgiv_ZL/s1600/time.png) left center no-repeat;padding:2px 5px 2px 17px}
.updated{border-bottom:none}

Jika  di blog  anda  memang  belum  terpasang  author silahkan  ikuti  petunjuk  pemasangan  tutorial ini
Namun jika  di blog  anda sudah  terpasang  tetapi ingin  memakai  trik ini alangkah  baiknya hapus dulu
Yang berada di blog anda dan lanjut pemasangan hcard author ini silahkan untuk pemasangan lanjutan

Cari kode :  <div class='post-header-line-1'/> </div>
kemudian copy kode di bawah ini dan pastekan Tepat di bawah kode
<div class='post-header-line-1'/> </div>  Atau simpan kode no 2 di bawah judul postingan jika tidak nampak

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<h3 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 &gt;= 2'><data:post.numComments/> comments</b:if></a></b:if></span></h3>
</b:if>

Keterangan :

Tampilan hcard author ini akan tampil pada semua halaman posting  juga halaman stastic
Juga halaman homepage (beranda) jika menginginkan hcard author  hanya pada halaman
Postingan saja silahkan copy kode di bawah ini dan pastekan tepat di bawah kode  ]]></b:skin>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style type='text/css'>
.date-header{display:none}
</style>
</b:if></b:if>

Langkah terakhir :

Jika sudah terpasang semuanya dengan benar maka silahkan save
Dan lihat lah  penampakan  di bawah judul  postingan anda jika ada
Kesulitan  silahkan  diskusikan  pada kolom  komentar  di bawah ini
Terima kasih atas kunjunganya semoga bermanfaat ...

source : www.kompiajaib.com