English French German Spain Italian Dutch Russian Portuguese Japanese Korean Arabic Chinese Simplified

PASANG NOMOR URUT PADA KOMENTAR

Sebenarnya tips ini tidaklah terlalu penting diterapkan pada sebuah blog karena tidak mempengaruhi keberadaan blog terutama dalam masalah traffik blog.
Namun paling tidak dapat membuat tampilan blog lebih menarik terutama dibagian komentar pengunjung.
Demo : Lihat gambar disamping atau pada komentar pengunjung EPG Studio.
LANGKAH-LANGKAHNYA :
  • Login ke Blogger.
  • Mauk ke Rancangan, pilih Edit HTML.
  • Kasih tanda cek pada Expland Template Widget.
  • Backup dulu template blog anda, jika takut salah.
    1. Cari kode :


      <b:loop values='data:post.comments' var='comment'>



      Copy kode dibawah ini dan paste tepat diatas kode tadi


      <script type='text/javascript'>var CommentsCounter=0;</script>
    2. Cari kode :

      <data:commentPostedByMsg/>


      Copy kode dibawah ini, kemudian paste tepat dibawah kode tadi

      <span class='comm-num'>
      <a expr:href='data:comment.url' title='Comment Link'>
      <script type='text/javascript'>
      CommentsCounter=CommentsCounter+1;
      document.write(CommentsCounter)
      </script>
      </a>
      </span>
    3. Terakhir untuk menampilkan image dan angka penomoran. Cari kode :

      </head>


      Copy kode dibawah ini dan paste tepat diatas kode tadi.

      <style type="text/css">
      .comm-num a:link, .comm-num a:visited {
      color: white !important;
      text-decoration: none !important;
      background: url(http://i50.tinypic.com/egx3t3.jpg) no-repeat;
      width: 50px;
      height: 48px;
      float: right;
      display: block;
      margin-right: 5px;
      margin-top: -15px; /*comments-counter position*/
      text-align: center;
      font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
      font-size: 15px;
      font-weight: normal;
      }
      .comm-num a:hover, .comm-num a:active {
      color: gray !important;
      text-decoration: none !important;
      }
      </style>

Keterangan langkah terakhir :
  1. http://i50.tinypic.com/egx3t3.jpg : merupakan tampilan dari gambar pada setiap komentar. Silahkan anda ganti dengan gambar yang ada dibawah ini. Klik kanan pilih Copy Image Location, kemudian paste menggantikan alamat image terdahulu/diatas
  2. width: 50px;
    height: 48px; : merupakan ukuran gambar, silahkan anda sesuaikan dengan keperluan.
  3. color: gray : warna angka penomoran pada setia lomentar, silahkan anda ganti dengan warna pilihan anda.

Koleksi gambar yang dapat anda pilih :













Sumber asli dari tip ini : http://bloggerstop.net

Selamat mencoba , semoga bermanfaat...

PASANG POST TERBARU DAN KOMENTAR TERBARU

Ada widget untuk menampilkan Post Terbaru dan Komentar Terbaru. Hanya saja pemasangan widget yang terlalu banyak pada sebuah dapat menambah beban saat loading yang kemungkinannya pengunjung akan meninggalkan blog anda.
Ada solusi lain untuk menampilkannya, yaitu dengan menggunakan alamat Feed blog kita sendiri. Untuk Post Terbaru bisa menggunakan feed post, dan untuk komentar terbaru bisa menggunakan feed comment.
Untuk membuatnya anda berpedoman pada alamat feed untuk Post Terbaru serta feed untuk Komentar terbaru yang diterbitkan Blogger. Alamat feednya adalah sebagai berikut :

Alamat Post Terbaru :

http://NamaBlog.blogspot.com/feeds/posts/default

Alamat Komentar terbaru :

http://NamaBlog.blogspot.com/feeds/comments/default

Ganti kata NamaBlog dengan nama blog anda. Misalnya : kata tersebut diganti dengan pkt-studio, maka alamat Feednya akan seperti dibawah ini :

Alamat Post Terbaru :

http://pkt-studio.blogspot.com/feeds/posts/default

Alamat Komentar terbaru :

http://pkt-studio.blogspot.com/feeds/comments/default

Setelah anda mempunyai alamat feed seperti diatas, barulah anda masekan kedalam blog dengan langkah-langkah sebagai berikut :
  1. Sign ke Blogger dengan ID anda.
  2. Pilih Tata Letak
  3. Pilih Elemen Halaman.
  4. Pilih Tambah Gadget.
  5. Klik tanda + pada Feed 
  6. Isikan alamat feed pada kotak seperti dibawah ini. Anda masukan satu dulu, feed komenter terbaru atau feed post terbaru.

    Photobucket
  7. Setelah anda mengisi alamat feednya, klik tombol lanjutkan, maka akan muncul gambar berikut :

    Photobucket
  8. Setelah anda mengatur jumlah item , tanggal dan sumber pengarang item, klik Simpan.
  9. Lakukan langkah-langkah yang sama untuk menampilkan satu lagi dari feed blog anda.
  10. Selesai. 

MENAMPILKAN TOMBOL BALAS KOMENTAR (REPLY)

Pengunjung yang memberi komentar pada postingan sebuah blog, kadang-kadang berbentuk pertanyaan. Dengan sendirinya pemilik blog harus memberikan jawaban atas komentar tersebut.
Tips kali ini merupakan salah satu solusi bagi anda untuk mempermudah memberikan balasan komentar dari pengunjung, dengan harapan pengunjung tersebut kembali mengunjungi postingan yan dia komentari.
Balasan komentar berupa tombol kecil seperti ini . Atau jika anda mau silahkan anda ganti gambarnya dengan kreasi anda sendiri atau dengan perkataan misalnya Balas Komentar.
Cara Menerapkan pada Blog :
  1. Masuk ke Blogger.
  2. Klik Rancangan, pilih Edit HTML.
  3. Backup dulu Template blog anda, jika takut gagal.
  4. Kasih tanda cek pada kotak Expland Template Widget.
  5. Cari kode :<data:commentPostedByMsg/&gt;
    Kalau kode diatas belum ketemu, coba anda cari kode ini :

    <dd class='comment-footer'>

    atau kode ini :

    <b:include data='comment' name='commentDeleteIcon'/>
  6. Copy kode dibawah ini, dan paste dibawah salah satu kode diatas tadi.


    <a expr:href='&quot;https://www.blogger.com/comment.g?blogID=ID BLOG ANDA&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#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;'><img alt='Reply To This Comment' src='https://lh4.googleusercontent.com/_1j80TgNqd_8/TaUCqvyEdJI/AAAAAAAACeA/3Nuj-M-XSOc/8.png'/></a>


  7. Keterangan :
    1. ID BLOG ANDA : isi dengan ID blog anda. Untuk mendapatkan ID blog dengan cara masuk ke Entri Baru dan lihat pada alamat Browser terdapat IDBlog anda. Perhatikan gambar dibawah ini :


    2. https://lh4.googleusercontent.com/_1j80TgNqd_8/TaUCqvyEdJI/AAAAAAAACeA/3Nuj-M-XSOc/8.png merupakan tombol yang tampil, silahkan anda ganti dengan koleksi gambar anda.
  8. Klik tombol Simpan Template.
  9. Lihat komentar blog anda sekarang.
  10. Selamat mencoba, semoga bermanfaat.

BEBERAPA CONTOH TOMBOL REPLY YANG DAPAT ANDA GUNAKAN :



: https://lh4.googleusercontent.com/_1j80TgNqd_8/TaUCqvyEdJI/AAAAAAAACeA/3Nuj-M-XSOc/8.png

: https://lh5.googleusercontent.com/_1j80TgNqd_8/TaUCqkK1pBI/AAAAAAAACeE/moq4DXpIPd0/1.png

: https://lh4.googleusercontent.com/_1j80TgNqd_8/TaUCq75H9FI/AAAAAAAACeI/QR2WiSmWGnQ/2.png

: https://lh4.googleusercontent.com/_1j80TgNqd_8/TaUCr47ra-I/AAAAAAAACeM/laRps2j2zLU/3.png

: https://lh5.googleusercontent.com/_1j80TgNqd_8/TaUCsAyXjtI/AAAAAAAACeQ/4oV4aIVIunM/s86/4.png

: https://lh4.googleusercontent.com/_1j80TgNqd_8/TaUCsWDtLbI/AAAAAAAACeU/KjclNhMRqiA/5.png

: https://lh3.googleusercontent.com/_1j80TgNqd_8/TaUCstwD0XI/AAAAAAAACeY/YDlzAuenZ1Q/6.png

: https://lh5.googleusercontent.com/_1j80TgNqd_8/TaUCtCNTLuI/AAAAAAAACec/aH8yz_syk_8/7.png

Selamat mencoba, semoga bermanfaat.....

MENAMPILKAN FOTO/AVATAR PADA KOTAK KOMENTAR

Kurang lengkap apabila komentar dari pengunjung blog anda tidak menampilkan foto profilnya.
Sebenarnya fasilitas Blogger telah dilengkapi filtur ini (foto tampil pada komentar). Hanya pada template yang telah dimodifikasi seperti pada template EPG Studio harus dilakukan sedikit perubahan pada kode tertentu. Mungkin hal itu juga terjadi pada blog yang anda kelola. Ada beberapa langkah untuk menampilkan foto pada kotak komentar, silahkan anda simak dan terapkan pada blog anda.

LANGKAH PERTAMA
  1. Masuk ke Blogger.
  2. Pilih Pengaturan.
  3. Klik Tab Komentar'
  4. Pada item "Tampilkan profil dalam komentar " , pilih "ya".
  5. Klik Simpan Setelan, coba lihat hasilnya.

Jika belum berhasil, coba ikuti langkah berikutnya.

LANGKAH KEDUA
  1. Masuk ke Rancangan, pilih Edit HTML.
  2. Cari kode ini <dl id='comments-block'> atau jika tidak ditemukan coba cari kode ini <div id='comments-block'>
  3. Setelah ketemu ganti kode tadi dengan kode ini :
    <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
  4. Berikutnya anda cari kode ini : <a expr:name='data:comment.anchorName'/>
  5. Tambahkan kode dibawah ini tepat diatas kode tadi :
    <b:if cond='data:comment.favicon'>
    <img expr:src='data:comment.favicon' height='35px' width='35px' style='margin-bottom:-2px;' />
    </b:if>
    <a expr:name='data:comment.anchorName'/>
    <b:if cond='data:blog.enabledCommentProfileImages'>
    <data:comment.authorAvatarImage/>
    </b:if>
  6. Klik Simpan Template, coba anda lihat sekarang

LANGKAH KETIGA

Bagi yang pada profilya tidak memiliki foto/avatar, anda dapat menggantinya dengan gambar lain sesuai dengan pilihan anda. EPG Studio menampilkan logo Blogger bagi komentator yang belum memiliki avatar
Caranya :
  1. Masih pada Edit HTML.
  2. Cari kode ]]></b:skin>
  3. Copy kode dibawah ini kemudian paste tepat diatasnya
    .avatar-image-container img {
    background: url(http://www.blogger.com/img/logo40.png) no-repeat;
    width: 35px;
    height: 35px;
  4. Ganti kode warna merah dengan kode gambar yang ingin anda tampilkan.
  5. Klik Simpan Template.
  6. Selesai...selamat mencoba semoga berhasil dan bermanfaat.

MENAMBAHKAN FASILITAS SCROLL BAR PADA KOMENTAR

Komentar pengunjung pada sebuah postingan, semakin lama akan semakin bertambah sehingga halaman yang berisi postingan tersebut akan kelihatan memanjang kebawah. Hal itu tentu saja akan mengganggu keindahan penampilan blog.
Untuk mengatasi masalah tersebut, EPG Studio telah memposting artikel yang berjudul : KOMENTAR PENGUNJUNG AKAN TAMPIL JIKA DI KLIK. Berarti tampilan komentar akan selalu tersembunyi jika kata Lihat/Tutup Komentar tidak di klik oleh pengunjung.
Usaha lain yang dapat anda lakukan agar komentar pengunjung tampil tidak memanjang yaitu dengan memanfaatkan fasilitas Scroll Bar pada bagian komentar sebuah blog.
Bagi anda yang ingin menggunakan trik MENAMBAH FASILITAS SROLL BAR PADA KOMENTAR, silahkan ikuti langkah-langkahnya :
  • Masuk ke Blogger.
  • Pilih Rancangan
  • Pilih Edit HTML
  • Cari kode untuk pengaturan komentar seperti di bawah ini :

    /* Comments
    ----------------------------------------------- */
    #comments h4 {
    margin:1em 0;
    font-weight: bold;
    line-height: 1.4em;
    text-transform:uppercase;
    letter-spacing:.2em;
    color: $sidebarcolor;
    }

    #comments-block {
    margin:1em 0 1.5em;
    line-height:1.6em;
    }
    #comments-block .comment-author {
    margin:.5em 0;
    }
    #comments-block .comment-body {
    margin:.25em 0 0;
    }
    #comments-block .comment-footer {
    margin:-.25em 0 2em;
    line-height: 1.4em;
    text-transform:uppercase;
    letter-spacing:.1em;
    }
    #comments-block .comment-body p {
    margin:0 0 .75em;
    }
    .deleted-comment {
    font-style:italic;
    color:gray;
    }

    .feed-links {
    clear: both;
    line-height: 2.5em;
    }

    #blog-pager-newer-link {
    float: $startSide;
    }

    #blog-pager-older-link {
    float: $endSide;
    }

    #blog-pager {
    text-align: center;
    }
  • Copy kode dibawah ini kemudian paste pada bagian kode diatas.


    #comments {
    height:300px;
    overflow:auto;
    }


    Kode tambahan boleh diletakkan diatas kode #comments h4 { atau dimana saja, asal masih berada dibagian komentar.
  • Kode height:300px; boleh anda ganti dengan tinggi scroll bar yang anda inginkan
  • Setelah selesai kilk tombol Simpan Template
  • Selamat mencoba, semoga berguna...!!

