Cara Membuat Tweet Box (Komentar Twitter) Di Blog

Wednesday, November 7, 2012

Fungsi Tweet Box sama seperti Tweet button yaitu untuk mempromosikan blog ke twitter
Bedanya kalau tweet button harus mampir dulu ke twitter baru bisa ngeweet, tapi kalau menggunakan Tweet Box bisa langsung ngetweet dari Blog

Pertama Buat Aplikasinya dulu disini
Isikan data-data Application details yang diminta untuk membuat aplikasinya. Seperti gambar dibawah ini

Klik Gambar Untuk Memperbesar
Isi Name dan Description sesukamu
Isi Website dan CallBack Url dengan Url Blog kamu


Gulir/scroll ke Bawah
Klik Gambar Untuk Memperbesar
Baca Developer Rules of the Road, kalau gk ngerti bahasa inggris seperti aku ya gk usah di baca :D (ya iyalah, orang gk ngerti)
Centang "Yes, I agree" dan Masukan CAPTCHA, Kemudian Klik Create your Twitter application


Masuk Kepengaturan
Klik Gambar Untuk Memperbesar


Application type

Ubah Menjadi Read and Write Kemudian Klik Update this Twitter applications settings

Setelah itu Kembali lagi ke details


Ambil Consumer key
Klik Gambar Untuk Memperbesar
Setelah itu menuju Blogger >> Template >> Edit HTML >> Centang Expand Template Widget Dan Cari Kode </head> Jika sudah ketemu, Salin kode Dibawah Ini Dan Tempel Di atas Kode </head>

<script src='http://platform.twitter.com/anywhere.js?id=1KBaJT52iuqomP3m3PN9g&amp;v=1'>
</script>

Ganti Kode yg Berwarna Biru dengan  Consumer key kamu

Untuk Meletakan Tweer Box Di Bawah Postingan, Cari kode <data:post.body/>
Jika Sudah Ketemu, Masukkan Kode dibawah ini Dan taruh tepat dibawah kode <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='bp_tweetBox'/>
<script type='text/javascript'>
bp_tweet_link=&quot;<data:post.url/>&quot;;
twttr.anywhere(function (T) {
T(&quot;#bp_tweetBox&quot;).tweetBox({
width: 530,
label: &quot;Tweet Ini&quot;,
defaultContent: &quot;<data:post.title/>&quot;+&quot; &quot;+bp_tweet_link
});
});
</script>
</b:if>
Ganti kode berwarna biru untuk menentukan lebar Tweet Box

Contoh Tweet Boxnya Seperti di Bawah ini

kalau Tweetbox di atas gk muncul, silahkan segarkan halaman ini (Pencet F13)

4 komentar:

  1. wah bagus nih artikelnya, ditunggu artikel barunya ... ^_^

    #comment back ya hihiihihih :)

    ReplyDelete