Minggu, 01 Juli 2012

Cara Membuat Scroll Pada Komentar Blog

Bagi sobat yang menginginkan blog kita tampil dengan lebih hemat tempat. Artinya tidak terlalu panjang blog kita memakan tempat dan waktu loading yang lama. Saat tulisan kita menarik, dan banyak komentar yang masuk, maka yang terjadi adalah kita harus memutar gerigi mouse sampai ke bawah sekali.

Nah.. bagi sobat yang menginginkan blog kita tampil dengan simple, tidak terlalu panjang atau lebar. Salah satu cara yang dapat kita lakukan adalah dengan membuat scroll pada area komentar blog kita. Dengan demikian blog kita akan lebih hemat tempat. Sehingga seseorang yang ingin berkomentar di postingan kita yang sudah banyak komentarnya tidak harus mengeser sampai ke bawah. ;)


Cara Membuat Scroll Pada Area Komentar :

1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Tata Letak.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode berikut ini <dl id='comments-block'>
6.  Setelah ketemu, taruh kode berikut ini di atasnya.
<div style='overflow:auto; width:ancho; height:400px;'>
7. Cari kode berikut ini </dl> dan taruh kode </div> di bawahnya.
Contoh lengkapnya seperti kode di bawah ini :
<div style='overflow:auto; width:ancho; height:300px;'>
      <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'><data:comment.author/></a>
            <b:else/>
              <data:comment.author/>
            </b:if>
            <data:commentPostedByMsg/>
          </dt>
          <b:if cond='data:comment.author == data:post.author'>
<dd class='owner-Body'>
<p><data:comment.body/></p>
</dd>
<b:else/>
          <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>
</b:if>
          <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>
8. Kode yang berwarna merah adalah kode yang kita tambahkan.
9. Simpan Template jika sudah selesai.

Sekian dulu tentang Cara Membuat Scroll Pada Komentar Blog
Jangan lupa untuk berkomentar agar saya dapat mengunjungi sobat kembali untuk mengucapkan terimakasihku atas kunjungan sobat. Selamat mencoba dan semoga sukses...

Tidak ada komentar:

Posting Komentar