KOTAK KOMENTAR DIBAWAH POSTINGAN

Postingan ini dikhususkan bagi blog yang kotak komentarnya belum pernah diubah atau masih dalam keadaan asli. Bagi yang pernah mengotak-atik kode HTML untuk mengubah kotak komentar, postingan ini tidak akan dapat anda gunakan karena kode-kodenya berbeda dengan kode komentar yang ada pada blog anda.
Jika masih orisinil... mari kita lihat langkah-langkahnya.
  1. Sign ke Blogger dengan ID anda.
  2. Pilih Tata Letak.
  3. Pilih Pengaturan.
  4. Klik tab Komentar,
  5. Perhatikan tulisan Penempatan Formulis Komentar, kemudian klik tombol Disemat di bawah entri. Lebih jelasnya perhatikan gambar dibawah ini.

  6. Klik tombol Simpan Perubahan.
  7. Selesai.



Lihat dulu blog anda, untuk melihat berhasil atau tidaknya cara diatas.

Jika belum berhasil gunakan langkah kedua sebagai berikut :


  1. Pilih Tata Letak.
  2. Pilih Edit HTML.
  3. Back up dulu template anda, untuk menjaga jika terjadi kegagalan.
  4. Kasih tanda contreng pada kotak  Expand Template Widget. (Jangan lupa yah...!). Tunggu sampai prosesnya selesai.
  5. Cari kode seperti dibawah ini :

    <p class='comment-footer'>

    <b:if cond='data:post.allowComments'>

    <a expr:href='data:post.addCommentUrl'
    expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>

    </b:if>


    </p>
  6. Hapus/delete kode diatas, kemudian anda ganti dengan kode dibawah ini:

    <p class='comment-footer'>

    <b:if cond='data:post.embedCommentForm'>

    <b:include data='post' name='comment-form'/>

    <b:else/>

    <b:if cond='data:post.allowComments'>


    <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>

    </b:if>

    </b:if>

    </p>
  7. Klik Tombol Simpan Template.
  8. Minum dulu boss.....istirahat sejenak...!!
  9. Lanjut ke tab Pengaturan.
  10. Klik tab Komentar.
  11. Perhatikan tulisan Penempatan Formulis Komentar, kemudian klik tombol Disemat di bawah entri. Lebih jelasnya perhatikan gambar dibawah ini.

  12. Klik tombol Simpan Perubahan.
  13. Selesai.



