Minggu, 08 Desember 2013

Cara Mudah Membuat Threaded Comment DoFollow

Satu yang menjadi kelemahan blog dengan aliran dofollow ini adalah tidak tersedianya fitur repley comment,dimana fitur ini memudahkan kita untuk merepley setiap komen yang masuk,karena bukankah kita ingin bersikap friendly pada visitor kita,..merepley komen visitor kita adalah salah satu cara bagaimana bersikap friendly

Ok sob kita lansung saja tutorialnya,....
  • silahkan sobat masuk di halaman edit template pada blog sobat yang akan diaktifkan fitur repleynya
  • seperti biasa klik dulu klik dulu Expand Template Widget, terus sobat copas semua kode template sobat untuk berjaga jaga kalau gagal,....(tapi aku telah mencobanya dan insya Allah pasti berhasil sob),..
  • sobat cari kode ]]></b:skin>
  • sobat copy dan paste kode dibwah ini sebelum kode ]]></b:skin> tadi,..kode seperti ini...
#comments h4 {font-size: 18px;font-weight: normal;margin: 20px 0}
.cm_wrap {clear: both;margin-bottom: 10px;float: right;width: 100%}
.cm_head {margin: 0;width:60px;float: left}
.cm_avatar {margin: 0;vertical-align: middle;outline: 1px solid #fff;border: 1px solid #ddd;padding: 3px;background-image:  url(http://4.bp.blogspot.com/-0DZ_H39lqFk/Tv9l8EN_UeI/AAAAAAAACJg/Lxko1duJxfc/s1600/author_comment.jpg);background-position:center;background-repeat:no-repeat;width: 35px;height: 35px}
.cm_avatar_a {margin: 0;vertical-align: middle;border: 1px solid #ddd;padding: 3px;
background:#c6e5f7;background-position:center;background-repeat:no-repeat;width: 35px;height: 35px}
.cm_reply {padding-top: 5px}
.cm_reply a {display: inline-block;margin: 0;padding: 1px 6px;border: 1px solid #C4C4C4;border-top-color: #E4E4E4;border-left-color: #E4E4E4;color: #424242 !important;text-align: center;text-shadow: 0 -1px 0 white;text-decoration: none;
-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;background: #EDEDED;background: -webkit-gradient( linear, left top, left bottom, color-stop(.2, white), color-stop(1, #E5E5E5) );background: -moz-linear-gradient( center top, white 20%, #E5E5E5 100% );font: 11px/18px sans-serif}
.cm_reply a:hover {text-decoration: none !important;;background: #ccc;;background: -webkit-gradient(linear,left top,left bottom,color-stop(.2, #eeeeee),color-stop(1, #cccccc));;background: -moz-linear-gradient(center top,#eeeeee 20%,#cccccc 100%);;
}
.cm_entry {padding: 16px;background: #FCFCFC;outline: 1px solid #fff;border: 1px solid #ddd;overflow: hidden}
.cm_entry_a {padding: 16px;background: #FCFCFC;outline: 1px solid #fff;border: 1px solid #ddd;overflow: hidden}
.cm_arrow {display: block;width: 9px;height: 18px;background: url(http://3.bp.blogspot.com/-NONrBLhghFk/To0nNB1LmkI/AAAAAAAAAI4/CAuzDfYiCiU/s1600/comment-arrow.gif) no-repeat;position: absolute;margin-left: -25px}
.cm_info {margin-bottom: 5px;border: thin solid #E6E6E6;background-color: #F4F4F4;padding: 5px}
.cm_info_a {margin-bottom: 5px;border: thin solid #E6E6E6;background-color: #dff0fa;
padding: 5px}
.cm_name {font-size: 13px;color: #666666 !important;text-decoration:none;font-weight: bold;float: left}
.cm_name_a {font-size: 13px;color: #666666 !important;text-decoration:none;font-weight: 250;float: left}
.cm_date {font-size: 10px;color: #999;text-decoration:none;float: right}
.cm_date_a {font-size: 10px;color: #2D5E7B;text-decoration:none;float: right;
padding-top:5px}
.cm_entry p {padding: 5px;line-height:1.4em;clear: both;border: thin solid #E6E6E6;background-color: #F4F4F4;font-size: 13px;color: #333;word-wrap:break-word}
.cm_entry_a p {padding: 5px;clear: both;border: thin solid #E6E6E6;background-color:  #dff0fa;font-size: 13px;color: #333;word-wrap:break-word}
.cm_pagenavi {font-size: 10px;text-transform: uppercase;color: #666;text-shadow: 1px 1px white;font-weight: bold}
.cm_pagenavi a {color: #666;text-decoration: none;padding:10px}
.cm_pagenavi a:hover {text-decoration: underline}
.cm_pagenavi span {color: #888;background: white;padding: 4px;border: 1px solid #E0E0E0}
.owner-Body p{margin-bottom: 5px;border: thin solid #E6E6E6;background:#EFF5FB;padding: 5px}


  • setelah itu sobat letakan kode dibawah ini sebelum kode </body> 
<script src='http://miscah.googlecode.com/files/comment-replay.js' type='text/javascript'/>
  • setelah itu sobat cari lagi kode <b:includable id='comments' var='post'> kemudian sobat scrool sampai ditemukannya kode penutupnya yaitu kode </b:includable>setelah ditemukan sobat ganti semua kode diantara kode tersebut  dengan kode dibawah ini. 

    <b:includable id='comments' var='post'>
    <div class='comments' id='comments'>
    <a name='comments'/>
    <b:if cond='data:post.allowComments'>
    <h4>
    <b:if cond='data:post.numComments &gt; 0'>
    <b:if cond='data:post.numComments == 1'>
    <span id='cm_total'>1</span> comment
    <b:else/>
    <span id='cm_total'><data:post.numComments/></span> comments
    </b:if>
    </b:if>
    </h4>
    <div id='cm_reply_css'/>
    <div class='cm_pagenavi' id='cm_page'/>
    <div id='cm_block'>
    <b:loop values='data:post.comments' var='comment'>
    <b:if cond='data:comment.isDeleted'>
    <b:else/>
    <div expr:id='data:comment.anchorName'>
    <div class='cm_wrap'>
    <a expr:name='data:comment.anchorName'/>
    <div class='cm_head'>
    <div class='cm_avatar'>
    <b:if cond='data:blog.enabledCommentProfileImages'>
    <data:comment.authorAvatarImage/>
    </b:if>                      
    </div>
    <div class='cm_reply'>
    <a expr:href='&quot;https://www.blogger.com/comment.g?blogID=34718503359036900342&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=600,height=500&quot;); return false;'>Reply</a>
    </div>
    </div>

    <div class='cm_entry'>
    <span class='cm_arrow'/>
    <div class='cm_info'>
    <div class='cm_name'>
    <b:if cond='data:comment.authorUrl'>
    <a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'>
    <data:comment.author/>
    </a>
    <b:else/>
    <b><data:comment.author/></b>
    </b:if>
    </div>
    <div class='cm_date'>
    <data:comment.timestamp/>
    <b:include data='comment' name='commentDeleteIcon'/>
    </div>
    <div class='clear'/>                                
    </div>                            
    <b:if cond='data:comment.author == data:post.author'>
    <div class='owner-Body'>
    <p><data:comment.body/></p>
    </div>
    <b:else/>
    <div 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>
    </div>
    </b:if>

    </div>
    </div>
    </div>
    </b:if>            
    </b:loop>
    </div>

    <div class='cm_pagenavi' id='cm_page_copy'/>
    <b:if cond='data:post.embedCommentForm'>
    <b:if cond='data:post.allowNewComments'>
    <b:include data='post' name='comment-form'/>
    <b:else/>
    <data:post.noNewCommentsText/>
    </b:if>
    <b:else/>
    <b:if cond='data:post.allowComments'>
    <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
    </b:if>
    </b:if>
    </b:if>
    </div>
    </b:includable>
  • di kode tersebut diatas terdapat angka dengan berwarna merah,silahkan sobat ganti dengan blogid sobat
  • setelah sobat simpan perubahan yang sudah dilakukan,...tapi belum selesai sob,...langkah selanjutnya silahkan sobat melakukan pencarian kode rel=nofollow lagi,dan kode ini terdapat pada paket kode threaded comment yang barusan sobat copas tadi,kode tersebut sobat ganti dengan rel=dofollow
  • setelah semuanya selesai silahkan simpan sekali lagi perubahan yang sobat sudah lakukan dan silahkan lihat hasilnya
Nampak blog sobat yang beraliran dofollow tapi tetap memiliki fitur repley atau threaded comment,untuk contoh dari hasil pekerjaan tersebut diatas silahkan sobat berkunjung di halaman Test Reply Comment Blog Dofollow,karena siapa tau saja sobat masih ragu.


Sumber: http://sarifpbg.blogspot.com/2013/01/cara-mudah-membuat-fitur-threaded.html



share this article to: Facebook Twitter Google+ Linkedin Technorati Digg
Posted by Seribu Arsip, Published at 06.42 and have 0 komentar

Tidak ada komentar:

Posting Komentar

Berkomentarlah secara sopan dan bijak !