Tulisan Post Comment Diluar Area Scroll

Setelah kemarin posting Problem Komentar User Friendly, sekarang kita lanjutkan pada topik Tulisan Post Comment Ada Diluar Area Scroll  seperti yang saya lakukan pada Blog ini yang menggunakan setting komentar Popup Widows atau Jendela Munculan.

Sebelumnya perlu diketahui mungkin susunan kodenya agak beda, karena blog ini :  

1. Sudah dipasang Fitur Threaded Comment dengan fungsi scroll
2. Tulisan Post a Comment sudah di ganti dengan Apa Komentar Anda..? Cara menggantinya ada disini

Sekarang baru masuk ke cara agar Tulisan Post Comment ( Apa Komentar Anda ) Ada Diluar Area Scroll . Supaya tahapannya lebih jelas sekaligus yang lebih penting lagi sebagai arsip buat saya, siapa tahu nanti akan dikembalikan ke tampilan semula , tahapan yang saya lakukan di blog ini adalah sbb. :

1. Login ke blogger.com – > Pilih Template – > Edit HTML
2. Klik Prooced / Lanjutkan –> Centang Expand Widget Templates
3. Karena sudah ada fungsi scroll ( yang warna merah) maka bisa mencari kode itu atau cari kode <b:includable id='threaded_comments' var='post'>, Gunakan Ctrl+F untuk memudahkan mencarinya. Lengkapnya seperti ini : ( Kode ini hanya untuk check aja tidak diganggu )

   <b:includable id='threaded_comments' var='post'>
     <div class='comments' id='comments' style='max-height:400px;overflow:auto;'>
       <a name='comments'/>
       <h4><data:post.commentLabelFull/>:</h4>

4. Yang lebih penting sebenarnya cari kode <b:includable id='comments' var='post'>, dibawahnya juga ada fungsi scroll , Naah.. fungsi scroll  inilah yang kita hapus. kode lengkapnya :

   <b:includable id='feedLinksBody' var='links'>
   </b:includable>
   <b:includable id='comments' var='post'>
   <div class='comments' id='comments' style='max-height:400px;overflow:auto;'>
         <a name='comments'/>
       <b:if cond='data:post.allowComments'>
         <h4>

   Ingat hapus juga </div> sebagai tag penutupnya ,  letaknya jauh dibawah pada rangkaian kode seperti ini :

   <div id='backlinks-container'>
       <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
          <b:if cond='data:post.showBacklinks'>
            <b:include data='post' name='backlinks'/>
          </b:if>
       </div>  </div>   </div>

5. Agar tulisan Post a comment ada diluar area scroll, maka Kode scroll yang warna merah pada nomor 4 diatas di cut kemudian simpan dulu di notepad. .. eiit.. sebentar.. rokok jatuh nih.. mana tinggal sebatang lagi… .. Ok sekarang dilanjut ya.. tanggung nih..
6. Cari kode  <dl id='comments-block'>  jika sudah ketemu.. maka sebelum atau diatas  kode inilah kita pastekan kode scroll yang kita simpan di notepad tadi.  Ingat jangan lupa sesuaikan penyimpanan tag penutupnya (</div>).   Lebih jelasnya rangkaian kode tersebut jadi seperti ini : ( lihat kode warna merah yang ditambahkan ).

   <div class='comments' id='comments' style='max-height:400px;overflow:auto;'>
         <dl 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'>
               <a expr:name='data:comment.anchorName'/>
               <b:if cond='data:comment.authorUrl'>
                 <a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'><data:comment.author/></a> on                 <data:comment.timestamp/>
               <b:else/>
                 <data:comment.author/>
               </b:if>
               <data:commentPostedByMsg/>
               <span><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=1332095604392052249&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%3A%20#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=450,height=450&quot;); return false;' style='padding:0px 5px; border:1px solid #999;'>Reply</a></span>
             <br/>  </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'>
             </dd>  </b:loop>   </dl>    </div>
         <b:if cond='data:post.commentPagingRequired'>
           <span class='paging-control-container'>
          

7. Simpan template.  Itulah kode terakhir untuk menempatkan tulisan post a comment berada diluar area scroll.. .  Mungkin rangkain kode tersebut berbeda pada setiap template apalagi ini berada pada area perluasan atau Expand Widget Templates di Centang yang tentu setiap perubahan atau penempatan widget akan merubah pula susunannya. Intinya ada pada kode pertama yang harus kita cari tersebut. 
8. Sebagai bahan bandingan pada blog Link Tea kodenya seperti ini :

   <div class='comments' id='comments' style='max-height:400px;overflow:auto;'>
         <dl 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'>
               <a expr:name='data:comment.anchorName'/>
               <b:if cond='data:comment.authorUrl'>
                 <a expr:href='data:comment.authorUrl' target='_blank'><data:comment.author/></a> on                 <data:comment.timestamp/>
               <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'>
             </dd>  </b:loop>  </dl> </div>

9. Kalau ada sobat yang bertanya kenapa repot2 memindahkan tulisan pos a comment keluar area scroll ??. Jawabannya sangat subjektif , terletak pada persepsi masing2.. dan jawaban saya adalah… ah iseng2 aja kok.. dari pada ngelamun jorok ngebayangin si cantik Alexa yang lsngsing akrena diet . hehe…
10. Selesai.. tinggal udud..

Sampai disini  Tulisan Post Comment Ada Diluar Area Scroll  , berarti janji saya pada postingan Problem Komentar User Friendly..tuntas sudah, tas..tas.., seperti :

• Cara Mematikan Link Aktif Pada Komentar Blogger ada disini
• Cara Mengganti Tulisan Post Comment Dengan Kata Lain, lihat disini
• Memindahkan Tulisan Post Comment Ke Luar Area Scroll komentar. postingan yang sedang sobat baca ini..

Yups.. Senang rasanya jelang akhir tahun 2012 ini tak punya utang. haha…