Responsive 'Youtube Embed Video' HTML Code and Html 5 Valid

In this article we will show you a tutorial about keywords related to :

1. Embed video html 
2. Html video youtube
3. Embed youtube autoplay
4. Youtube embed code

which are searched by many people.

As we all know, YouTube is a video platform that reaches many people around the world.

All types of videos with various topics can easily be found on YouTube.


For a Blogger like me who likes writing articles on blogs, sometimes I need a video as a complement to the article I'm discussing.

Therefore, I have to insert the youtube video that I need in the article that I will publish.

However, the video must be installed properly, in other words it must adjust to the layout of my blog.

So, I need an html code that can make youtube video becomes responsive when the blog is opened on a mobile device.

And for those of you who also need the Youtube embed code as me, I will share an embed video html code which will adjust to the layout of the blog or responsive and also valid html5.

Responsive and Html5 Valid Youtube Embed Code 

Here is the Html video youtube code and how to install it on blogs to be responsive and valid html5.

The first step: Open YouTube!

Then find the video that you want to embed in a blog post.

If you have found the video, click Share

and then select Embed.

Next, Copy the provided iframe code.

Youtube embed code will be:

<iframe width="560" height="315" src="https://www.youtube.com/embed/mzIsfSsZh7I" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

The next step is to delete a portion of the code above so the results will be like this:

<iframe src="https://www.youtube.com/embed/mzIsfSsZh7I"></iframe>

To make it responsive, we need to add the following code:

style="min-height: 315px; width: 90%;"

So the end result will be as below:

<iframe src=" https://www.youtube.com/embed/mzIsfSsZh7I " style="min-height: 315px; width: 90%;" ></iframe>

Adjust Width and min-height as needed.

The final step is to insert code that has been changed to be responsive to the blog post.

The steps, create a new post, click the HTML mode (not compose) then paste the changed Youtube embed video html code into the blog post (As shown in the picture).

In addition, you can also set the YouTube video to play automatically when visitors open the blog.

This is how you do it:

Embed Youtube Autoplay

Add the following code to the modified iframe code:

?rel=0&amp;autoplay=1

So the embed video html code becomes:

<iframe src=" https://www.youtube.com/embed/mzIsfSsZh7I?rel=0&amp;autoplay=1
 " style="min-height: 315px; width: 90%;" ></iframe>

Finally, install the code in the blog post!

Thanks to xkomo.com and blogtipsintrik.com for the reference

Teruskan Membaca

Download Template Blogger Terbaik Untuk Daftar Adsense Teruji 100%

Download Template Blogger Terbaik Untuk Daftar Adsense - Diterima oleh Adsense itu susah – susah gampang. Katanya ada yang dalam hitungan kurang dari sehari sudah mendapatkan persetujuan namun ada pula yang sudah berbulan – bulan menunggu tetapi tidak juga mendapatkan kepastian.

Logo Google Adsense

Dalam penolakan program Adsense, tidak pernah disebutkan secara jelas mengenai faktor apa saja yang membuat sebuah blog tidak disetujui.

Yang pasti, agar blog yang didaftarkan Adsense dapat diterima maka blog tersebut harus mematuhi pedoman kualitas webmaster.

Yang di antaranya adalah, artikel blog bukan dari hasil copas, konten unik hasil tulisan sendiri, kemudian hindari terlebih dahulu membuat link keluar atau ke artikel lain di blog kecuali relevan atau konten memiliki topik yang sama, fokus dulu ke konten.

Kurang lebih isinya seperti itu untuk dapat bergabung menjadi penayang iklan Google Adsense.

Bagi blogger pemula yang ingin bergabung dengan Adsense mungkin akan kebingungan ketika blog yang didaftarkan ditolak melulu oleh Google.

Biasanya alasan penolakan adalah masalah navigasi, konten yang tidak memadai, atau konten blog tidak sesuai dengan kebijakan Google.

