Memasang embed (sematan) video YouTube ke blog

Berikut ini adalah cara memasang embed (sematan) video YouTube ke blog. Kamu bisa mengikuti langkah-langkah berikut ini, tergantung pada platform blog yang kamu gunakan (misalnya Blogspot/Blogger, WordPress, atau lainnya). Di bawah ini contoh cara umum untuk melakukannya:

✅ Langkah-langkah Menyematkan (Embed) Video YouTube ke Blog:

1. Buka Video YouTube yang Ingin Disematkan

• Buka YouTube, cari video yang ingin kamu pasang di blog.

• Klik tombol "Bagikan" (Share) di bawah video.

• Pilih opsi "Sematkan" (Embed).

• YouTube akan menampilkan kode HTML iframe seperti ini:

<iframe width="560" height="315" src="https://www.youtube.com/embed/ID_VIDEO" frameborder="0" allowfullscreen></iframe>

⚠️ Gantilah ID_VIDEO dengan ID video YouTube yang kamu pilih.

2. Salin Kode HTML-nya

• Klik tombol "Salin" atau copy secara manual kode tersebut.

3. Tempelkan Kode ke Blog Kamu

👉 Untuk Blogspot/Blogger:

1. Masuk ke dashboard Blogger kamu.

2. Pilih "Postingan Baru" atau edit postingan yang sudah ada.

3. Klik tab "HTML" di editor post (bukan “Compose”).

4. Tempelkan kode iframe yang sudah disalin ke posisi yang kamu inginkan.

5. Kembali ke tab “Compose” jika ingin melihat hasilnya dalam bentuk visual.

6. Klik "Publikasikan" untuk menyimpan.

👉 Untuk WordPress (Classic Editor):

1. Buka halaman edit post atau page.

2. Pindah ke tab "Text" (bukan “Visual”).

3. Tempelkan kode embed iframe.

4. Klik "Perbarui" atau "Terbitkan".

👉 Untuk WordPress (Block Editor / Gutenberg):

1. Tambahkan blok baru.

2. Pilih blok "Custom HTML".

3. Tempelkan kode iframe.

4. Kamu juga bisa langsung pakai blok "Embed → YouTube" dan cukup tempelkan URL video-nya saja, maka akan otomatis ter-embed.

🎨 Tips Tambahan

• Atur Ukuran: Kamu bisa ubah nilai width dan height di kode iframe agar sesuai dengan layout blog kamu.

• Responsif: Supaya videonya otomatis menyesuaikan ukuran layar (responsive), gunakan CSS atau plugin tambahan.

• Autoplay (opsional): Tambahkan ?autoplay=1 di akhir URL video, contoh:

src="https://www.youtube.com/embed/ID_VIDEO?autoplay=1"

Jika kamu memakai platform blog apa seperti Blogger, maka cara memasukan video YouTube Shorts tersebut ke Blogger  perlu dikonversi ke embed link biasa.

🔍 Langkah-langkah

1. Dapatkan ID video YouTube Shorts-nya
   Dari link https://youtube.com/shorts/uDg9zZO9h9I?..., ID videonya adalah uDg9zZO9h9I.

2. Buat link embed YouTube biasa
   Format embed YouTube adalah:

   <iframe width="560" height="315"
     src="https://www.youtube.com/embed/ID_VIDEO"
     frameborder="0" allowfullscreen>
   </iframe>
   

   Ganti ID_VIDEO dengan uDg9zZO9h9I. Jadi menjadi:

   <iframe width="560" height="315"
     src="https://www.youtube.com/embed/uDg9zZO9h9I"
     frameborder="0" allowfullscreen>
   </iframe>
   

3. Masukkan kode embed ke Blogger

   Kalau kamu pakai Blogger (Blogspot):

   • Login ke dashboard Blogger → pilih blog kamu.

   • Pilih Post baru (atau edit postingan yang sudah ada).

   • Di editor, pilih tab HTML (bukan Compose atau Penampil Visual).

   • Tempelkan kode iframe tadi di tempat yang kamu mau dalam konten postingan.

   • Jika mau lihat pratinjau, bisa pindah ke tab “Compose” atau “Penampil Visual” untuk melihat tampilannya.

   • Kalau sudah sesuai, klik Publikasikan.

4. Opsional: Buat video agar responsif

   Kadang tampilan iframe kalau tetap pakai ukuran tetap (width dan height statis) tidak responsif di perangkat mobile. Kamu bisa pakai CSS sedikit agar video mengikuti lebar kontainer secara otomatis. Contoh CSS-nya:

   <div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
     <iframe src="https://www.youtube.com/embed/uDg9zZO9h9I" 
             style="position: absolute; top:0; left: 0; width: 100%; height: 100%;"
             frameborder="0" allowfullscreen>
     </iframe>
   </div>
   

   Ini akan membuat video menyesuaikan lebar layar (responsive).

Berikut ini adalah kode HTML siap pakai untuk menyematkan video Shorts https://youtube.com/shorts/uDg9zZO9h9I ke Blogger (dengan tampilan responsive, cocok untuk HP & desktop):

✅ Kode Embed Responsive untuk Blogger:

<!-- Embed Video YouTube Shorts Responsive -->
<div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto;">
  <iframe src="https://www.youtube.com/embed/uDg9zZO9h9I"
          style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
          frameborder="0"
          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
          allowfullscreen>
  </iframe>
</div>

💡 Cara Pasangnya di Blogger:

1. Login ke Blogger.com

2. Klik "Postingan Baru" (atau edit postingan lama)

3. Di editor post, klik tab HTML (bukan Compose)

4. Tempelkan kode HTML di atas di posisi yang kamu inginkan

5. Klik Publikasikan (atau “Perbarui” kalau mengedit)

6. Selesai! 🎉

Kalau kamu ingin menambahkan beberapa video Shorts lainnya dalam satu postingan, kamu tinggal ganti ID video (uDg9zZO9h9I) di bagian URL berikut:

https://www.youtube.com/embed/ID_VIDEO

Contoh:

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

Selamat mencoba ya!