Lihat Blog anda sekarang...!!!!

Postingan ini telah berhasil dicoba pada blog percobaan EPG Studio. Jika anda mengalami kegagalan, coba lagi dengan lebih hati-hati dan lebih teliti...!!

KOMENTAR PENGUNJUNG AKAN TAMPIL JIKA DI KLIK

Pada sebuah blog yang komentar pengunjungnya sudah banyak, maka halaman blog akan menjadi panjang kebawah sehingga dapat merusak penampilan blog.
Ada satu cara untuk menyembunyikan komentar pengunjung sehingga begitu halaman postingan terbuka, seluruh komentar tidak terlihat/tersembunyi.
Komentar akan terlihat kembali jika pengunjung ingin menampilkannya dengan cara meng-klik tulisan "Lihat / Tutup Komentar" atau apa saja sesuai dengan kalimat yang ditampilkan.
Langkah-langkah untuk membuatnya, silahkan anda ikuti seperti dibawah ini :
  1. Masuk ke Blogger dengan ID anda.
  2. Pilih Tata Letak.
  3. pilih Edit HTML.
  4. Back up dulu templatenya dengan dengan cara klik Download Template Lengkap.
  5. Kasih contreng pada Expand Widget Templates.
  6. Copy seluruh kode dibawah ini kemudian paste tepat diatas kode </head>


    <script type="text/Javascript">
    function togglecomments (postid) {
    var whichpost = document.getElementById(postid);
    if (whichpost.className=="commentshown") {
    whichpost.className="commenthidden";
    }
    else {
    whichpost.className="commentshown";
    }
    }
    </script>
  7. Cari kode ini <dl id='comments-block'> kemudian ganti dengan kode dibawah ini :


    <dl class='commenthidden' id='comments-block'>
  8. Copy kode ini .commenthidden { display:none } .commentshown { display:inline } kemudian tambahkan pada kode seperti dibawah ini (yang berwarna merah itu kode yang harus ditambahkan.


    .deleted-comment {
    font-style:italic;
    color:gray;
    }
    .commenthidden { display:none } .commentshown{ display:inline }
    .feed-links {
    clear: both;
    line-height: 2.5em;
    }
    #blog-pager-newer-link {
    float: right;
    }
    #blog-pager-older-link {
    float: left;
  9. Cari kode seperti ini :


    <a name='comments'/>
    <b:if cond='data:post.allowComments'>
    <h4>
    <b:if cond='data:post.numComments == 1'>
    1 <data:commentLabel/>:
    <b:else/>
    <data:post.numComments/> <data:commentLabelPlural/>:
    </b:if>
    </h4>
  10. Copy seluruh kode dibawah ini kemudian paste tepat dibawah kode tadi.


    <base target='_self'><h2><a aiotitle='click to expand' href='javascript:togglecomments%20("comments-block")' rel='nofollow'><b> Lihat / Tutup Komentar</b></a></h2></base>
  11. Klik tombol Simpan Template
  12. Lihat komentar pada blog anda akan terlihat jika diklik kalimat "Lihat / Tutup Komentar"
  13. Selamat mencoba, semoga berhasil dan ada manfaatnya...!!

