Tiba-tiba
saya ingin menambahkan ikon tombol pada sidebar blog saya yang apabila di klik
maka akan tersambung pada sosial media saya. Walaupun saya tidak mempunyai
sosial media. Bukan karena apa-apa, tapi hal tersebut sangat menyita waktu
saya. Lebih baik saya ngeblog daripada mainan sosmed. Saya hanya mempunyai akun
sosmed google plus, sosial media yang tidak terlalu mainstream dibandingkan
facebook, twitter, instagram, atau bahkan path yang sangat anak smartphone
banget. Selain itu saya juga punya akun forum kaskus dan indowebster. Walaupun
dua forum tersebut bukan termasuk sosial media tapi tetap saya sertakan biar
keliatan tambah banyak gitu.
Langkah
pertama yang saya tempuh adalaha dengan menambah gambar pada sidebar blog saya.
Tapi hal tersebut ternyata membuat tampilan blog jadi agak janggal dikarenakan
adanya judul gambar yang aneh apabila jumlah sosmed lebih dari satu. Setelah
bertapa sambil jalan-jalan (tapa mlaku) di internet akhirnya saya mendapatkan sebuah
pencerahan.
Pencerahan apakah itu? Check this one
out
Cara
menambah tombol sosial media / website / apapun di sidebar blogspot anda :
- Buka Dashboard dan klik pada nama blog anda.
- Klik Layout terletak di daftar di sisi kiri layar.
- Klik Add a Gadget terletak di atas sidebar.
- Sebuah window baru akan terbuka. Pada Basics tab, scroll ke bawah untuk menemukan HTML / JavaScript dan pilih.
- Tambahkan judul jika anda mau. Di Content ketik kode tombol anda seperti gambar di bawah.
- Klik Save. Kembali di layar Layout, tarik tombol gadget baru anda ke lokasi di mana anda ingin pada sidebar. Klik Save Arrangement di sudut kanan atas layar Anda.
Ini
kode tombolnya :
<a href="URL
social media profile anda" target="_blank"/><img
src="URL gambar ikon social media anda" height="auto"
width="auto" alt="text nama tombol"/></a>
Anatomi
kodenya :
- Di dalam tag <a>, link ke halaman profil media sosial anda menggunakan atribut href. href = "URL social media profile anda"
- Tambahkan target = "_ blank" untuk membuka link di jendela browser baru.
- Dalam <img> tag, link icon gambar sosial media anda menggunakan atribut src. src = " URL gambar ikon social media anda"
- Menambah atribut tinggi dan lebar untuk menentukan ukuran gambar Anda dalam piksel. Saya lebih suka menggunakan auto (males mikir). Hehehe. height = "tinggi dalam piksel" width = "lebar dalam piksel"
- Atribut alt diperlukan dalam <img> tag untuk menentukan alternatif teks gambar apabila gambar tidak dapat ditampilkan. Sebagai contoh, pengguna memiliki koneksi internet yang lambat, atau dalam kasus orang buta menggunakan pembaca layar. alt = " text nama tombol"
Sekian
info dari saya, semoga bermanfaat.
Dikutip dari berbagai sumber dan
pengalaman pribadi.
v
BalasHapus