Cara Mudah Membuat Link dengan Gambar (Logo atau Banner)
Script atau code untuk menghasilkan link dengan gambar atau gambar berlink terkadang dibutuhkan ketika anda bertukar link (link exchange) dengan teman blogger anda, atau ketika anda membangun backlink, atau ketika anda promosi di situs orang lain, dan anda menginginkan link yang anda pasang tersebut menampilkan sebuah gambar baik itu gambar dari produk yang anda jual yang sedang anda promosikan atau gambar dengan logo dari blog anda, dan ketika gambar tersebut di klik maka akan menuju halaman blog atau situs anda.
Cara membuat link pada blogger dengan logo atau tapilan sebuah gambar sebenarnya sangatlah mudah, namun tidak sedikit blogger masih bingung bagaimana cara membuatnya. Ketika kita membuat sebuah link atau tautan, pada umunya akan menampilan text berwarna biru dengan garis bawah, namun tulisan tersebut bisa kita ganti dengan gambar caranya tentu saja dengan menggabungkan link dengan gambar.
Langkah-langkah cara membuat link dengan logo gambar?
Sekarang mari kita uraikan bagaimana cara membuatnya?Untuk membuat link pada gambar cukup dengan menggunakan script/kode HTML, dengan cara menggabungkan antara perintah kode HTML untuk membuat link dengan perintah kode HTML untuk menampilkan gambar, sehingga gambar seolah-olah menjadi tombol link nantinya, langkah-langkahnya adalah sebagai berikut:
Langkah #1:
Upload GambarYang akan digunakan
Langkah pertama yang harus anda lakukan adalah anda harus mengupload gambar yang akan anda gunakan untuk link tersebut, langkah-langkanya adalah sebagai berikut:1. Sediakan sebuah gambar yang akan anda pasang untuk link tersebut.
2. Silahkan Upload gambar tersebut, bisa kita upload atau unggah di blog yang kita miliki, atau bisa juga di file hosting tertentu.
Untuk contoh kasus, kita akan coba meng-upload gambar pada blog agar lebih praktis, langkahnya adalah sebagai berikut:
a. Bikin artikel baru, kemudian pada editor postingan, gunakan fasilitas untuk memasukan gambar pada postingan, seperti terlihat pada gambar dibawah ini:
b. Silahkan upload atau unggah gambar yang akan anda pasang, kemudian pilih gambar yang telah berhasil di upload sehingga muncul di editor postingan seperti gambar dibawah ini:
c. Silahkan pilih menu Salin Lokasi Tautan (untuk mendapatkan lokasi url dari gambar tersebut), kemudian paste untuk sementara di Notepad, biar tidak lupa.
Langkah #2:
Buat Script HTML Link dengan Gambar
Setelah anda meyiapkan gambar yang akan digunakan untuk link yang akan dibuat, langkah berikutnya adalah menyiapkan script dalam kode HTML untuk membuat link dengan gambar.Untuk membuat link dengan gambar Kita akan gunakan kode html dengan menggabungkan kode html untuk membuat link dengan kode html untuk menampilkan gambar, hasil akhirnya silahkan anda gunakan script kode html dibawah ini:
<a href='URL_TUJUAN'>Kemudian Silahkan anda gunakan pengaturan dibawah ini:
<img src='URL_GAMBAR' width='LEBAR_GAMBAR' height='TINGGI_GAMBAR' title='JUDUL_GAMBAR' alt='DESKRIPSI GAMBAR' border='none' />
</a>
a. URL_TUJUAN, Silahkan anda isi dengan url tujuan misal (http://strukturkode.blogspot.com), jika link tersebut di klik maka pengguna akan dibawa halaman strukturkode.blogspot.com.
b. URL_GAMBAR, Silahkan anda masukan url lokasi gambar yang sudah anda upload dan anda kopi di notepad sebelumnya.
c. LEBAR_GAMBAR, isi dengan angka, disarankan sesuaikan dengan lebar gambar yang digunakan.
d. TINGGI_GAMBAR, isi dengan angka, disarankan sesuaikan dengan tinggi gambar yang digunakan.
e. JUDUL_GAMBAR, silahkan masukan judul dari gambar.
f. DESKRIPSI_GAMBAR, Silahkan anda isi dengan kata kunci yang anda target yang sesuai dengan halaman yang akan dituju, ini sebaiknya diisi untuk meningkatkan Faktor SEO untuk gambar tersebut.
Sebagai contoh hasilnya bisa terlihat seperti kode dibawah ini:
<a href='http://strukturkode.blogspot.com' title='strukturkode blog'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtm_08bhN8JxdN-OyFGvkR5K2eXBGBM7opY_mGA4fuW5d2p7SHMgKQh4ypC3oYWxWItdxm8Fb6A43AQQ9cORHUeEypnJkVMshPX0h7zCbLnE5-SL7ddAz_CugewLzEf6DuJb1wocVS8UvM/s1600/contoh+gambar.png' alt='blog untuk belajar seo dan blog' title='strukturkode blog' width='235' height='128' border='no' /></a>dan hasilnya terlihat seperti gambar dibawah ini:
Jika gambar tersebut di klik maka anda akan dibawa ke halaman utama strukturkode.blogspot.com
Demikian artikel sederhana tentang Cara Mudah Membuat Link dengan Gambar (Logo atau Banner), selamat mencoba dan semoga bermanfaat.
oh gitu caranya, cocok buat artikel affiliasi yang menyertakan gambar banner...
ReplyDeleteartikel-artikel blog ini sangat membantu saya...trms
terima kasih artikel nya sangat membatu untuk yang baru belajar
ReplyDeletemakasih gan atas infonya, artikel ini sangat membantu saya.
ReplyDeletemantap nih artikel nya, sangat membantu saya seorang newbie blogger
ReplyDeleteMantap gan tutornya, kebetulan banget lagi nyari" ketemu juga.
ReplyDeleteThanks :)
Owh jadi gitu caranya buat link dan gambar yang benar ya, saya harus rajin belajar nih, artikelnya mantap dan langkahnya mudah di pahami. makasih artikelnya udah membantu :)
ReplyDeleteTerimakasih gan atas ilmunya, Saya sudah berhasil, semoga Allah memlimpahkan rahmatnya pada kita sekalian, amin
ReplyDeletesebelumya terima kasih atas penjelasannya mas, saya masih belum jelas dengan membuat link dengan menggunakan title atau rel apakah kedua ini berbeda dengan href dan apakah ada fungsi tertentu ya menggunakan link seperti itu?
ReplyDeleteHref='url' itu tujuan url situs jika diklik maka akan menuju url yang diletakan di href.
Deleterel='dofollow atau nofollow' ini untuk membuat link apakah link dofollow atau nofollow, jika dofollow tidak usah pake rel jika link jenisnya nofollow tambahkan rel='nofollow'
title='title', ini agar lebih mudah dikenali robot mesin pencari
juga alt='kata apapun' ini akan lebih dikenali mesin pencari tentang gambar apa itu, mesin pencari tidak bisa mengenali gambar kecuali dari attribut yang kita pasang di alt dan juga title dan juga nama file gambar.
Tentu bisa gan, silahkan libatkan CSS
ReplyDeleteterima kasih infonya pak, saya mau tanya untuk mengatur letak posisi gambarnya sperti apa?
ReplyDeleteKlik saja gambarnya gan, kemudian nanti akan muncul menu popup, pilih posisi gambar left atau center atau right, atau agan bisa gunakan css
Deletegan,. cara yang sama persis, tapi buat gbr sejaajr gimana? buatkan sciptnya dong,.. thakns...
ReplyDeleteWaduh saya malah tidak mengerti pertanyaannya gan, bisa lebih dijelaskan atau punya screen shoot contohnya, semoga saja bisa bantu
Deletethanks yo gaes, setelah upload ke blog dan dipasang ke widget, ternyata sudah tersedia lokasi a href nya, jadi tinggal ganti ke link yang dituju, dan hasilnya.....sempurna,,, salam gaes :)
ReplyDeleteyuk temenan, IG saya @ malindo.my.id
Maksudnya url gambar itu url yang bagaimana bos...?
ReplyDeleteLokasi gambar mas, alamatnya apa
Deleteseperti:
http://lh6.googleusercontent.com/-Iznwc2EWUxs/AAAAAAAAAAI/AAAAAAAACgQ/wREkrOE5FNE/s35-c/photo.jpg
itu di atas salah satu contoh url gambar
Terima kasih mas, caranya mudah dipahami. Kalau misalnya link gambarnya ditujukan ke iklan adsense kira-kira boleh ga sama om gugel?
ReplyDeleteterima kasih sebelumnya
Lebih baik hindari gan kalo untuk adsense, khawatir rentan
DeleteMasih bingung alamat gambar itu apa tautan gambar itu apa ?
ReplyDeleteAlamt gambar: alamat url gambar, jadi gambarnya harus diupload dulu nanti alamat urlnya ambil.
DeleteTautan gambar: link dengan gambar, biasanya link berupa teks bergaris bawah berwarna biru jika diklik akan menuju halaman lain, nah tautan gambar adalah bagaimana membuat link yang biasanya text diganti dengan gambar
terus naruh link ke mana ka' belum faham aku
ReplyDeleteDi atas hanya untuk kode html membuat link dalam bentuk gambar, dimana kita naruh link, yang jelas dimanapun selama kita punya izin(memodifikasi kode) terhadap halaman situs.
DeleteBisa di forum-forum atau di halaman blog sendiri dll
script nya diketik dimana ya?
ReplyDeleteEditor blog tapi pilih yang mode HTML
Deletepas di html, taruh scripnya sembarang aja boleh kah?
DeleteTergantung posisinya ingin diletakan dimana dia akan muncul disana
Delete