Cara Buat Link Dengan Gambar

Cara Buat Link Dengan Gambar

Sebelumnya apa itu Link?
Link adalah sebuah text atau gambar yang menjadi perwakilan sebuah URL atau Halaman Web. Apabila kita klik text atau gambar tersebut, maka kita akan dibawa ke sebuah URL atau Halaman web yang menjadi tautan text tersebut .

Bagaimana Membuat Link?
Format dasar nya adalah sebagai berikut:

<a href="URL ANDA"> TEXT ANDA </a>

Untuk contoh lengkapnya perhatikan kode HTML dibawah:

<a href="http://epul-japanese.blogspot.com"> epuljapanese Blog </a>

Dan hasil yang tampil seperti berikut: epuljapanese Blog

Kode HTML diatas adalah sebuah link. Yang mana link tersebut menjadi perwakilan dari blog saya yaitu http://epul-japanese.blogspot.com dan kata yang menjadi wakil / tautan ke blog tersebut adalah epuljapanese Blog.

Jadi jika anda ingin membuat Link, anda tinggal mengganti URL nya dan teks yang mewakili URL tersebut.

Tambahkan target="_blank" setelah URL anda untuk membuka Link di jendela baru.
Contoh:
<a href="http://epul-japanese.blogspot.com" target="_blank" > epuljapanese Blog </a>

Nah sekarang Cara membuat Link dengan Gambar
Tapi sebelum ke cara membuat link dengan gambar, kita harus tahu dulu untuk menampilkan gambar pada blog. Berikut kode dasarnya :

<img src="alamat url gambar atau tempat gambar disimpan">

Contoh : saya ingin menampilkan gambar ini , maka kode html yang harus di buat adalah seperti ini :

<img src="http://lh6.ggpht.com/_VnejlvAz6ME/TFglLUbM11I/AAAAAAAAAJA/B6nF-3rQyj0/s800/epul.jpg">

Sekarang untuk membuat link dengan gambar, format kodenya sebagai berikut:

<a href="url anda"><img src="url gambar anda"></a>

Anda tinggal mengganti url anda dengan alamat yang akan di link, dan url gambar anda dengan url tempat menyimpan gambar anda. Contoh :

<a href="http://epul-japanese.blogspot.com"><img src="http://lh6.ggpht.com/_VnejlvAz6ME/TFglLUbM11I/AAAAAAAAAJA/B6nF-3rQyj0/s800/epul.jpg"></a>

Maka Hasilnya :

Anda juga dapat menambahkan tag alt untuk keterangan gambar tersebut.
Contoh:

<a href="http://epul-japanese.blogspot.com"><img src="http://lh6.ggpht.com/_VnejlvAz6ME/TFglLUbM11I/AAAAAAAAAJA/B6nF-3rQyj0/s800/epul.jpg" alt="epuljapanese Blog"/></a>

Fungsi alt
Alt juga dapat di index oleh mesin pencari, misalkan di postingan anda tidak ada keyword blogger misalnya, tapi di keterangan gambar (keterangan menggunakan alt) anda masukkan keyword blogger. Nah ini sangat menguntungkan buat peringkat blog kita.

Contoh : saya akan membuat suatu link ke blog ini dengan gambar . Maka kode yang harus di buat adalah:

<a href="http://epul-japanese.blogspot.com"><img src="http://lh6.ggpht.com/_VnejlvAz6ME/TFglLUbM11I/AAAAAAAAAJA/B6nF-3rQyj0/s800/epul.jpg" alt="epuljapanese Blog"/></a>

Sehingga hasilnya menjadi .

Untuk mendapatkan URL gambar klik kanan saja pada gambar yang ingin di jadikan link kemudian pilih copy image location lalu paste kan di notepad. Atau anda upload dulu gambar anda di web hosting gambar dan dapatkan URL gambarnya.

Anda baru saja selesai membaca artikel di EpulJapanese Blog yang berjudul: Cara Buat Link Dengan Gambar

dengan URL: http://epuljapaneseblog.blogspot.com/2010/08/cara-buat-link-dengan-gambar.html

Apabila anda menyukai artikel ini atau merasa bermanfaat silahkan bagikan artikel ini di Facebook, Google+ dan Twitter anda dengan meng-klik tombol-tombol Share yang ada diatas postingan ini.

Dapatkan artikel EpulJapanese Blog terbaru langsung ke email anda. Silahkan masukkan alamat email anda:

Related Post

Tips Trik Tutorial Ms.Office

• Cara Agar Dokumen Ms.Word Tidak Bisa di Copy dan di Edit
• Cara Agar Postingan Blog Tidak Bisa Copy Paste, di Blok dan klik Kanan
• Cara Dokumen Ms. Word Tidak Bisa di Edit
• Cara Menampilkan Kotak Komentar di Blogspot
• Cara Membuat Tabel di Postingan Blog Dengan Menggunakan Google Dokumen
• Cara Membuat Spoiler di Blogspot
• Memasang Windows Alert di Blog
• Cara Men-disable Klik Kanan dan Block di Blogspot
• Cara Mengganti Cursor di Blog Dengan Gambar
• Memasang Tombol Like Facebook di Blogger
• Beberapa Variasi Tulisan Chat di CBOX
• Indonesia Siap Bersaing di SERP
• Label di Klik Tampil Hanya Judul Postingan
• Cara Memasang Balas Komentar Pada Komentar di Blogspot
• Cara Membuat Scroll Pada Daftar Komentar di Blogspot
• Cara Memasang Status Yahoo Messenger ( YM ) di Blogspot
• Cara Menampilkan Background Pada Postingan Blogspot
• Cara Membuat Kotak Iklan Di Blog
• Cara Setting Blog Di blogger / Blogspot
• Cara Membuat Related Post di Bawah Postingan Blog
• Cara Membuat Slideshow Album Foto dan Menampilkannya di Blogspot
• Mendaftarkan Blog atau Web ke Search Engine
• Cara Membuat Scroll pada Label, Arsip Blog Atau Widgets Lain
• Cara Menampilkan Code HTML di Postingan Blogspot
• Cara Membuat Blog di Blogspot