Adakah cara untuk menyisipkan situs lain secara aktual ke web/blog? Jika itu yang menjadi pertanyaan anda sekarang maka penggunaan tag <iframe> bisa menjadi salah satu jawaban dari beberapa solusi yang ada. Hasil dari penggunaan tag <iframe> ibarat seperti anda menonton televisi dalam televisi.
Tag <iframe> biasanya berisi dokumen HTML, contoh simpelnya seperti di bawah ini:
[html collapse="false"]
<iframe src="http://www.wikipedia.com" style="width: 100%; height: 300px"></iframe>
[/html]
Hasilnya akan seperti ini:
Membuat external link yang akan dimuat pada area <iframe>
Sekarang saatnya coba menambahkan link yang mana apabila di klik akan dimuat (dibuka) pada area <iframe>. Contoh codenya seperti di bawah ini:
[html collapse="false"]
<div><a href="http://www.lexus.com" target="internal">Lexus</a> | <a href="http://www.tokobagus.com" target="internal">Toko Bagus</a> | <a href="http://www.lapan.go.id" target="internal">NASA Indonesia</a> | <a href="http://www.msn.com" target="internal">MSN</a> | <a href="http://www.ebay.com" target="internal">eBay</a> | <a href="http://www.wordpress.com" target="internal">Wordpress</a></div>
<iframe src="http://www.tokobagus.com" style="width: 100%; height: 300px" name="internal"></iframe>
[/html]
Hasilnya akan seperti ini:
Menyisipkan atribut "name" pada tag <iframe> dan memakai atribut "target" = "internal" pada tag <a> maka halaman yang diklik akan di load (dimuat) pada area <iframe>
Menghilangkan Garis batas tepi <iframe>
Kebanyakan orang tertarik untuk menghilangkan garis batas tepi <iframe> agar tidak terlalu kelihatan pemakaian <iframe> pada dokumen html mereka. Hal ini bisa dilakukan dengan menambahkan beberapa atribut HTML seperi di bawah ini:
[html collapse="false"]
<iframe src="http://www.tokobagus.com" style="width: 100%; height: 500px" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0"></iframe>
[/html]
Maka hasilnya akan seperti ini:
Jika anda ingin menghilangkan scrollbar pastikan tinggi dari <iframe> harus mencakup semua halaman web untuk menghindari terpotongnya objek halaman dalam <iframe>
wah mantap neeh postinganya sangat membantu blog Vista 84 yang masih baru, mkasih udah share :-)
BalasHapusSaya pernah coba pake iframe, tapi beberapa browser masih belom support ya mas? Thanx infonya.. (https://mutiarar06.student.ipb.ac.id)
BalasHapuspak, saya kemarin coba pakai tag iframe untuk menampilkan page dari web lain di blog saya, tapi kog malah ter-redirect ke page lain itu ya? padahal ketika saya coba menampilkan page lainnya bisa. Bagaimana untuk menghindari redirect itu? mohon dijawab, thanks, saya akan balik lagi :-)
BalasHapusBeberapa web developer sepertinya menggunakan kode fungsi Javascript khusus dengan tujuan menghindari seseorang untuk mengcover situsnya dalam iframe. Jadi ketika halaman mereka dimuat dalam iframe, secara otomatis akan diredirect ke url aslinya.
BalasHapusJika saya sudah menemukan solusi ini, akan saya tulis pada postingan saya selanjutnya. Mohon maaf jika email balasan saya ini kurang memuaskan atas pertanyaan yang bpk/ibu ajukan.
belum ngerti saya
BalasHapusMantap abis infonya.... Makasih bgt bisa belajar banyak dari mas Linggih...
BalasHapusTerima kasih artikelnya, lagi cari2 info cara bikin iframe ketemu langsung yg pas hehehe...
BalasHapus