Cara memasang gambar banner di Sidebar blog WordPress.

Setiap pagi setibanya dikantor, aku selalu membaca berita dulu di detik.com sebelum mulai kerja. Ada satu artikel yang sangat menarik di detikInet untuk topik E-community dan aku selalu mengikuti perkembangannya. Hal ini baru kulakukan di bulan mei ini. Isi artikel ini tentang pemenang Blog Award. Wuih, seru juga kalau aku ikutan ya….

Aku mulai meluncur ke situs cara mendaftar menjadi peserta ISBA 2010. Bagiku cara pendaftarannya tidak mudah ternyata. Soalnya aku belum pernah memasang banner di sidebar. Tapi “when there is a will there is a way… and I believe that!”. Maka mulailah aku ke fase percobaan “trial and error” as always.

Alat yang digunakan:
1. Internet Explorer 8 (IE)
2. Blog di WordPress
3. Account Flickr.

Langkah yang dilakukan:

1. Memilih banner ISBA 2010. Aku pilih yang quotenya “Think Before Posting”. Kamu bisa pilih yang lainnya, tersedia 8 banner dengan 8 quote yang berbeda.
Lalu arahkan mouse ke banner pilihan tersebut lalu klik kanan pilih “Save Picture As”. Simpan file banner ini di harddisk kamu.

2.Upload file banner tersebut ke account Flickr kamu. Set privacy foto menjadi “Anyone can see this photo” / Public. Banner akan ada dideretan photostream flickr kamu. Klik banner tersebut supaya tampil satu halaman web berisi satu gambar banner.

3. Yang diperlukan adalah direct URL (yaitu URL yang berakhiran jpg) dari gambar banner di flickr untuk dipasang diblog kamu. Jadi bukan URL yang ada di address bar IE lho… Karena jika yang diambil URL dari halaman web yang berisi gambar banner itu (yaitu URL di address bar tadi…) maka yang muncul diblog kamu bukan gambar banner melainkan hanya tanda X merah di kiri kotak image yang menandakan IE tidak mengenali URLnya.

Cara untuk mendapatkan direct URL adalah dengan mengklik kanan halaman web flickr lalu pilih “View Source”. Maka IE akan menampilkan jendela baru berisi source code halaman web itu.
Kemudian cari code ini:
Kalau di aku codenya begini:

<link rel=”image_src” href=”http://farm5.static.flickr.com/4064/4618407338_0b7cb57a70_m.jpg&#8221; />

Maka direct URLnya adalah:

4. Lalu buka settingan dashboard WordPress. Buka menu Widgets. Tarik widgets yang bernama “Image” ke sidebar. Buka settingan “Image” dengan mengklik tanda panah kebawah. Lalu isi kan “Image URL:” dengan direct URL yang telah didapat tadi.

5. Lalu isi juga “Link URL (when the image is clicked):” dengan tautan URL yang diberikan di situs ISBA 2010. Kemudian klik “Save”.

Selesai dan bisa dilihat banner ISBA 2010 akan terpasang diblog WordPress kamu.

Referensi: Forum WordPress