RudihartoTahukah Anda bila sebuah domain bisa disetting menyerupai tampilan website lain dengan mudah? Ya, Anda bisa membuat sebuah iFrame HTML, untuk menyerupai tampilan website yang Anda inginkan.
Di Rumahweb, Anda bisa membuat file iFrame HTML melalui 2 cara yaitu dari halaman clientzone dan cPanel. Namun sebelum melanjutkan settingnya, kami akan menjelaskan kepada Anda terlebih dahulu apa itu iframe, agar Anda lebih memahami panduan yang kami buat.
Apa itu iframe?
iFrame adalah teknik html yang memungkinkan Anda untuk melakukan embed data website seperti text, gambar hingga video dalam sebuah halaman website.
Elemen iFrame berfungsi untuk mengambil konten dari sebuah sumber dan menampilkan datanya sesuai dengan url sumber yang digunakan. Meskipun demikian, fungsi iFrame tidak serta merta dapat Anda gunakan untuk menampilkan SSL/HTTPS yang telah disetting, karena itu tergantung pada settingan ijin forwarding server tujuannya. iFrame tidak hanya digunakan untuk membuat satu halaman layout website, namun juga bisa digunakan untuk mengisi bagian tertentu pada website.
Sebagai contoh, Anda ingin menampilkan lokasi usaha pada website. Solusinya, Anda bisa meng-copy lokasi usaha Anda di Google Maps melalui script iframe. Atau jika Anda ingin domain diakses menyerupai website lain, maka Anda bisa membuat script iframe html dengan memasukkan url website tujuan.
Lalu, bagaimana cara membuat script iframe HTML tersebut? Berikut kami sampaikan langkah-langkahnya.
Baca selengkapnya tentang iFrame pada artikel : Mengenal Apa Itu iFrame Beserta Contoh Script iFrame HTML
Membuat script iFrame HTML
Pada contoh berikut, kami ingin memberikan contoh script iFrame html untuk menyerupai sebuah tampilan website. Bagi Anda yang telah memiliki hosting, silahkan buat file dengan nama index.html pada directory domain anda.
cPanel
Jika Anda memesan layanan domain beserta shared hosting, cloud hosting atau WordPress hosting, pembuatan file iFrame bisa dilakukan melalui cPanel. Berikut panduannya:
- Login ke cPanel.
- Klik menu File manager > public_html.
- Setelah itu, klik tombol + File, lalu buatlah file dengan nama index.html.
Jika Anda ingin membuat iFrame untuk subdomain atau addon domain, sesuaikanlah dengan directory root masing-masing. Setelah itu, edit file index.html dan masukkan script iframe dibawah ini.
Plesk Panel
Jika Anda memesan layanan domain beserta WordPress hosting versi lama atau VPS dengan Plesk, pembuatan file iFrame bisa dilakukan melalui Plesk Panel. Berikut panduannya:
- Login ke Plesk Panel.
- Klik menu Files > htdocs.
- Setelah itu, klik tombol + File, lalu buatlah file dengan nama index.html.
Contoh Skrip iFrame HTML
Setelah itu, Anda bisa menggunakan contoh script berikut:
<html>
<head>
<title>Judul website</title>
<meta name="description" content="Deskripsi website" />
<meta name="keywords" content="keyword1, keyword2" />
</head>
<frameset border="0" rows="100%,*" cols="100%" frameborder="no">
<frame name="TopFrame" scrolling="yes" noresize src="https://alamat_web_tujuan">
<frame name="BottomFrame" scrolling="no" noresize>
<noframes></noframes>
</frameset>
</html>Ubah beberapa keterangan dibagian berikut:
- Judul website: Ubah sesuai judul website yang Anda inginkan
- Deskripsi website: Tulis deskirpsi singkat website Anda. Maksimal 160 karakter.
- keyword1, keyword2 : Isi kata kunci website Anda, setiap kata kunci pisah dengan tanda koma (,)
- alamat_web_tujuan : Ubah url ini dengan url tujuan redirect Anda
Jika sudah di edit, maka tampilan scriptnya seperti ini :
Setelah selesai, simpan kemudian akses website Anda. Berikut adalah contoh script yang kami gunakan untuk test:
Catatan:
Beberapa situs website seperti Facebook.com, wordpress.com dan instagram.com, URL-nya tidak selalu dapat di setting iframe, terutama untuk HTTPS. Ketika Anda setting iframe ke url facebook/instagram, hasilnya akan blank page seperti berikut:
www.instagram.com refused to connect.
Bagi Anda yang hanya melakukan pemesanan domain saja, Anda bisa menggunakan fitur masking dari Clientzone untuk menyerupakan tampilan domainnya seperti website tujuan. Panduan terkait setting masking iframe dari Clientzone bisa Anda pelajari melalui link: Setting Domain Forwarding
Demikian artikel kami tentang iframe html dan cara membuat skripnya. Apabila ada pertanyaan, silakan menghubungi support kami untuk dibantu pengecekannya.
