Menampilkan Gambar secara Pop-Up di WordPress dengan Lightbox

Gambar (image/picture) di WordPress secara default ditampilkan apa adanya, bahkan cenderung untuk di-compress demi mengejar pageload yang cepat. Emang bener juga sih, karena jika web kita lama di load-nya gara-gara gambar, maka kemungkinan besar pengunjung akan cepat bosan dan segera pindah ke lain hati. Nah salah satu upaya untuk mempercepat loading suatu web page adalah dengan mengkompress gambar sekecil mungkin tanpa mengurangi kualitasnya. Demikian kira-kira prinsip sederhana SEO (Search Engine Optimization) dari sisi page load dan image.

Permasalahannya adalah kadang kita ingin melihat gambar lebih besar untuk melihat beberapa detail yang ada di gambar. Gambar yang telah diperbesar tadi tentunya harus dapat menyesuaikan ukuran layar. Tampilan di desktop akan berbeda ketika diakses melalui smartphone (tampilan mobile). Hal ini perlu dilakukan agar pengunjung merasa nyaman mengakses web/blog kita

Prinsip-prinsip gambar responsive (dapat menyesuaikan ukuran layar) juga termasuk dalam penilaian SEO suatu website oleh search engine

Langkah-langkah Instalasi dan Setting Plugin Lighbox WordPress

Jika web / blog Anda menggunakan platform WordPress, solusi mudah dari permasalah di atas adalah dengan menginstal plugin ‘Lightbox’. Plugin Lightbox adalah suatu plugin WordPress yang akan menampilkan gambar (dan video) ke dalam sebuah jendela pop up. Di jendela ini gambar akan ditampilkan sesuai resolusi originalnya. Dengan demikian gambar akan tampak lebih besar dan menampilkan detail-detail yang tidak tampak ketika diakses dengan cara biasa. Apa dan bagaimana cara menginstal dan memakainya? Berikut langkah-langkah step by step-nya

1. Instal Plugin Lightbox

Dari menu samping ‘Plugin’ pilih sub menu ‘Add New’. Ketik ‘lighbox’ di kotak search ‘keyword’ kemudian pilih plugin ‘Lightbox & Modal Popup WordPress Plugin ā€“ FooBox‘. Klik tombol ‘Install’ kemudian aktifkan (‘Activate’)

2. Lakukan setting lightbox di draft Post

Agar dapat berfungsi, kita harus menambahkan hyperlink gambar dan atribut ‘rel’ kita isi dengan ‘lightbox’. Contoh bisa dilihat digambar berikut ini:

3. Lihat Hasilnya di Blog Post Anda

Simpan draft Post Anda kemudian publish. Sekarang coba Anda klik gambar Anda, maka jendela popup akan muncul dan gambar akan tampil lebih besar. Anda dapat beralih ke smartphone dan akses kembali web/blog Anda dalam mode portrait dan landscape. Perhatikan bahwa gambar akan menyesuaikan ukuran layar.

hasil instalasi lighbox di wordpress, gambar muncul di pop up

Demikian sedikit tips menampilkan gambar lebih besar di blog wordpress, semoga bermanfaat untuk Anda yang sedang mencari info tersebut. Plugin ini adalah plugin lightbox ke lima yang saya coba di blog saya. Plugin lainnya (simple Lightbox, Easy FancyBox, Lightbox-Gallery Lightbox, wp-JQuery-Lightbox) tidak berhasil saya instal ke blog saya (plugin 1-3), sementara plugin ke 4 berhasil diinstal namun tidak bisa responsive. Ohya saat ini versi WordPress saya adalah 6.0.3, barangkali ada beberapa plugin yang memang outdated atau mungkin plugin-nya crash dengan plugin lain di blog saya. Silahkan dicoba-coba sendiri, barangkali plugin yang berhasil saya instal berhasil pula di blog Anda. Selamat mencoba and keep writing and sharing on your blogs šŸ˜Š

0 0 votes
Article Rating

Leave a Reply

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x