Tutorial Memasang Banner di Blog

Bismillah…

Postingan saya kali ini mengenai tutorial/cara memasang banner di blog. Sebenarnya sudah dari dulu mau belajar pasang banner di blog cuma karena dari awal sudah berpikir bakalan ribet+susah=rempong hehehe makanya malas cari tahu caranya. Nah, berhubung pekerjaan saya sekarang menuntut untuk tahu caranya, maka mulailah saya belajar pasang banner di blog. Bermodalkan semangat juang ‘45, saya pun mulai googling+blog walking mencari tutorial memasang banner yang paling mudah menurut saya. Tidak perlu waktu yang lama akhirnya saya menemukan tutorial yang menurut saya mudah untuk dipahami Thumbs up yaitu blog milik Moehardian. Ternyata caranya tidak seribet+sesusah=serempong yang saya pikirkan loh, gampang banget ternyata Thumbs up Nah caranya pakai kode html, mau tau caranya? Lets check it out!!!!

1. Persiapkan gambar yang akan kamu jadikan banner. Kata Moehardian, “Sebenarnya banner bisa dibuat secara online melalui beberapa website khusus pembuat banner, tapi saya lebih suka edit gambar menggunakan photoshop.” Nah saya setuju, lebih enak edit gambar pakai photoshop, lebih puas editnya dibanding kalau harus edit online ^^ Kali ini gambar yang saya upload jenis gif, jadi setelah edit pakai photoshop, saya edit lagi pakai photoscape supaya gambarnya jadi gambar bergerak.

2. Setelah gambar yang akan dijadikan banner siap, login ke blog kamu.

3. Setelah login, upload gambar ke dalam postingan. Caranya seperti kalau mau melampirkan gambar di postingan, pilih Add Media >> pilih gambar yang akan di upload >> Insert into Post. Gambar diupload sebelum menulis sesuatu dalam post area, hanya gambar saja.

 

tutorial memasang banner

tutorial memasang banner

4. Setelah gambar berhasil terupload, ganti mode penulisan blog dari visual ke text untuk mengambil kode html gambar yang sudah diupload. Cari kode html yang berakhiran: .jpg / .png / .gif / atau tergantung file ekstensi dari gambar yang anda kamu upload.

 

tutorial memasang banner

tutorial memasang banner

tutorial memasang banner

tutorial memasang banner

Setelah diubah ke mode penulisan text  

tutorial memasang banner

tutorial memasang banner

  Kode html dari gambar contoh saya jadinya seperti ini: https://catatankhaerunnisaa.files.wordpress.com/2014/08/anigif.gif 5. Kita simpan kode html yang barusan diambil. Lalu copy kode html di bawah ini di Ms. Word atau sticky notes atau dimana pun terserah kamu.

<div style=”text-align: center;”> <img alt=”CatatanKhaerunnisaa” border=”0″ src=”https://catatankhaerunnisaa.files.wordpress.com/2014/08/anigif.gif” /><br /> <textarea code=”” cols=”15″ name=”” rows=”5″><center> <a href=”https://catatankhaerunnisaa.wordpress.com” target=”_blank” title=”CatatanKhaerunnisaa“><img src=”https://catatankhaerunnisaa.files.wordpress.com/2014/08/anigif.gif” alt=”CatatanKhaerunnisaa” /></a></center> </textarea></div>

Keterangan:

Hijau: Nama yang muncul ketika kursor berada di atas banner / gambar

Merah: Ganti dengan URL blog anda sendiri, banner yang diklik akan menuju ke blog tersebut

Biru: Kode html gambar kita

Orange: Kode html untuk menambah garis, jika dihilangkan maka text area html akan berada di samping banner

Ungu: Cols (kolom) rows (baris)

Setelah selesai, copy kode ke widget, selesai. Gampangkan, tidak ribet+susah=rempong, cuma butuh ketelitian dan kesabaran. Pertama kali coba pasang banner pakai kode html, saya langsung berhasil #hasilnya bisa dilihat di side bar blog saya, cuma yang masih jadi pertanyaan saya kok bisa muncul dua banner ya? Ada yang tahu kenapa? #ask the audience hehehe ^^

Woke sippo sampai disini dulu postingan saya, see you in my next post and selamat mencoba ^^9

Categories: cuap-cuap, Hobiku, Info | Tags: , , , , , , , , , , , , | Tinggalkan komentar

Navigasi pos

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

Buat situs web atau blog gratis di WordPress.com.

%d blogger menyukai ini: