jadilah yang pertama berimajinasi


Cara membuat kotak komentar Facebook Twitter dan Blog




Kemarin saya mampir di Blog teman saya buat nyari wiget unik untuk di pasang di blog saya , tapi saya enggak nemuin wiget yang saya cari , tetapi saya dapat sesuatu yang menarik
yaitu Kotak komentar Twitter sama Facebook berdampingan dengan kotak komentar blog .
Awalnya sih agak enggak percaya ,emang ada ya kotak komentar twitter ? ,
setelah saya baca dan praktekan ternyata temen saya ini memanfaatkan salah satu kelebihan twitter bisa ngetweet dan otomatis url artikel itu di sebutin di tweet orang itu .
Yang masih heran coba lihat demonya dulu :D



Sekarang kita ke tahap pembuatan kotak kometar ini , yang kita persiapkan terlebi dahulu adalah

  •     Profile_ID (facebook)
  •     APP_ID (facebook)
  •     API_Key (twitter)

Yang belum mempunyai material di atas silahkan baca di bawah ini.


Kalu semuannya sudah di siapkan , mari kita mulai bereksperiment :p

1. Masuk ke akun blogger ,*Ingat , jangan lupa backup terlebi dahulu template blog kamu* kemudian ke Rancangan > Edit HTML > Centang terlebih dahulu 'Expand Template Widget'
2. Masukan script di bawah ini tepat di bawah kode <head> . Agar lebih mudah tekan Tombol
    Ctrl + F kemudian masukkan <head>

     <meta content='Profile_ID' property='fb:admins'/>
    <meta content='APP_ID' property='fb:app_id'/>
    <script src='http://code.jquery.com/jquery-latest.pack.js'/>
    <script src='http://gue-galau.googlecode.com/files/gue-commentpages.js'/>
    <script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
    <script src='http://gue-galau.googlecode.com/files/gue-commentpages2.js'/>
    <script src='http://platform.twitter.com/anywhere.js?id=API_Key&amp;v=1'/>


Profile_ID ganti dengan ID facebook
APP_ID  ganti dengan ID aplikasi facebook
API_Key  ganti dengan ID aplikasi twitter

3.  Masuk kan Script di bawah ini tepat di code <div class='comments' id='comments'>
jika kalian menemukan 2 kode yang sama, letakan di bagian ke'2

    <div class='comments-tab' id='blogger-comments' title='Comments from Blogger'>
    <data:post.numComments/> Comments
    </div>
    <div class='comments-tab' id='twitter-comments' title='Comments with Twitter'>
    <span class='js-page-tweet-count' expr:href='data:post.url'/> Tweets
    </div>
    <div class='js-default-tab comments-tab' id='fb-comments' title='Comments made on Facebook'>
    <fb:comments-count expr:href='data:post.url'/> Komentar
    </div>
    <div class='clear'/>
    </div>
    <div class='comments-page' id='twitter-comments-page'>
    <div id='js-tweet-box'/>
    </div>
    <div class='comments-page' id='fb-comments-page'>
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
        <div id='fb-root'/>
        <fb:comments expr:href='data:post.url' num_posts='10' width='400'/>
      </b:if>
    </div>
    <div class='comments comments-page' id='blogger-comments-page'>

4. Amati kode yang berwarna hijau


Comments , Tweets dan Komentar dapat di ganti sesuka hati kita , karena ini adalah judul dari kotak komentar masing-masing
Angka 10 menrupakan jumlah komentar yang di tampilkan , dapat anda rubahAngka  400 adalah lebar dari kotak komentar , bisa anda rubah juga.

5. Simpan template blog anda , dan lihat hasilnya , mudah-mudahan sukses ya.

 jangan lupa baca juga >>
http://gue-galau.blogspot.com/2012/08/pasang-gabungkan-komentar-fb-blog.html






2 komentar:

Followers

ALL POST

Loading...
Lsc