Cara Membuat HTML Iframe Menjadi Lebih SEO dan Responsive
Membuat IFRAME Menjadi Lebih SEO Friendly dan 100% Responsive

Anda para web designer pasti sudah tidak asing lagi dengan bahasa pemrograman HTML. Salah satu kode yang ada dalam HTML adalah IFRAME.  Iframe, merupakan sebuah tag dari HTML yang berfungsi untuk menampilkan sebuah halaman dari web lain. Dengan kata lain, anda dapat menampilkan web lain di dalam web anda.

Terkadang, saat memasang Iframe di blog, ada saja masalah-masalah baru yang muncul, diantaranya yaitu Iframe yang terpotong alias tidak responsive, dan menurunkan skor SEO blog di chkme dan tool pengecek skor SEO lainnya.

Nah kali ini saya ingin sedikit berbagi tips bagaimana cara supaya Iframe tadi menjadi responsif (mengikuti ukuran lebar layar) dan menjadi lebih SEO dari sebelumnya. Langsung saja silakan ikuti 2 langkah berikut ini...

Membuat Iframe Menjadi Responsive


Pertama, silakan anda lihat terlebih dahulu tag Iframe anda. Contohnya seperti ini:

<iframe src="https://blog.kodejarwo.com/" />

Kemudian, tambahkan atribut width dengan value 100% di dalamnya, sehingga berbentuk seperti ini:

<iframe width="100%" src="https://blog.kodejarwo.com" />

Simpan dan lihat hasilnya. Cara diatas merupakan cara manual, anda harus memasukkan atribut width tadi ke semua tag secara manual satu per satu. Bagi yang ingin otomatis, silakan anda buka Edit HTML, cari kode </head> atau <head/>, lalu masukkan kode ini tepat diatasnya.

<style>
 iframe {width:100%}
</style>

Simpan template dan lihat hasilnya.

Membuat Iframe Menjadi SEO Friendly


Seperti biasa, buka Edit HTML, lalu cari kode berikut ini:

<iframe

Ganti semua kode tersebut menjadi seperti ini:

<object

Bila selesai, cari lagi kode berikut:

</iframe>

Setelah itu, ganti semuanya menjadi seperti ini:

</object>

Simpan template dan lihat kembali skor SEO anda.

Saya yakin, setelah melakukan 2 cara diatas skor SEO blog anda menjadi meningkat dan Iframe menjadi responsive 100%, sehingga ia mengikuti berapapun ukuran dari lebar layar. Saya pun menggunakan cara ini pada blog DEMO template saya yang bernama Template Jarwo.
Silakan pilih sistem komentar anda ⇛   

Silakan berkomentar dengan sopan. Jangan buang-buang waktu anda hanya untuk melakukan SPAM di sini.

Ozik Jarwo Kode Jarwo
Ozik Jarwo author
# 27 Juli 2018 15.16

Nda bisa. Sekalipun bisa, pasti ada banyak minus nya.

Balas
Miras Tampan Kode Jarwo
Miras Tampan
# 27 Juli 2018 04.15

kalau misal untuk komentar blog bisa nggak bro?

Balas
Ozik Jarwo Kode Jarwo
Ozik Jarwo author
# 9 April 2018 18.52

Iya. Ini cuma untuk Iframe buatan sendiri/manual.

Balas
Raka Aryanda Kode Jarwo
Raka Aryanda
# 9 April 2018 17.34

untuk fanspage fb gak work ya

Balas