Selasa, 02 Juli 2013

Cara Membuat Recent Post Dengan Avatar

Cara Membuat Recent Post Dengan Avatar Di Blog

Cara Membuat Recent Post Dengan Avatar Di Blog - Mungkin bagi sebagian blogger sudah tau dengan script dan tutorial Membuat Recent Comment. Tapi disini saya hanya ingin berbagi kepada blogger yang belum tau dengan Script dan Tutorial ini. Widget recent post ini sangat berguna untuk Admin maupun pengunjung dan widget ini juga tidak terlalu memakan tempat.

Widget Recent Comment adalah widget yang memunculkan komentar terbaru di suatu postingan. Widget ini juga mempermudah untuk Admin blog yang ingin mengecek apabila ada suatu komentar baru. Dan widget ini ramah terhadap blog karena tidak membuat loading blog berat.


  • Login Ke Blogger
  • Klik Tata Letak
  • Klik Tambah Gadget >> Edit HTML/Javascript
  • Masukkan kode berikut

<div style="overflow:auto;width:auto;height:200px;border:1px solid #ccc; padding:10px; margin:0 auto;background:transparent;"> <style type="text/css"> ul.w2b_recent_comments{list-style:none;margin:0;padding:0;} .w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;} .w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;} .avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;} .w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;} .w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;} </style>
<script type="text/javascript">
 //<![CDATA[
 // Recent Comments Settings
var
numComments = 10,
showAvatar     = true,
 avatarSize      = 35,
 roundAvatar   = true,
characters       = 250,
defaultAvatar  = "",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src=" http://rizaldipriantamascript.googlecode.com/files/Recent_Comments_.js "></script> <script type="text/javascript" src="http://koran-artikel.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=100"></script></div>

  • Simpan
Keterangan :

Kode yang berwarna PINK adalah Tinggi dari widget Recent Comment
Kode yang berwarna KUNING adalah Jumlah Komentar yg akan ditampilkan
Kode yang berwarna MERAH adalah Gambar Avatar yg akan ditampilkan
Kode yang berwarna HIJAU adalah Maximal kata yg akan ditampilkan
Kode yang berwarna BIRU adalah URL Blog sobat

Itulah Tutorial Cara Membuat Recent Post Dengan Avatar. Terima kasih sudah membaca artikel ini, semoga bermanfaat dan menambah wawasan kita dalam dunia blogger.

3 comments

keren sob, kapan2 gw coba deh.
comment back ya.

sangat menarik sob, pasti banyak yg mencari artikel yg seperti ni :)

Terima kasih telah mengunjungi blog sederhana Koran Artikel
Saya harap sobat mau mematuhi peraturan berkomentar di blog ini :

1. Dilarang SPAM
2. Dilarang berkomentar yang mengandung unsur Porno, Sara, Judi
3. Dilarang OOT (Out Of Topic)
4. Dilarang Live Link
5. Berkomentarlah yang Sopan dan Relevan

Regards,
EmoticonEmoticon