[Tutorial] Membuat Link pada Gambar di Sidebar Blogspot

| On
March 06, 2015




Kita pasti pernah melihat blog yang memiliki gambar pada side bar yang apabila di klik akan me-link (mengarah) ke alamat web tertentu. Selain mempermudah pengunjung, tampilan blog kita pun akan semakin menarik karena akan meminimalisir banyaknya tulisan.


Blogspot sendiri memang sudah menyediakan gadget untuk menambah gambar dan memberikan link ke web tertentu dengan cara mengklik Dasbor > Tata letak> Tambah Gadget.





Kita tinggal memilih apakah gambar akan kita ambil dari URL atau Komputer.

Maka hasilnya akan seperti ini:


Hasilnya nampak seperti di atas dengan tulisan GALERI HIJABEEZ. Tulisan ini merupakan judul gambar yang wajib diisi ketika menambahkan gadget gambar dengan menggunakan fitur menambahkan gadget gambar dari blogspot. Apabila GALERI HIJABEEZ ini di klik, maka akan langsung mengarah pada facebook Fan Page Hijabeez. Silakan dicoba!


Ada cara lain untuk menambahkan gambar yang memiliki link atau mengarah pada alamat web tertentu, yaitu dengan menggunakan gadget penambahan HTML. Caranya cukup mudah, kita hanya perlu ketelitian dan kesabaran untuk mengotak-atik script html yang tersedia pada blog. 


Step-stepnya adalah sebagai berikut:

Masuk ke Dasbor> Tata Letak> Tambah Gadget.

Tambahkan Gadget HTML




Kemudian akan muncul:



Saya akan mencoba membuat gambar pada side bar yang akan mengarah pada profil facebook ketika gambar tersebut di klik. 

Tulis kode HTML berikut ini:


<a href='http://www.facebook.com/tetty.sidik'><img style="
width: 300px; 
height:293px;" src="http://i1279.photobucket.com/albums/y524/tettytanoyo/ohayo%20profil_zpskhojr3gt.png"/></a>


Tulisan Merah adalah alamat web yang akan kita tempel sebagai link.
Tulisan Biru adalah alamat URL gambar/foto.

Judul bersifat optional, sehingga bisa tidak diisi. Untuk Widht dan Height gambar/foto disesuaikan dengan ukuran gambar. Saya sendiri menggunakan Photoshop untuk melihat ukuran gambar.



URL gambar bisa didapatkan dari Photobucket (setelah kita meng-upload gambar tersebut), sebelumnya kita harus membuat akun di photobucket, keuntungannya adalah kita bisa menyimpan file gambar atau foto di internet dan kita dengan mudah mendapatkan URL gambar tersebut.



Setelah selesai klik SIMPAN.




Foto tersebut akan mengarah pada profil facebook saya ketika di klik. Silakan dicoba!




Jadi kesimpulannya, ada dua cara untuk menambahkan gambar yang memiliki link pada sidebar blogspot.

Pertama adalah dengan menggunakan GADGET GAMBAR, dan kedua adalah dengan menggunakan kode HTML dengan menambahkan GADGET HTML.




Selamat mencoba :)


Related Post:

[Tutorial] Membuat Icon Medsos Cantik di Blogspot



Related Post:
13 comments on "[Tutorial] Membuat Link pada Gambar di Sidebar Blogspot"
  1. Nice tutorial mak. Membantu emak2 lain yg sedang belajar :)

    ReplyDelete
  2. Tengkiu tipsnya ya mbak :)

    ReplyDelete
  3. dasar saya mah lola, baca berulang-ulang juga masih aja belum ngerti gimana caranya :(

    ReplyDelete
    Replies
    1. Ayo Mak semangat, bagian mananya yg ngebingungin?

      Delete
  4. Wah....ada tips keren... Kebetulan aku butuh banget info ini.. Pernah aku gagal utak-atik HTML karena gak ngerti akhirnya gambar dan link yang kuinginkan gak tampil.. Mksh ya sdh berbagi info..nice post dan salam kenal..

    ReplyDelete
    Replies
    1. Salam kenal juga Mak, mudah-mudahan manfaat :)

      Delete
  5. Kereeeee. Bunda Tetty, tidak blog nya tidak hanya menginspirasi tapi juga banyak ilmu yang bisa di "curi" hehhe...segera dipraktikkan...thanks for sharing dan mohon bimbinganya untuk Junior seperti saya *Sungkem hehehehe

    ReplyDelete
  6. mkasih mbak Ratih sudah berkunjung kesini :)

    ReplyDelete
  7. halo mbak, terima kasih atas post nya.
    saya mau tanya, bagaimana tutorial untuk membuat thumbnail social media di side bar seperti punya mbak ya?

    nuhun :)

    ReplyDelete

Terima kasih telah berkunjung ke blog ini, silakan tinggalkan komentar yang baik dan positif ya :D