Kemaren sudah dibahas membuat button share Twitter di blog dan website, hari ini membahas cara memasang button follow Twitter, merujuk dari update button show di Twitter Developer. Twitter Developer membuat empat model tampilan untuk button folow, pertama tampilan default, yaitu menampilkan nama dan jumlah follower. Kedua menampilkan nama tanpa jumlah folowwer. Dan yang ketiga, tampilan screen icon twitter tanpa username dan tanpa jumlah follower, Dan yang terakhir tampilan untuk ukuran besar, ukuran itu untuk tampilan ketiga model tampilan tadi, dapat ditampilkan dalan ukuran kecil dan besar.
Antara ukuran besar dengan ukuran yang kecil perbedaannya tidak terlalu besar. hanya sedikit lebih besar dan sedikit lebih kecil. Untuk lebih jelasnya bisa dilihat di Twitter Deeveloper, sekalian untuk memudahkan pemahaman dari a[a yang akan dijelaskan disini tentang cara membuatnya. Klik link ini, "https://developer.twitter.com/en/docs".
Sekarang kita akan langsung pada tahapan kerjanya. Canya sebagai berikut.
- Untuk Tampilan default, ganti nama username dengan username Anda;
<a class="twitter-follow-button"
href="https://twitter.com/Ahmadhanafiah">
Follow @Ahmadhanafiah</a>
hasilnya seperti ini:
href="https://twitter.com/Ahmadhanafiah">
Follow @Ahmadhanafiah - Ukuran default tanpa menampilkan nama dn jumlah follower;
<a class="twitter-follow-button"
href="https://twitter.com/Ahmadhanafiah" data-show-screen-name="false" data-show-count="false">
Follow @Ahmadhanafiah</a>
Hasilnya seperti ini;
href="https://twitter.com/Ahmadhanafiah" data-show-screen-name="false" data-show-count="false">
Follow @Ahmadhanafiah - Ukuran default hanya menampilkan nama
<a class="twitter-follow-button"
href="https://twitter.com/Ahmadhanafiah" data-show-count="false">
Follow @Ahmadhanafiah</a>
Hasilnya :
href="https://twitter.com/Ahmadhanafiah" data-show-count="false">
Follow @Ahmadhanafiah - Ukuran besar
<a class="twitter-follow-button"
href="https://twitter.com/Ahmadhanafiah" data-size="large">
Follow @Ahmadhanafiah</a>
hasilnya:
href="https://twitter.com/Ahmadhanafiah" data-size="large">
Follow @Ahmadhanafiah - Terakhir copy paste kode di bawah ini, di bawah <body> atau dimana saja yang sesuai tata letak yang sudah Anda buat deainnya..dengan desain website Anda
- tambahkan kode di bawah ini di antara </title> dan </head>
<script>window.twttr = (function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
t = window.twttr || {};
if (d.getElementById(id)) return t;
js = d.createElement(s);
js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
t._e = [];
t.ready = function(f) {
t._e.push(f);
};
return t;
}(document, "script", "twitter-wjs"));</script> - selesai
Dari beberapa tampilan disana, Anda tinggal memilih tampilan yang mana yang Anda sukai untuk ditampilkan di blog ataupun di website Anda.
Demikan cara menambahkan button share twitter dari Twitter Developer.
Semoga bermanfaat.