KOMENTAR PENGUNGJUNG DAN PEMILIK BLOG BERBEDA WARNA

Jika anda melihat komentar pengunjung, sebagian dari komentar itu memerlukan jawaban dari anda sebagai pemilik blog. Tetapi karena background komentarnya sama, kadang-kadang pengunjung tidak menyadari kalau apa yang dia tanyakan telah dijawab oleh pemilik blog dibawah komentar pengunjung tadi.
Untuk itu, anda harus memberikan warna latar yang berbeda antara komentar dari pengunjung dan komentar dari anda, dengan harapan para pengunjung dapat mengetahui bahwa komentarnya telah dikomentari oleh pemilik blog.

Simak cara menampilkan kotak komentar pengunjung dan pemilik berbeda warna latar.

  1. Masuk ke Blogger dengan ID anda
  2. Pilih Tata Letak
  3. Pilih Pilih Edit HTML
  4. Back up dulu template jika anda takut gagal.
  5. Kasih contreng pada kotak kecil disamping tulisan Expand Widget Template
  6. Copy seluruh kode dibawah ini, kemudian paste tepat diatas kode ]]></b:skin>



    .comment-body-author {
    background: #A9D0F5; /* warna background pemilik blog */
    border-top: 1px dotted #223344;border-bottom: 1px dotted #223344;border-left: 1px dotted #223344;border-right: 1px dotted #223344;
    margin:0;
    padding:0 0 0 20px;

    }



    Kode diatas merupakan kode untuk menampilkan kotak komentar bagi pemilik blog, sedangkan untuk pengunjung sama sebelum ditambahkan kode tersebut.
    Perhatikan yang bewarna merah,
    1. Anda dapat mengganti background: #A9D0F5 dengan warna kesukaan anda
    2. Kode  dotted #223344 (ada 4 buah) dapat anda ganti kata dotted (garis putus-putus) dengan solid (garis utuh/tidak putus-putus), dan kode warnanya dapat anda ganti denga kode warna kesukaan anda.
  7. Setelah anda selesai melakukan setting kode diatas, berikutnya anda cari kode yang mirip dengan kode dibawah ini. Dikatakan mirip karena pada sebagian template kadang-kadang memiliki kode  yang berbeda. Perhatikan kode yang dimaksud tadi.



    <dl id='comments-block'>
    <b:loop values='data:post.comments' var='comment'>
    <dt class='comment-author' expr:id='"comment-" + data:comment.id'>
    <a expr:name='"comment-" + 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>
    said...
    </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='"#comment-" + data:comment.id' title='comment permalink'>
    <data:comment.timestamp/>
    </a>
    <b:include data='comment' name='commentDeleteIcon'/>
    </span>
    </dd>
    </b:loop>
    </dl>



    Fokuskan perhatian anda pada kode diatas, jangan sampai salah.
    Kode yang berwarna kuning merupakan kode yang harus anda tambahkan dan meletakannya harus sama seperti contoh diatas.
  8. Setelah anda selesai menambah kode warna kuning tadi klik tombol Simpan Template
  9. Lihat kotak komentar anda sekarang...Jika anda belum pernah menulis komentar pada blog anda sendiri, coba sekarang. Tampilannya akan berbeda dari komentar para pengunjung.

