24/05/12

MENAMBAH SCROLL PADA KOLOM KOMENTAR DI BLOG

Bagi bro-bro yang tidak ingin pada kolom komentar terlihat memanjang ke bawah karena sering kebanjiran komentar, bisa menambah fungsi scroll pada kolom komentar. Untuk membuatnya sobat cukup menambahkan sedikit kode.
Caranya:
  • Masuk ke blog bro.
  • Pilih tata letak.
  • Klik edit HTML.
  • Beri tanta pada Expand Template Widget.
  • Ini adalah kode yang harus ditambahkan.

    <div class="scrollbox" style="overflow:auto; height:350px; width:600px;">
    .............................................
    .............................................
    .............................................

    </div>

  • Tambahkan kode di atas ke kode di bawah ini.
    Kode yang berwarna merah adalah kode di atas setelah ditambahkan.
    <div class="scrollbox" style="overflow:auto; height:350px; width:600px;">
    <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
    <b:loop values='data:post.comments' var='comment'>
    <dt expr:class='"comment-author " + 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>

  • Jangan lupa klik simpan.
  • Lihat hasilnya.
Bro bisa menyesuaikan tinggi dan lebar kolom komentar sesuai dengan template yang Bro punya.

Tidak ada komentar :

Posting Komentar