Tambahkan sedikit kode ini cukup sekali saja, maka video Youtube Anda akan tampil lebar penuh dan responsive secara otomatis tiap kali menambahkan postingan.
Untuk membuat video responsive atau menyesuaikan sesuai gadget, mungkin cukup menyibukkan dan tidak efisien apabila mesti menyertakan seperti style div atau class setiap kali Anda insert video ke dalam postingan WordPress Anda. Terutama bagi developer web WordPress yang ingin memudahkan client-nya dikala ingin embed video dari Youtube.
Cara Tambahkan Video Youtube dan Membuatnya Rata Tengah di WordPress
Om akan membagikan script yang cukup sekali saja Anda tambahkan ke tema Anda, tanpa perlu menyertakan berulangkali setiap menyertakan video.
Tambahkan script stylesheet berikut ke dalam file css tema Anda, bisa pada style.css utama tema Anda.
.embed-container
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
max-width: 100%;
height: auto;
.embed-container iframe,
.embed-container object,
.embed-container embed
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
Kemudian tambahkan script javascript berikut ke dalam file script website Anda.
jQuery(document).ready(function($)
var all_oembed_videos = $("iframe[src*='youtube']");
all_oembed_videos.each(function()
$(this).removeAttr('height').removeAttr('width').wrap( "" );
);
)
Atau jikalau gundah, cukup tambahkan semua scipt di bawah ini pada file functions.php tema Anda. Letaknya mampu Anda dapatkan di public_html → wp-content → themes → (tema aktif Anda) → functions.php.
function omwp_style_embed_youtube()
?>
add_action( 'wp_enqueue_scripts', 'omwp_style_embed_youtube');
function omwp_script_embed_youtube()
?>
add_action( 'wp_footer', 'omwp_script_embed_youtube' );
Cara Menambahkan Video Youtube
Setelah scipt tadi ditambahkan, untuk menyertakan video, Anda cukup menyalin atau copy link dari video Youtube dan paste ke dalam editor postingan Anda.
Silahkan cek artikel di halaman pengunjung (frontend). Seharusnya video tadi sudah mengisi lebar sarat sesuai lebar konten pos Anda, dengan tinggi yang menyesuaikan.
Selain itu video sebaiknya sudah responsive ketika diakses menggunakan handphone maupun table.