Kali ini saya kembali membuat update pada widget blog ala Bang Jarwo, dengan judul cara membuat dan memasang widget sosial media super ringan untuk sidebar pada blog anda.
Widget sosial media sangatlah berguna bagi sebuah blog. Widget ini dapat menghubungkan para pengunjung dengan kontak anda, atau akun sosial media milik blog anda.
Tentu saja... secara tidak langsung, pengunjung yang merasa terbantu dengan blog anda tidak segan-segan untuk mengacungkan jempolnya di sosial media milik blog anda dengan perantara widget ini. Selain itu, widget ini juga memiliki fungsi mempromosikan akun sosial media milik blog anda.
Alasan mengapa anda harus memilih widget ini karena widget ini sangat ringan dibandingkan anda menggunakan widget Fanspage Facebook, Lencana Google+ bawaan blogger, atau widget subscribe via email bawaan blogger. Mungkin kalau saya perkirakan, semua widget diatas waktu loadnya bila dibandingkan dengan widget sosmed buatan saya ini bisa mencapai 4x lipat lebih lama.
Tidak percaya? Silahkan anda coba sendiri dan cek berapa perbedaan waktu loadnya di GTMetrix.com...
Langsung saja, berikut beberapa keunggulan dan fitur yang tersedia di widget ini:
- 100% Responsive / Mobile Friendly
- SEO Friendly (menggunakan nofollow link)
- Menggunakan warna Flat Design
- Menggunakan efek :hover
- Pemasangannya yang mudah, sangat mudah
- Sangat-sangat ringan, karena:
- Tidak menggunakan gambar sama sekali
- Tidak menggunakan Javascript / CSS / Font Eksternal tambahan
- Pure CSS, tanpa Javascript apapun
Untuk cara pemasangannya, silahkan simak langkah-langkahnya berikut ini.
1. Silahkan anda buka blogger.com > Tata Letak (Layout) > Lalu tekan tambahkan widget.
2. Kemudian, pilih HTML/Javascript, dan masukkan kode ini didalamnya.
<style>
a.sosmed-jarwo {display:block;color:#fff !important;font-weight:bold;font-size:16px!important;margin:0 10px 10px;padding:10px;text-align:center;border-radius:3px;}
.sosmed-jarwo.fb {background:#4245ff;margin-top:10px !important} .sosmed-jarwo.fb:hover {background:#0003a8}
.sosmed-jarwo.gp {background:#ff4141} .sosmed-jarwo.gp:hover {background:#a80000}
.sosmed-jarwo.bg {background:#ffa041} .sosmed-jarwo.bg:hover {background:#a85f00}
</style>
<a class='sosmed-jarwo fb' href='URL FACEBOOK' rel='nofollow' target='_blank' title='Fanspage Blog'>Facebook</a>
<a class='sosmed-jarwo gp' href='URL GOOGLE+' rel='nofollow' target='_blank' title='Admin Blog'>Google +</a>
<a class='sosmed-jarwo bg' href='http://feedburner.google.com/fb/a/mailverify?uri=ID FEEDBURNER' rel='nofollow' target='_blank' title='Subscribe Blog via Email'>Blogger</a>
Catatan Penting!
- Silahkan ganti "URL FACEBOOK" dengan url Facebook Fanspage blog anda atau Facebook pribadi anda
- Ganti "URL GOOGLE+" dengan url akun Google+ pribadi anda atau url komunitas/blog anda di Google plus.
- Ganti pula "ID FEEDBURNER" dengan ID feedburner blog anda, misal ID feedburner milik Blog Kode Jarwo ini "KodeJarwo" (tanpa tanda petik).
3. Simpan widget anda dan lihat hasilnya.
Bagaimana? Apakah widget sudah terpasang dengan baik? Sebenarnya saya ingin sekali menambahkan barnya menjadi 5, yaitu dengan tambahan bar untuk sosial media Instagram dan Twitter, tetapi terlihat kurang menarik. Mungkin akan saya coba pada widget sosial media selanjutnya.