Untuk masalah navigasi, solusinya adalah menghindari membuat internal linking yang tidak relevan di dalam artikel, kalo bisa jangan dulu ada link di dalam artikel, cukup perbanyak saja jumlah kata setiap konten yang dipublish.

Konten dengan jumlah kata yang banyak misal 500 – 600 – 700 kata sudah dianggap cukup baik.

Hal ini sekaligus memecahkan masalah konten tidak memadai apabila alasan penolakannya adalah hal tersebut.

Sedangkan, jika alasan penolakannya adalah konten yang tidak sesuai kebijakan Google kemungkinan terdapat artikel dengan topik yang memang tidak diperbolehkan yakni konten yang berbau negatif.

Selain faktor – faktor di atas, template yang digunakan juga dapat membantu supaya blog dapat disetujui.

Entah berpengaruh atau tidak, template blogger tertentu ternyata memudahkan blog diterima Adsense.

Contohnya saya sendiri diterima Adsense seusai mengganti template setelah sebelumnya selalu ditolak terus.

Spesifikasi blog saat daftar Adsense kurang lebih ada 18 artikel rata – rata 700 kata mix beberapa artikel 350 kata, tanpa internal link (karena sebelumnya ditolak dengan alasan banyak link yang tidak relevan di dalam blog), tanpa disclaimer, privasi policy, menu drop down yang belum disetting, dan umur blog kurang lebih 4 bulan.

Sedangkan untuk niche-nya campur - campur mulai dari seputar blogging, tutorial, anime, dan MotoGP.

Bagi kalian sobat blogger yang saat ini ingin daftar Adsense dan hendak mencari template blog yang “disukai” adsense, saya akan bagikan template yang saya gunakan yang sudah terbukti 100% dapat diterima.

Sebagai catatan, karena template yang saya bagikan ini kurang kuat masalah SEO-nya di mesin pencari, sebaiknya langsung ganti ke template lain ketika telah berhasil diterima oleh Adsense.

Langsung saja, berikut templatenya :

Download template blogger untuk daftar Adsense.

Sebagai catatan, template di atas hanya sebagai pendukung saja yang sudah saya coba dan hasilnya diterima, jika hasilnya ditolak, mungkin ada bagian yang masih perlu diperbaiki di dalam blog kalian terutama masalah konten.

Teruskan Membaca

Cara Submit Sitemap Blogger ke Webmaster Versi Baru

Artikel yang saya sajikan kali ini akan membahas tentang bagaimana cara submit sitemap blogger ke Webmaster baru.

Submit sitemap ke webmaster baru ini memerlukan 2 langkah :

1. Setting Sitemap di Setelan Blogger
2. Submit Sitemap ke Webmaster 

Google Search Console atau yang lebih dikenal dengan sebutan webmaster tool saat ini telah diperbaharui oleh Google ke versi baru.

Google sudah mendesain ulang webmaster sedemikian rupa sehingga dari segi tampilannya pun tampak jauh berbeda dengan webmaster lama.

Bagi kamu yang baru pertama kali membuka atau menggunakan Google Search Console akan langsung diarahkan ke Webmaster versi baru berbeda dengan yang sudah lama menggunakan Webmaster dapat memilih untuk memakai webmaster lama atau migrasi ke Webmaster baru.

Submit sitemap blog ke webmaster baru caranya sedikit jauh berbeda dan membingungkan.

Sama halnya saat saya ingin membuka Search Console baru untuk submit sitemap / peta situs blog baru saya, saya sedikit kebingungan sebab sudah coba submit peta situs dengan cara sama persis seperti di webmaster versi lama selalu saja gagal.

Selalu keluar peringatan untuk memasukkan sitemap terlebih dahulu ke setelan robot.txt di settingan blogspot / blogger.

Jika pada webmaster lama, untuk menambahkan sitemap bisa dilakukan dengan memilih salah satu diantara macam – macam sitemap berikut :

sitemap.xml

atom.xml?redirect=false&start-index=1&max-results=500

feeds/posts/default

