Menggunakan iframe dalam menyertakan Document di web

iFrame adalah frame di dalam frame, dan dikenal sebagai komponen elemen HTML yang memungkinkan Anda untuk embed dokumen, video, dan media interaktif di suatu laman. Jika mengaktifkan iFrame, maka Anda akan menampilkan webpage sekunder di beranda utama.

Seperti yang telah dijelaskan pada paragraf awal, elemen iFrame berfungsi untuk menambahkan atau menyertakan konten dari source (sumber) yang lain. Elemen ini akan mengintegrasikan konten ke area mana saja yang ada di halaman tanpa harus menyertakannya di struktur layout website, seperti elemen tradisional pada umumnya.

Sesuatu yang berlebihan terkadang juga tidak baik. Sama halnya ketika Anda menggunakan iFrame terlalu sering. Penggunaan yang berlebihan akan membuat waktu loading situs semakin lama dan juga membuat web Anda rentan terhadap risiko keamanan online. Hal ini dikarenakan dengan iFrame, Anda pastinya menggunakan konten dari berbagai sumber, termasuk website yang keamanannya tidak terjamin. iFrame memang menjadi bagian dari konten, tapi bukan bagian dari website. Sebagai contoh, jika ingin menambahkan video dari YouTube, maka Anda harus memasukkan elemen iFrame ke postingan.

Cara Menggunakan iFrame 

Sampai di sini Anda sudah tahu kalau iFrame adalah elemen tambahan yang berfungsi untuk sharing konten dari situs atau sumber lain. Elemen ini mempertegas topik tertentu yang ingin Anda sampaikan ke pembaca. Untuk memasukkan elemen iFrame ke dokumen HTML, gunakan tag <iframe>. Copy kode di bawah ini dan paste ke notepad, lalu simpan file dalam format .html:

<iframe src="https://www.youtube.com/embed/dXBohfjc4WA" width="680" height="480" allowfullscreen></iframe>

Catatan: link embed-nya bisa diganti dengan link video apa saja yang Anda inginkan

Kode yang kami contohkan di atas akan menampilkan video tutorial Youtube yang dibuat oleh Hostinger. Kami akan menjelaskan secara singkat setiap tag yang ada di kode tersebut:

• Tag <iframe>…</iframe> digunakan untuk menyertakan video ke dalam iFrame.
• Source iFrame (src) mengacu pada link asal konten yang datang baik dari server eksternal ataupun internal. Jangan sampai lupa untuk memasukkan kode yang di-embed ke URL.
• Width dan height merupakan rasio aspek iFrame. Ada dua tipe rasio yang dapat digunakan, yakni ukuran yang sudah fix, misalnya 680×480 piksel (px), dan berbasis persentase (10%-100%) untuk mengatur iFrame secara otomatis.