Chủ Nhật, 23 tháng 1, 2011

Membuat Scroll Pada Kotak Komentar Blogger

Sebuah komentar sangat diperlukan untuk sebuah blog, karena dengan adanya komentar kita jadi tahu seberapa sering blog kita dikunjungi orang. Komentar yang datang ke blog kita bisa berupa pujian ataupun kritikan. Tapi apabila blog anda mempunyai komentar yang cukup banyak, maka akan banyak space yang tersita. Nah, untuk menghemat space di blog temen-temen mungkin anda ingin menggunakan scroll pada daftar komentar di blog anda. Jika temen-temen tertarik berikut ini adalah langkah-langkah pembuatannya :
  1. Login ke account blogger anda
  2. Kemudian klik Tata Letak,
  3. Lalu klik Edit HTML. jangan lupa centang  expand widget template
  4. Cari kode yang mirip seperti ini:
    <dl id='comments-block'>
    <b:loop values='data:post.comments' var='comment'>
    <dt class='comment-author' expr:id='&quot;comment-&quot; + data:comment.id'>
    <a expr:name='&quot;comment-&quot; + data:comment.id'/>
    <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='comment-body-author'>
    <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='&quot;#comment-&quot; + data:comment.id' title='comment permalink'>
    <data:comment.timestamp/>
    </a>
    <b:include data='comment' name='commentDeleteIcon'/>
    </span>
    </dd>

    </b:loop>
    </dl>
    Nah, kalau sudah memperhatikan kode di atas, sekarang tambahkan kode berwarna merah,yang akhirnya menjadi seperti berikut:
    <div style='overflow:auto; width:ancho; height:300px;'>
    <dl id='comments-block'>
    <b:loop values='data:post.comments' var='comment'>
    <dt class='comment-author' expr:id='&quot;comment-&quot; + data:comment.id'>
    <a expr:name='&quot;comment-&quot; + data:comment.id'/>
    <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='comment-body-author'>
    <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='&quot;#comment-&quot; + data:comment.id' title='comment permalink'>
    <data:comment.timestamp/>
    </a>
    <b:include data='comment' name='commentDeleteIcon'/>
    </span>
    </dd>

    </b:loop>
    </dl>
    </div>
  5. Klik simpan template
Teman-teman juga bisa mengatur panjang letak kotak komentar yang sudah diberi scroll itu dengan cara mengatur nilai pada kode <div style='overflow:auto; width:ancho; height:300px;'>, perhatikan pada bagian : 300px. Angka tersebut dapat anda atur sesuai keinginan, tapi lihat dulu hasilnya  pada kolom komentar postingannya, apakah sudah sesuai dengan ukuran kotak komentar yang anda inginkan.

Itu tadi tutorial hari ini mengenai cara membuat scroll pada kotak komentar, jika ada yang kesulitan bisa tanya sama kotak komentar dibawah, selamat mencoba dan semoga bermanfaat.

Socializer Widget By Blogger Yard
SOCIALIZE IT →
FOLLOW US →
SHARE IT →

0 nhận xét:

Đăng nhận xét

Labels

Adult English affiliate Ảnh ẢNH FACEBOOK ẢNH HÀI ẢNH HOA ĐẸP ẢNH LÃNG MẠN ẢNH NGƯỜI MẪU ÁO DÀI Art + Design ẨM THỰC bag Bé tô màu BIKINI BLOGGER books Búp bê C CAPTCHA Cắm hoa Cắt may Chơi mà học CHUYỆN CỦA SAO Chuyện Lạ clip hot Coloring - Tô màu CUỘC SỐNG Doll domain DU LỊCH Đ Đan len Đất nặn cho bé Điện thoại - Tablet E Funny G GAME Gấp giấy Gấp hộp Gấp khăn - Trang trí món ăn Giầy - Dép Gifts Giới Tính GIỚI TRẺ NGÀY NAY Gói quà - gấp nơ Google GOOGLE ADSENSE FULL guest post H Hand made hat hiteach HOA HẬU HỌC TẬP home and garden hosting HOT GIRL INTERNET INTERNET PAYMENT Iseng joomla jQuery Kết hạt KHỎE & ĐẸP KIẾM TIỀN Kinh Nghiệm L LÀM ĐẸP Làm đồ chơi làm đồ chơi từ gỗ Làm hoa giấy Làm hoa vải Làm thiệp LƯU BÚT HỌC TRÒ M Magazine making flowers Mẫu móc MẸO HAY MMO MODEL N Nail art Nến trang trí Nghệ thuật NGƯỜI ĐẸP VÀ XE Nhà đẹp O Origrami Ôtô - xe máy P Painting - Vẽ Patchwork PHẦN MỀM Play and learn for baby plugin Q R recycling S Sách tiếng anh cho bé Sành điệu Sao SAO NGOẠI SAO ONLINE SAO VIỆT SEO SEO FULL slider STYLE T TÂM SỰ template Tết dây THẾ GIỚI NGƯỜI MẪU THẾ GIỚI THỨ 3 THỂ THAO Thêu THƠ TÌNH THỦ THUẬT THÚ VUI Thư giãn TIỂU THUYẾT TÌNH CẢM TIN HOT Tin Vip tips Tóc đẹp traffic TRANG ĐIỂM Trang trí Tri thức TRUYỆN NGẮN truyện quê Túi xinh tutorial blog VĂN PHÒNG vuivui808 weaving website WEDDING wordpress