CARA PASANG TOP COMMENT (KOMENTAR TERBANYAK)

Top Comment merupakan informasi jumlah terbanyak dari komentar pengunjung yang mengisi kotak komentar pada blog anda.Berdasarkan informasi tersebut anda dapat membuat suatu penghargaan kepada pengunjung yang paling banyak menulis komentar atas artikel yang anda tampilkan. Misalnya anda memberikan penghargaan berupa award yang penilaianya berdasarkan komentar terbanyak, atau penghargaan dalam bentuk lainnya sesuai dengan kemauan anda...!!
Dibawah ini terdapat kode yang dapat anda copy kemudian paste pada bagian element halaman.

<script type="text/javascript">
function pipeCallback(obj) {
document.write("<ol>");
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write("</ol>");
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=c92ac21897d8b56e61cfa85930dd89a1&filter=nickname&url=http%3A%2F%2Fnamablog.blogspot.com&num=10" type="text/javascript"></script>

Kode yang berwarna merah dapat anda edit sesuai dengan keinginan anda.
  • nickname : ganti dengan nama anda
  • nama blog : ganti dengan nama blog anda
  • 10 : ganti dengan jumlah komentator yang ingin ditampilkan.


Selamat mencoba...semoga bermanfaat...!!

CARA MENGGANTI WARNA KOTAK KOMENTAR

Warna kotak komentar jika belum dilakukan perubahan, warnanya sama dengan warna main wrapper. Jika anda menginginkan kotak komentar tampil dengan warna yang berbeda dengan warna pada latar main wrapper, anda tinggal mengubah/menambah beberapa kode yang diperlukan
sebagai contoh, coba anda perhatikan kotak komentar EPG Studio, warnanya berbeda (birunya lebih tua) dari latar belakang main wrapper.
Anda tertarik...???
dengan sedikit pengeditan kode, kotak komentar anda akan tampil beda dari sebelumnya.

  1. Masuk ke Blogger
  2. Pilih tata letak
  3. Pilih Edit HTML
  4. Back up dulu templatenya untuk mejaga jika terjadi kegagalan
  5. Cari kode seperti dibawah ini :

    #comments-block {
    margin:1em 0 1.5em;
    line-height:1.6em;
    }
  6. Ganti kode diatas dengan kode dibawah ini :

    #comments-block {
    width: 424px;
    background: #003366;
    text-align:left;
    padding: 20px 20px 10px 20px;
    margin: 10px 0px 0px 0px;
    border-top: 3px solid #C3D9FF;
    border-bottom: 3px solid #C3D9FF;
    border-left: 3px solid #C3D9FF;
    border-right: 3px solid #C3D9FF;
    }
  7. Ubahlah lebar/width-nya, sesuaikan dengan main wrapper anda.
  8. Gantilah kode warna pada background dan border dengan warna yang anda sukai

