Apakah Anda ingin menambahkan batas iframe di sekitar penyematan video Anda? Baru-baru ini pengguna meminta kami cara menambahkan bingkai di sekitar video mereka di WordPress. Karena Anda dapat menggunakan kedua iframe dan oEmbed untuk menambahkan video di WordPress, kami akan menunjukkan cara menambahkan batas iframe di sekitar embed video serta cara menambahkan batas di sekitar video oEmbed di WordPress.
Menambahkan Border Around iframe Videos di WordPress
Hal pertama yang perlu Anda lakukan adalah membuka posting atau halaman berisi kode embed video iframe Anda. Kode embed iframe yang khas seharusnya terlihat seperti ini:
Anda bisa menambahkan border disekitarnya dengan menambahkan style sebaris ke kode seperti ini:
Cukup ganti lebar border dan warnanya, dan sudah selesai.
Sementara menambahkan perbatasan iframe bekerja, sebenarnya ada cara yang lebih baik untuk menambahkan batas di sekitar video di WordPress. Itu dengan menggunakan oEmbed.
Menambahkan Border Around oEmbed Videos di WordPress
WordPress dilengkapi dengan dukungan built-in oEmbed. Pada dasarnya WordPress memungkinkan Anda menempelkan tautan video, dan secara otomatis akan mendapatkan kode sematan untuk mereka. Sekarang ini hanya berfungsi untuk situs yang mengaktifkan omembed seperti YouTube, Vimeo, DailyMotion, Hulu, dll. (Lihat: bagaimana menambahkan video di WordPress dengan mudah menggunakan oEmbed)
Sekarang setelah Anda tahu cara menambahkan video dengan oEmbed, berikut adalah cara menambahkan border di sekitar video oEmbed di WordPress.
Saat menambahkan video menggunakan oEmbed, cukup bungkus URL di tag rentang dengan parameter gaya sebaris, seperti ini:
https://www.youtube.com/watch?v=qzOOy1tWBCg
Jika Anda ingin menambahkan batas yang sama di sekitar semua video iframe, sebaiknya tambahkan kelas CSS ke stylesheet tema Anda.
.batas bingkai {
batas: 3px solid #EEE;
}
Sekarang Anda bisa menggunakan kelas CSS dalam kode embed iframe Anda seperti ini:
Anda juga dapat menggunakan kelas CSS yang sama di tag rentang di sekitar URL video oEmbed Anda, seperti ini:
https://www.youtube.com/watch?v=qzOOy1tWBCg
Manfaat menggunakan kelas CSS tunggal adalah jika Anda mengubah tema nanti, Anda dapat dengan mudah mengubah warna dengan satu klik vs mundur dan mengedit setiap video secara terpisah.
Kami harap artikel ini membantu Anda menambahkan batas iframe di sekitar video yang disematkan di WordPress. Anda mungkin juga ingin melihat 9 tip YouTube yang bermanfaat ini untuk membumbui situs WordPress Anda dengan video.