Akan tetapi jika langsung memasukkan sitemap dengan format di atas ke webmaster baru hasilnya selalu gagal dan statusnya eror.

Menambahkan sitemap blog ke webmaster sendiri merupakan hal yang penting yang perlu dilakukan oleh pemilik blog baru.

Sebab, dengan mendaftarkan peta situs (sitemap) ke Webmaster, Google akan lebih mudah mengindeks setiap postingan baru yang diterbitkan di blog.

Sehingga nantinya postingan baru tersebut akan lebih cepat terindeks oleh mesin pencari Google.

Itu artinya, orang – orang yang menggunakan mesin pencari google, bisa menemukan artikel yang telah kita buat.

Lalu, bagaimana caranya menambahkan sitemap ke webmaster tool baru? Simak terus artikel ini!

Oh ya, kamu juga bisa melakukannya lewat ponsel melalui Google Chrome Browser.

Setting Sitemap di Setelan Blogger

Sebelum menambahkan peta situs ke webmaster, kita perlu terlebih dahulu memasukkan sitemap di setelan robot.txt khusus pada setelan blogspot/blogger.

Caranya :

Pertama, Masuk ke Dashboard Blogger > Masuk ke Setelan / Settingan > Pilih Preferensi Penelusuran.

Kedua, Aktifkan opsi Robot.txt khusus

Ketiga, Copy/paste kode berikut :

User-agent: *
Disallow:

Sitemap: https://www.alamatblog/sitemap.xml
Sitemap: https://www.alamatblog/atom.xml?redirect=false&start-index=1&max-results=500
Sitemap: https://www.alamatblog/feeds/posts/default
Sitemap: https://www.alamatblog/sitemap-pages.xml

*ganti alamatblog dengan alamat blog kamu.

Setelan robot.txt di atas adalah setelan robot.txt yang maksudnya mengizinkan bot google merayapi halaman - halaman search seperti breadcrumb, menu,  widget label, yang saya dapatkan dari KompiAjaib.

Tapi sebelumnya, tambahkan kode berikut di bawah <head> di dalam template (dan hapus widget arsip di tata letak jika kamu memasang widget arsip) :

<b:if cond='data:view.isArchive'>
<meta content='noindex,noarchive' name='robots'/>
</b:if>

Terakhir, klik simpan perubahan.

Atau kamu juga bisa menggunakan robot.txt standar berikut :


User-agent: Mediapartners-Google
Disallow:

User-agent: *
Disallow: /search
Allow: /

Sitemap: https://www.alamatblog/sitemap.xml


*kamu bisa memilih mengganti https://www.alamatblog/sitemap.xml dengan sitemap yang lain seperti :

https://www.alamatblog/atom.xml?redirect=false&start-index=1&max-results=500

https://www.alamatblog/feeds/posts/default

Atau kamu juga dapat memasukkan semuanya.

*ganti alamatblog dengan alamat blog kamu.

Jika menggunakan robot.txt standar, kamu tidak perlu menambahkan kode tertentu di template blogger.

Setelah selesai menyetel robot.txt khusus, sekarang saatnya menambahkan sitemap ke Webmaster.

Submit Sitemap ke Webmaster 

Pertama, buka webmaster > Klik Sitemap / Peta situs

Kedua, pada kolom Tambahkan peta situs baru, copy/paste sitemap berikut :

*ganti alamatblog dengan alamat blog kamu

https://www.alamatblog/sitemap.xml

https://www.alamatblog/atom.xml?redirect=false&start-index=1&max-results=500

https://www.alamatblog/feeds/posts/default
Sitemap: https://www alamatblog/sitemap-pages.xml

Jika kamu menggunakan setelan robot.txt pertama, kamu bisa memilih menambahkan satu peta situs atau menggunakan semuanya.

Jika memakai setelan robot.txt standar, masukkan sitemap sesuai dengan yang digunakan di robot.txt di blogger.

Terakhir, klik Kirim.

Selesai!

Teruskan Membaca