Selasa, 22 Januari 2013

[TUTORIAL] Menambah Twitter Conversation di Blog







Mungkin Kalian tertarik dengan Widget "My Tweet" milik gue di sebelah kanan blog ini. Ya conversation atau twit/twit yang Kita kirim bisa tampil pada halaman Blog kita dengan memanfaatkan Widget Custom HTML.
Caranya, Masuk ke Atur Widgets Blog, kemudian pilih Tambah Widget Baru. Masukan judul widget (misalnya Twitter Saya), dan untuk Tipe Widget pilih Custom HTML. Kemudian pada textarea HTML dapat diisi dengan kode berikut:

  1. <div><script type="text/javascript" src="http://widgets.twimg.com/j/2/widget.js"></script> 
  2. <script type="text/javascript"> 
  3. /*<![CDATA[*/ 
  4. /* JANGAN LUPA PAKE CDATA BIAR W3C STANDARD */ 
  5. new TWTR.Widget({ 
  6.   version: 2, 
  7.   type: 'profile', 
  8.   rpp: 10, 
  9.   interval: 6000, 
  10.   width: 'auto', 
  11.   height: 300, 
  12.   theme: { 
  13.     shell: { 
  14.       background: '#eeeeee', 
  15.       color: '#473d47' 
  16.     }, 
  17.     tweets: { 
  18.       background: '#f5f5f5', 
  19.       color: '#333133', 
  20.       links: '#006600' 
  21.     } 
  22.   }, 
  23.   features: { 
  24.     scrollbar: true, 
  25.     loop: false, 
  26.     live: true, 
  27.     hashtags: true, 
  28.     timestamp: true, 
  29.     avatars: true, 
  30.     behavior: 'all' 
  31.   } 
  32. }).render().setUser('NAMA_USERNAME_TWITTER_ANDA').start(); 
  33. /*]]>*/ 
  34. </script></div>
 Kodenya saja , angka nya jangan.

Ubah NAMA_USERNAME_TWITTER_ANDA pada kode di atas dengan username Anda di Twitter. Contoh username saya adalah rdelaaa, maka ganti NAMA_USERNAME_TWITTER_ANDA tersebut dengan rdelaaa.

 
Kita juga bisa melakukan kustomisasi dengan variabel-variabel tampilannya, misalnya theme, Kita dapat merubah warna latar-belakang (background), warna teks (color), dan warna link (links) seperti pada contoh berikut
... 
theme: { 
shell: { /* Bagian Utama */ 
background: '#000000', /* Latar Belakang = Hitam */ 
color: '#ffffff' /* Warna Teks = Putih */
},
tweets: { /* Bagian Tweet*/ 
background: '#444444', /* Latar Belakang = Abu Tua */
color: '#cccccc', /* Warna Teks = silver */ 
links: '#ffdd77' /* Warna Link = oranye */
}
 }, 
...


Selain warna theme, Kita juga dapat merubah width (lebar) dan height (tinggi) dari widget tersebut dengan merubah variabel width dan height. Catatan: Untuk width disarankan gunakan 'auto' saja.
 
Untuk merubah berapa tweet yang akan ditampilkan, Kita dapat merubah variabel rpp. Mungkin Anda ingin menampilkan sebanyak 20 tweet, tinggal ubah saja menjadi rpp: 20.
 
Kita juga dapat merubah jenis tampilan, apakan akan menampilkan scrollbar atau tidak, bila ingin tampil, gunakan true, bila tidak gunakan false. Untuk variabel lainnya bisa dicoba satu per satu.
 
Oh ya... Jangan lupa cek Status Widget Aktif agar widget tersebut tampil pada blog Anda.
 
Terima Kasih dan Selamat Mencoba.
 

0 komentar:

Posting Komentar

Related Posts Plugin for WordPress, Blogger...
© Base Camp @rdelaaa 2012 | Blogger Template by Enny Law - Ngetik Dot Com - Nulis