Cara Membuat Show Hide Komentar Dengan Javascrift

Cara Membuat Show Hide Komentar Dengan Javascrift,show hide dalam istilah blogger pasti sudah tidak asing lagi.namun kebanyakannya komentar show hide ini banyak di dominasi dengan kode scrift jqury.nah bagi sobat yang kepingin membuat kotak komentar show hide nya nggak pakai jquery ikutilah langkah-langkah di bawah. Pertama,masuk ke Dashboard, lalu Tata Letak, kemudian pilih tab Edit HTML.
Lalu contreng check box tulisan Expand Widget Templates, setelah itu cari kode:.

</head>

Setelah ketemu letakkan kode di bawah ini tepat di atas </head>

<script language="javascript">
function toggle() {
var ele = document.getElementById("toggleText");
var text = document.getElementById("displayText");
if(ele.style.display == "block") {
ele.style.display = "none";
text.innerHTML = "Show Comments";
}
else {
ele.style.display = "block";
text.innerHTML = "Hide Comments";
}
}
</script>

Setelah itu cari kode berikut:

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
        <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
          <b:if cond='data:comment.favicon'>
            <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
          </b:if>
          <a expr:name='data:comment.anchorName'/>
          <b:if cond='data:blog.enabledCommentProfileImages'>
            <data:comment.authorAvatarImage/>
          </b:if>
          <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='data:comment.url' title='comment permalink'>
              <data:comment.timestamp/>
            </a>
            <b:include data='comment' name='commentDeleteIcon'/>
          </span>
        </dd>
      </b:loop>
</dl>


Untuk mempermudah pencarian kode gunakan Ctrl+F pada keyboard sobat.
Jika sudah ketemu, gantilah kode di atas dengan kode dibawah ini :


<a href='javascript:toggle();' id='displayText'>Show/Hide Comments</a>
<div id='toggleText' style='display: none;'>
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
 <b:if cond='data:comment.favicon'>
   <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
 </b:if>
 <a expr:name='data:comment.anchorName'/>
 <b:if cond='data:blog.enabledCommentProfileImages'>
   <data:comment.authorAvatarImage/>
 </b:if>
 <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='data:comment.url' title='comment permalink'>
     <data:comment.timestamp/>
   </a>
   <b:include data='comment' name='commentDeleteIcon'/>
 </span>
</dd>
</b:loop>
</dl>
</div>

Nah sudah selesai,tapi sebelum melihat hasilnya di preview dulu kalau sudah tidak ada erorr silahkan anda save.sekian dulu deh tutorial cara membuat Cara Membuat Show Hide Komentar Dengan Javascrift kali ini semoga bermanfaat dan selamat mencoba dan semoga berhasil.

Sobat sedang membaca artikel tentang Cara Membuat Show Hide Komentar Dengan Javascrift. Silahkan baca artikel dj4ru3c0k74t12 Tentang Sharing Tutorial yang lainnya.

Description: Cara Membuat Show Hide Komentar Dengan Javascrift Rating: 3.5 Reviewer: Shada ItemReviewed: Cara Membuat Show Hide Komentar Dengan Javascrift

Artikel Terkait: