Cara Membuat Widget Twitter Untuk Blog

Table of Contents

Pada kesempatan kali ini Bangiz mau berbagi info tentang cara memasang widget Twitter pada blog, khususnya disini pada platform Blogger. Untuk menggunakannya pastikan Anda memiliki kadua akunnya baik itu Twitter maupun Bloggernya. 

Jika belum punya silahkan buat saja dulu karena semuanya gratis. Sekarang kita lanjut saja ke tutorialnya.

Gambar Twitter

1. Masuk ke akun Twitter Anda.

2. Pilih pengaturan (lihat gambar).

Pengaturan Twitter

 3. Pada halaman berikutnya pilih Widget > Buat baru.

Widget Twitter

 4. Selanjutnya Anda bisa mengkonfigurasi tampilannya, silahkan atur sendiri lalu klik Buat Widget.

Konfigurasi tampilan widget

 5. Kalau sudah berhasil maka akan muncul kode HTML yang siap untuk ditempelkan ke situs Anda.

Kode widget Twitter

Dengan kelima langkah di atas, kita sudah bisa mendapatkan kode widgetnya. Tapi mungkin Anda juga perlu untuk memodifikasi tampilannya supaya lebih rapi dan sesuai dengan tema template yang digunakan seperti mengatur lebar, warna link, border, footer widget dan sebagainya. 

Sebagai contoh kode yang di dapatkan pada nomor 5 adalah berikut ini:

<a class="twitter-timeline"  href="https://twitter.com/BangizID"  data-widget-id="449431401054482432">Tweet oleh @BangizID</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

Untuk mengatur lebar, tinggi dan warna link, silahkan tambahkan kode berikut:

width="400" height="400" data-link-color="#288FF0"

Sehingga hasilnya menjadi seperti ini:

<a class="twitter-timeline" width="400" height="400" data-link-color="#288FF0"href="https://twitter.com/BangizID" data-widget-id="275096183993671680">Tweets by @BangizID</a><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

Untuk pengaturan lainnya silahkan kunjungi linknya disini. Begitu juga jika belum tahu cara menambahkan kode HTML bisa dibaca Cara Menambahkan Kode HTML/JavaScript di Blog. Demikian tutorial tentang Membuat widget Twitter untuk blog, jika ada pertanyaan silahkan tinggalkan komentar.