Menambahkan sebuah gambar di wordpress, bahkan sebuah galeri sangatlah mudah. Namun, menambahkannya diluar isi postingan atau halaman cukup rumit untuk seorang pemula. WordPress memang tidak menyediakan fitur untuk menambahkan gambar di widget sidebar maupun footer misalnya. Jika kita ingin menambahkan gambar di widget, kita bisa melakukannya dengan cara manual menggunakan code html atau menggunakan plugin tambahan. Nah, dibawah ini akan saya jelaskan kedua cara tersebut.
1. Menambahkan Gambar Secara Manual Menggunakan Kode HTML pada Widget
Pertama-tama, anda harus upload dulu gambar ke situs wordpress anda. Caranya klik menu Media > Add New di menu sidebar admin, lalu pilih gambar untuk diupload. Setelah gambar terupload, klik link edit seperti ditunjukkan pada gambar di bawah.
Anda akan diarahkan ke halaman edit media, di mana anda akan menemukan url untuk gambar tersebut di samping kanan. Anda harus meng-copy url tersebut.
Setelah itu, klik menu Appearance > Widget di menu sidebar kiri admin wordpress anda untuk menambahkan widget. Tambahkan widget baru dengan widget teks/Text Widget.
Di teksarea pada widget di atas, anda dapat menambahkan gambar dengan kode html dengan pola berikut :
<img src="Paste URL yang tadi di copy disini" alt="judul gambar anda"/>
Tag HTML <img/> di gunakan untuk menampilkan gambar pada halaman website. Tag tersebut membutuhkan 2 atribut yaitu src untuk mendefinisikan letak gambar dan atribut alt untuk alternatif teks atau judul untuk gambar. Sehingga hasil akhirnya akan terlihat seperti dibawah :
<img src="http://www.example.com/wp-content/uploads/2014/09/strawberries.jpg" alt="Strawberries" />
Simpan widget anda dan lihatlah hasilnya.
2. Menambahkan Gambar dengan Plugin Image Widget
Jika anda tidak ingin menyentuh kode sama sekali, cara yang lebih mudah untuk menambahkan gambar di widget adalah denga menggunakan plugin Image Widget.
Aktifkan plugin tersebut, lalu klik menu Appearance > Widget untuk menambahkan widget lagi. Kali ini, akan tersedia widget dengan tipe baru yaitu “Image Widget” untuk menambahkan gambar. Buatlah sebuah widget dengan tipe tersebut.
Setelah itu, anda hanya perlu meng-klik tombol “select an image” pada widget tersebut untuk memilih/upload gambar yang ingin ditampilkan.
Setelah terupload, gambar akan secara otomatis tertampil dan akan tampil juga pengaturan seperti title, alternate text dan caption dibawahnya. Anda juga dapat menambahkan tautan/link untuk gambar tersebut dan memilih ukuran gambar dari pilihan ukuran(size) yang tersedia.
Setelah semua pengaturan selesai, tinggal klik tombol simpan dan gambar anda sudah tampil di sidebar.
Sekian. Semoga bermanfaat,
~Muhammad Syakirurohman~
Diterjemahkan dari www.wpbeginner.com dengan sedikit perubahan.
SitusGaptek.com - Situs Berita Teknologi Terbaru
makasih gan buat tutornya 🙂
hpandro.com
sangat membantu min , tengyu 🙂
rio
request artikel yah min kalo bisa,untuk membuat galery foto dengan css yang efek nya keren
Syakir Rahman
Siap.. Tunggu Senin depan yaaah heheh
Erapuji
Wihhh keren dari kemarin saya bingung gmn cara dpt url gambar yg mau saya pasang dan sekarang sudah sukses
tks
Syakir Rahman
Yap.. sama-samaa
desain rumah minimalis
wah, mantap sekali mastah, newbie nih lagi belajar, thanks ya mastah
nadyanadine
Bagus … alternatfi tanpa coding, mudah tanpa ribet. Kalo misal tambahkan ukuran image Width sama Height gimana caranya mas syakir?
Syakir Rahman
Kalau pada plugin yang dijelaskan diatas, tidak ada fitur untuk tambah ukuran.. Tapi disitu ada pilihan ‘size’ yang mana pilihannya merupakan beberapa ukuran default..
ahmad rizky
mas saya ingi nanya . kenapa maximum upload size saya hanya 5 byte saja ya ?
Syakir Rahman
Itu konfigurasinya ada di hosting.. Ada file bernama php.ini , disitu ada konfigurasi untuk menentukan maximal ukuran file untuk di upload, namanya kalau gasalah max_upload_file_size = (ukuran file) .. Kalau tidak mengerti, hubungi pihak hostingnya saja
PayTren
Mohon pencerahannya jika memasang gambar yang jika di klik akan ngelink ke url yang lain? Terima kasih
Syakir Rahman
Yaa, gambarnya di kasih link(tautan), kodenya kurang lebih seperti ini :
<a href="http://tujuan-url"><img src="http://url-gambar-yang-ditampilkan"/></a>
PayTren
Makasih atas Pencerahannya.
hari
oke, terimakasih. sudah berhasil di http://sukodonodampit.com/
Edi
Mas kalo gambar nya mau dikasih link gimana ya.. Thx
Syakir Rahman
Pakai cara manual, terus kasi tag a href sebelum tag img
Edi
Walah… diatas udah ditulis. Makasih
intisarikubah
Bagus infonya langsung saya praktekkan dan mantep. terima kasih
seadclark
Mantap gan! joss gandos artikelnya, barangkali agan2 butuh referensi lebih dalam tentang cara membuat sidebar di WordPress, agan bisa berkunjung ke http://kafeinkode.com/tutorial-cara-membuat-sidebar-di-wordpress/
seri nian
terima kasih di atas tunjuk ajar ini
semoga banyak lagi tipsnya ya
Nisa
terima kasih atas perkongsian ilmu. sgt bermanfaat dan membantu =)
lapakpitu
Terimakasih petunjuk berbagi ilmunya.
suendah
terimakasih tutornya
Lintang Gypsum
Sangat bermanfaat tutorialnya, ditunggu update berikutnya
sumurdiladang
terima kasih mas, sangat berguna sekali buat uder wordpress pemula seperti saya.
Jonathan
Kenapa kalau pasang link (misalnya http://www.anu.com , linknya selalu diikuti oleh link asal (menjadi seperti ini) http://www.asal.com/www.anu.com.
Syakir Rahman
Ada script yang salah gan di theme-nya
kekitaan
Salam Mas Bro
Huhu, keren keren dan berhasil
Tau ilmu kayak gini darimana sih Bro?
Mauliate
Terimakasih
syakirurahman
Yaaa belajar lah :D..
Di internet banyak.. Asal tau keywordnya, dalam bahasa inggris lebih lengkap
Tani Nugroho
Akhrnya ketemu caranya…
Terimakasih bang…
Maklum masih belajar nih…
Kurni
Sangat membantu.. tksh banyak..
M. Arif Budiman
Maksih, artikelnya sangat membantu, alhamdulillah saya udah berlangganan di Website ini
Kasamago
Gan klo masukin gambar di dalam postingan (artikel) tanpa upload alias via paste url ala blogspot bisa ga y?
syakirurahman
bisa kok, langsung di editornya..
wafeekids
Alhamdulillah, terimakasih banyak atas ilmunya mas… Sangat bermanfaat bagi saya yang baru merambah ke dunia wordpress. Semoga Allah memberikan balasan yang banyak atas kebaikan mas syakirurahman dalam menyebarkan ilmu yang bermanfaat, aamiin..
syakirurahman
Amiin. terima kasih juga doanya 🙂 Semoga berbalik
mod apk
owh, begitu ya gan cara nya, thanks gan, jadi ngerti :), sangat membantu 😀
oktafanny
terimakasih sangat membantu
widiasmoko
Makasih tutorialnya…sangat membantu yg lagi belajar menekuni web…bisa kunjungi web saya dan kasih masukan ya..allasaya.com