CARA PASANG KOMENTAR FACEBOOK DI BLOG

Kali ini saya akan menjelaskan tentang komentar facebook di blog , sebelum saya menjelaskan cara pasang kotak komentar facebook di blog ,saya jelaskan sedikit kegunaan comment box facebook , kegunaan box comment facebook di blog sama seperti kolom komentar blog lainnya , namun disamping untuk berkomentar di blog ada kegunaan lain dari plugin kotak komentar facebook ini yaitu apabila ada pengunjung berkomentar melalui komentar box ini maka akan secara otomatis tershare komentar dan url blog yang dikomentari , sehingga ini bisa menjadi salah satu cara promosi yang efektif dengan memasang kotak komentar facebook di blog .


Pasang Kotak Komentar Facebook Di Blog

Untuk memasang kotak komentar facebook di blog cukup sulit , untuk itu simak baik-baik tutorial pasang komentar facebook di blog .

1. Anda harus terlebih dahulu membuat aplikasi anda terlebih dahulu , untuk itu silahkan masuk ke akun facebook anda .

2. Lalu buka link ini Facebook developer page

3. Setelah membuka link tersebut anda akan dibawa ke link setup membuat aplikasi , yang belum verifikasi account akan muncul gambar seperti ini :


aplikasi facebook
Aplikasi facebook

