Skip to main content

Mengakali Pemasangan Iframe Agar Valid HTML5

Sudah lama diketahui bahwa iframe tidak valid html5. Penyebabnya adalah atribut yang terdapat pada iframe seperti atribut untuk scroll, frame border, full screen, dan lainnya. Widget yang biasa menggunakan iframe ini biasanya untuk video player atau untuk iklan. Tentunya hal ini membuat dilema bagi Blogger ketika akan memasangkan video atau iklan di blog. Sementara jika kita memasang iklan dengan menggunakan script js maka otomatis akan terdetek blocking-render js di pagespeed insights.

Contoh iframe dengan beberapa atribut yang error pada validasi html5 seperti berikut ini.


<iframe src="http://blablabla.com/banner.php?section=General&amp;ga=g" frameborder="0" scrolling="no" width="300" height="250" marginwidth="0" marginheight="0"></iframe>

Dan error pada validasi html5 untuk iframe di atas seperti di bawah ini.

Dari 1 buah iframe saja sudah menyumbangkan 4 buah error, sudah dapat dihitung error yang akan muncul jika kita memasang banyak iframe (video atau iklan).

Nah kini saya akan share sebuah trik untuk mengakali pemasangan iframe agar tidak menyebabkan error pada validasi html5.

Triknya adalah pemasangannya menggunakan javascript document.write, dengan begitu iframenya tidak akan terdetek sehingga tidak akan error pada validasi html5.

Silahkan gunakan javascript di bawah ini untuk memasang iframe di blog


<script type="text/javascript">
//<![CDATA[
document.write('iframe di sini');
//]]>
</script>

Sehingga penampakannya dengan iframe menjadi seperti di bawah ini


<script type="text/javascript">
//<![CDATA[
document.write('<iframe src="http://blablabla.com/banner.php?section=General&amp;ga=g" frameborder="0" scrolling="no" width="300" height="250" marginwidth="0" marginheight="0"></iframe>');
//]]>
</script>

Mudah bukan? Sekarang coba cek halaman blog Anda untuk memastikan bahwa error validasi html5 dari iframe-nya sudah hilang. Dengan ini kita bebas memasang iklan tanpa error validasi html5 dan tidak akan terdetek blocking render js karena tidak menggunakan script js.

Untuk memasang iframe video Youtube (responsive) dengan javascript seperti ini silahkan simak di sini.

Berbagi itu peduli:

Comment Policy:

Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui. Untuk komentar out of topics silahkan masuk ke Forum Kompi Ajaib
Buka Komentar
Buka Komentar
Jangan Diklik!

Menarik Untuk Dibaca Juga:

PrivacySitemap
©2021 KOMPI AJAIB