Menampilkan Foto Pengunjung Pada Komentar

Saya pernah melihat di blog wordpres,dan saya sangat tertarik dengan foto-foto yang ada pada komentar,jadi setiap pengunjung jika meninggalkan komentar pasti ada fotonya,"ketika itu saya berkunjung di blognya Mas Fatih",lama saya tahu juga caranya menampilkan foto-foto di kolom komentar layaknya wordpress,Kawan, pengen tahu ngak caranya??? Ni cara-cara yang harus kamu ikuti :
  1. Login Ke www.blogger.com
  2. Sudah masuk menu dasboard-kan langsung saja klik lay out/tata letak => Edit HTML
  3. Centang tanda expand widgetnya,dan cari kode ini <dl id='comments-block'>
  4. Sudah ketemukan? dan perhatikan semua scriptnya sampai dengan kode </dl>dan sisipkan kode-kode warna biru ini,seperti terlihat di bawah ini
    <dl id='comments-block'>
    <b:loop values='data:post.comments' var='comment'>
    <dt class='comment-author' expr:id='"comment-" + data:comment.id'>
    <div class='commentphoto' style='float:right;'/>
    <a expr:name='"comment-" + data:comment.id'/>
    <b:if cond='data:comment.authorUrl'><a          expr:href='data:comment.authorUrl'        rel='nofollow'><data:comment.author/></a>
    <b:else/>
    <data:comment.author/>
    </b:if>
    <data:commentPostedByMsg/>
    </dt>
    <dd class='comment-body'>
    <b:if cond='data:comment.isDeleted'>
    <span class='deleted-comment'><data:comment.body/></span>
    <b:else/>
    <p><data:comment.body/></p>
    </b:if>
    </dd>
    <dd class='comment-footer'>
    <span class='comment-timestamp'>
    <a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
    <data:comment.timestamp/>
    </a>
    <b:include data='comment' name='commentDeleteIcon'/>
    </span>
    </dd>
    <div style='clear:both;'/>
    </b:loop>
    </dl>
  5. Kalau sudah taruh script di bawah ini di atasnya kode </head> ni scriptnya

    <script src='http://www.geocities.com/oom_directory/photos.js' type='text/javascript'/>
    <script type='text/javascript'>
    //<![CDATA[
    BloggerProfiles.noimage = 'http://i294.photobucket.com/albums/mm109/mus_024/kucing-1.gif';
    BloggerProfiles.imageWidth = 30;
    BloggerProfiles.imageHeight = 30;
    addLoadEvent(function(){showCommentPhotos('commentphoto','comment-author', 1);});
    //]]>
    </script>
  6. Langkah terakhir tinggal kamu Save,Goodluck Fren!!

Keterangan:

<div class='commentphoto' style='float:right;'/> Ini merupakan pengaturan letak fotonya,di kiri atau di kanan,jika menghendaki di kiri tinggal kamu ubah saja kata Right dengan left
BloggerProfiles.imageWidth = 30; ini adalah ukuran foto yang akan tampul tinggal kamu ubah saja sesuka kamu.

9 comments:

  1. Thank buat infonya, ini yang gua cari.

    ReplyDelete
  2. Makasih mas atas infonya....

    ReplyDelete
  3. waduh, bermanfaat sekali tips ini.
    terima kasih ya.
    aku coba deh.

    ReplyDelete
  4. salam kenal

    terimakasih tutorialnya saya simpan dulu buat suatu saat saya pakai untuk blog saya yang lain

    ReplyDelete
  5. tq.. infonya... salam knal.

    ReplyDelete
  6. ikutan ngetest gan.... hehe!!!!!

    ReplyDelete

Pengen Backlink dari blog saya,silahkan tinggalkan komentar!!
Pastikan alamat Blog / Web diketik dengan benar dan terima kasih atas kunjunganya.,.!!!