Anda verifikasi melalui mobile phone , cukup masukan nomor handphone anda dan ikuti langkah selanjutnya .

4. Setelah terverifikasi anda masuk ke link di nomor 2 tadi sehingga muncul gambar seperti ini

Buat aplikasi facebook

Isikan nama situs , url situs jangan lupa tambahkan Backslash " / " di belakang Ulr , lalu lokasi , contoh :

Site name : tutorial blog
Url site: http://juntenxblog.blogspot.com/
Lokasi : indonesia
Lalu tekan create

5. Lalu anda akan dibawa ke tempat aplikasi

buat new aplikasi facebook

 Buat new aplikasi facebook

Lalu ikuti langkah-langkah nya

6. Setelah itu yang anda butuhkan adalah nomor App ID/API Key .

Setelah anda membuat aplikasi untuk plugin kotak komentar facebook , silahkan lihat langkah selanjutnya .

Pasang comment box facebook


Untuk memasang box comment facebook di blog anda terlebih dahulu untuk log in di akun blogger anda lalu Silahkan Menuju Layout ( Rancangan )> Edit HTML dan check Expand Widget Templates. Lalu cari code berikut:

<data:post.body/> (untuk setiap template berbeda-beda posisi code itu , untuk yang telah memasang read more silahkan cari kode seperti itu yang kedua)

Pasang script berikut ini dibawah kode tadi

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({appId: &#39;XXXXXX&#39;, status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement(&#39;script&#39;); e.async = true;
e.src = document.location.protocol +
&#39;//connect.facebook.net/en_US/all.js&#39;;
e.async = true;
document.getElementById(&#39;fb-root&#39;).appendChild(e);
}());
</script>
<fb:comments/>
</b:if>
<b> by <a href='http://juntenxblog.blogspot.com/' target='_blank' title='Facebook Comment'>Facebook Comment </a></b>

Ganti tanda xxx  dengan App ID/API Key yang telah anda buat sebelumnya , lalu tekan simpan dan lihat hasilnya.

Cukup mudah bukan untuk pasang kotak komentar facebook pada blog , silahkan bila anda masih kebingungan dengan cara buat kotak komentar facebook maupun cara pasang komentar facebook untuk berkomentar

KOMENTAR TERBARU

TINGGALKAN KOMENTAR ANDA

Follow Me