Cara menampilkan gambar di blog

Terkadang kita membutuhkan gambar didalam template, entah sebagai logo blog, banner/iklan, atau sebagai pemanis agar blog terlihat lebih bagus saat dipandang mata.

Ya, menggunakan gambar sebagai logo blog / website adalah hal termudah dan jamak yang umum dilakukan para desainer template, pasalnya untuk membuat tulisan ataupun logo dengan kode css/html sangatlah rumit (atau bahkan banyak yang enggan melakukannya).

Sehingga, menggunakan tulisan/logo yang dibuat dengan gambar adalah pilihan terbaik.


Pada prinsipnya, ada 3 hal yang diperlukan untuk menampilkan gambar di template blog.

1. Tempat menyimpan gambar secara online
2. Alamat url gambar yang sudah disimpan
3. Tag html untuk mengatur tampilnya gambar 

Hal pertama adalah tempat untuk mengupload dan menyimpan gambar tersebut secara online. Gambar yang akan digunakan perlu kita simpan di situs/portal yang selalu online agar gambar bisa selalu tampil.

Setelah gambar ter-upload dan tersimpan secara online, langkah selanjutnya yang diperlukan adalah memiliki alamat url tempat gambar tersebut disimpan. Alamat url gambar kemudian disusun bersama tag html dan dipasang kedalam template blog kita.

Setelah pengaturan dan penyimpanan tag html di template blog selesai maka kita bisa menampilkan gambar tersebut didalam blog/website kita sendiri.

Nah sudah terbayang kan proses yang diperlukan untuk menampilkan gambar di template blog ?

Pada artikel kita kali ini, saya akan menyampaikan cara untuk memasang dan menampilkan gambar kedalam template blog di Blogspot. Simak langkahnya dibawah berikut

Upload gambar yang akan digunakan

Langkah pertama adalah kita perlu mengupload gambar. Disini kita memanfaatkan blogspot sebagai tempat untuk meletakkan gambar yang akan digunakan, maka sebaiknya kamu login terlebih dahulu dengan akun blogspot kamu, lalu ikuti langkah-langkah mengupload gambar sebagai berikut.

1. Buka menu posts
2. Pilih New post
3. Berikan judul Kumpulan gambar untuk template atau sesuaikan dengan keinginan Kamu
4. Klik ikon bergambar Foto
5. Klik choose files pada menu Upload
6. Pilih gambar yang ingin Kamu upload dari komputer
7. Setelah proses loading selesai, klik gambar tersebut (sampai muncul garis biru disekelilingnya)
8. Klik tombol Add selected
9. Proses upload gambar kedalam draft postingan selesai

Menyalin alamat URL gambar

Setelah gambar selesai di upload, arahkan mouse ke atas gambar. Klik kanan mouse kamu, lalu pilih salin alamat url gambar. Setelah itu, pastekan alamat url gambar kedalam notepad untuk sementara.


Berikut adalah contoh alamat url gambar yang disimpan di blogspot.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjychOk1P1PzWeMKl2ENcBmdR6En8bkA1yG4bj7H5ap3IImlsXJtF7kyZYgiQgdWj8vmfXG3MBYrKewPr7PLKiWNuN2p-Z8PqiN-BdVn85vny6yl1YUM-H5zvzdM6R7VdZ0QilmzJ4SMvhY/s1600/stop.gif

Setelah kamu mendapatkan alamat url gambarnya, maka post yang barusan kamu buat tidak perlu dipublikasikan. Cukup klik tombol save atau simpan sebagai draft agar url gambar bisa digunakan lagi di lain waktu.

Memasang gambar kedalam template

Alamat url gambar yang sudah kamu punya tidak bisa langsung dipasang kedalam template, untuk itu diperlukan tag html agar gambar bisa tampil. Untuk pemasangannya, gunakan tag html seperti dibawah berikut

  <img src="alamat-url-gambar.jpg" alt="deskripsi gambar" title="judul gambar" />

Atau jika Kamu ingin agar gambar yang diklik bisa mengarah ke halaman suatu url website atau blog tertentu (misalnya ke halaman home, website pengiklan,dll), tag html berikut ini bisa kamu gunakan,

<a href="http://www.url-blog-tujuan.com" target="_blank"><img src="alamat-url-gambar.jpg" alt="deskripsi gambar" title="judul gambar" /></a>

Keterangan untuk tulisan yang berwarna merah

• alamat-url-gambar.jpg : isikan dengan alamat url gambar yang sudah kamu simpan sebelumnya
• deskripsi gambar : isikan dengan kata/kalimat deskripsi yang menjelaskan gambar
• judul gambar : isikan dengan Judul untuk gambar yang digunakan
• www.url-blog-tujuan.com : isikan dengan Alamat url tujuan

Setelah selesai mengatur tag html gambar, langkah berikutnya adalah memasang gambar ke template. Untuk pemasangan gambar kedalam template blog, Kamu bisa melakukannya dari menu layout >> add a gadget >> gadget html/javascript, lalu copy pastekan tag html gambar yang sudah dibuat sebelumnya kedalam gadget html/javascript. Atur posisi dimana kamu ingin meletakkan gambar tersebut. Setelah selesai, simpan perubahan dan lihat hasilnya.

Baca juga :

• Cara mengoptimalkan gambar postingan agar SEO friendly
• Cara mencari gambar bebas hak cipta di Google
• Cara memilih gambar yang cocok untuk postingan blog 

Kesimpulan

Hal utama yang diperlukan untuk menampilkan gambar di blog adalah alamat url gambar yang sudah disusun kedalam tag html.

Selain itu tempat penyimpanan gambar secara online (host) juga menjadi hal penting lainnya. Jika situs /portal tempat kita menyimpan gambar itu down/mati/tutup tentunya gambar yang ada di blog kita ikut error sehingga gambar tidak bisa muncul.

Demikianlah artikel cara menampilkan gambar di blog ini bisa saya sampaikan, semoga bermanfaat.