Cara Menambahkan Latar Belakang Video ke Situs WordPress

Mencari cara termudah untuk menambahkan latar belakang video WordPress?

Latar belakang video yang dibuat dengan baik menarik perhatian dan membuat merek terlihat keren sejak awal. Namun bila dilakukan dengan buruk, latar belakang video memperlambat situs Anda, menghabiskan ruang, dan membingungkan pengunjung baru. Itulah mengapa kami membuat panduan ini sehingga Anda dapat menghindari semua jebakan, dan sebagai gantinya, pelajari cara menambahkan latar belakang video WordPress dengan cara yang benar.

Teruslah membaca untuk mempelajari tentang praktik terbaik dan langkah-langkah untuk menambahkan latar belakang video ke situs web WordPress Anda, semuanya tanpa pengetahuan teknis khusus.

Praktik terbaik untuk menambahkan latar belakang video WordPress

• Pertahankan ukuran file tetap rendah tetapi resolusi tinggi: Tidak ada yang lebih menghambat kinerja situs Anda selain video dan gambar berukuran besar; namun, lebih baik mempertahankan resolusi selama kompresi.
• Jangan berlebihan: Terlalu banyak video mengacaukan antarmuka Anda; hanya menggunakannya untuk membuat poin atau menunjukkan sesuatu yang relevan.
• Sertakan ajakan bertindak dengan informasi tambahan: Jangan biarkan pemirsa menginginkan lebih, lalu lupakan tautan yang mengarah ke detail lebih lanjut.
• Hindari audio di semua biaya: Ini menggelegar ketika semua orang hanya ingin melihat situs web Anda.
• Jika audio diperlukan, jangan putar otomatis: Berikan opsi bagi pengguna untuk memutar audio.
• Pertimbangkan teks tertutup untuk video dengan audio: Tidak semua orang dapat mendengarkan audio Anda, baik itu karena lokasi mereka atau gangguan pendengaran.
• Host secara eksternal: Host situs Anda mungkin tidak dirancang untuk menayangkan video, jadi pilih situs seperti Vimeo dan YouTube untuk mempertahankan kinerja, atau pertimbangkan situs hosting video khusus.
• Tetap berpegang pada format/resolusi terbaik: Kami hanya membicarakan MP4; minimal 720p; kodek h264.

Dan ingat, tidak semua situs web membutuhkan video; terkadang itu hanya membuat antarmuka berantakan, lambat, dan tidak fokus. Seorang pengacara, misalnya, harus tetap berpegang pada foto profesional daripada video jabat tangan klise yang pasti akan memperlambat situs web mereka.

Bagaimana cara menambahkan latar belakang video WordPress

Ada beberapa metode yang mengaktifkan fitur latar belakang video di dalam WordPress.

Kami akan fokus pada empat solusi bebas kode yang berbeda:

1. Blok Penutup bawaan
2. Plugin latar belakang/tajuk
3. Plugin pembuat halaman favorit Anda
4. Menggunakan tema yang mendukung latar belakang atau header video

Ikuti langkah-langkah untuk setiap metode di bawah ini.

Opsi 1: Blok Penutup bawaan

Editor WordPress asli menawarkan apa yang disebut blok Sampul untuk menyisipkan gambar latar belakang di belakang konten lain, seperti teks dan tombol.

Apa yang tidak disadari oleh banyak pengguna WordPress adalah bahwa blok Cover juga mendukung latar belakang video.

Langkah 1: Tambahkan blok Cover

Untuk memulai, buka halaman mana pun yang ingin Anda tambahkan latar belakang dan tambahkan blok Sampul .

Langkah 2: Unggah video Anda

Untuk Sampul , pilih tombol Unggah atau Pustaka Media , mana saja yang ingin Anda gunakan untuk menambahkan video.

Blok Sampul tidak mengatakan apa-apa tentang mendukung video, jadi Anda hanya perlu memastikan untuk memilih video (seperti MP4) dari Perpustakaan Media . Klik tombol Pilih setelah Anda memiliki video yang dicentang.

Langkah 3: Masukkan konten latar depan overlay

Anda sekarang akan melihat pratinjau video latar belakang. Anda dipersilakan untuk menambahkan blok latar depan ke Cover , seperti teks atau tombol.

Langkah 4: Edit pengaturan Sampul sesuai kebutuhan

Pengaturan sampul meliputi:

• Hamparan warna: ideal untuk memudahkan membaca teks
• Opacity: juga membantu untuk mengungkapkan konten latar depan
• Tinggi sampul minimum: terkadang diperlukan untuk membuat latar belakang video WordPress menutupi lebih banyak ruang

Langkah 5: Lihat latar belakang video WordPress Anda beraksi

Setelah selesai, simpan halaman, dan buka frontend untuk melihat latar belakang video WordPress Anda!

Cukup banyak plugin yang tersedia untuk menambahkan latar belakang video WordPress, beberapa di antaranya menawarkan latar belakang situs lengkap, sementara yang lain menyediakan header video untuk Anda.

Ini adalah plugin latar belakang video terbaik:

️ Favorit kami adalah plugin Advanced WordPress Backgrounds; kami akan menunjukkan cara menambahkan latar belakang video WordPress dengan plugin itu hanya dalam beberapa langkah.

Langkah 1: Instal AWB dan tambahkan blok kontennya

Untuk memulai, instal Advanced WordPress Backgrounds (AWB).

Buka halaman tempat Anda ingin menambahkan video latar belakang.

Menggunakan editor WordPress, klik untuk menambahkan blok konten. Cari dan pilih blok Background (AWB) .

Langkah 2: Tambahkan video Anda

Ini memberi Anda opsi untuk menambahkan warna, gambar, atau latar belakang video ke elemen.

Pilih Video , lalu tempel di URL Video dari YouTube atau Vimeo. Sebagai alternatif, plugin memiliki tab Self Hosted untuk mengunggah video lokal.

Langkah 3: Perluas tinggi dan lebar latar belakang video

Secara default, blok konten tidak meregang untuk menutupi sebagian besar area halaman. Anda harus mengklik tombol Tinggi Penuh di editor. Ada juga tombol untuk memperluas latar belakang video ke lebar penuh.

Anda juga dapat menyeret atau menyisipkan konten, seperti teks, tombol, atau gambar, di atas video latar belakang.

Langkah 4: Ubah pengaturan latar belakang video WordPress

Sesuaikan pengaturan mana pun yang Anda inginkan di tab Blokir : waktu mulai, waktu berakhir, pengulangan, selalu putar, opasitas video.

Adalah bijaksana untuk menambahkan overlay warna latar belakang dengan penurunan opacity; ini membuat teks overlay lebih mudah dibaca.

Lakukan ini dengan masuk ke tab Block dan ubah warnanya menjadi putih atau hitam di bawah Background Color . Pindahkan penggeser Opacity ke bawah sedikit untuk memastikan latar belakang masih terlihat.

Langkah 5: Lihat hasilnya

Hasilnya adalah video yang diputar di depan konten lain, idealnya video yang berulang, tidak memiliki suara, dan masih mempertahankan sebagian besar fokus pada konten latar depan.

Opsi 3: Plugin pembuat halaman favorit Anda

Sebagian besar pembuat halaman, seperti Elementor, WPBakery, dan Divi, menawarkan fitur latar belakang untuk menambahkan gambar atau latar belakang video ke hampir semua modul konten.

️ Jangan ragu untuk memilih pembuat halaman yang Anda sukai, tetapi kami merekomendasikan Elementor karena kemudahan penggunaannya.

Pastikan untuk menginstal Elementor atau pembangun mana pun yang ingin Anda gunakan sebelum memulai.

Langkah 1: Buka halaman dengan editor Elementor

Buka Halaman di WordPress, dan pilih halaman yang ditetapkan sebagai Beranda Anda . Klik tombol Edit Dengan Elementor .

Langkah 2: Tambahkan blok konten Bagian

Sebagian besar modul konten di Elementor menawarkan pengaturan latar belakang, tetapi kami menyarankan untuk memasukkan Bagian. Dengan begitu, Anda dapat menambahkan beberapa item ke dalam bagian, seperti teks, gambar, dan tombol. Kemudian, Anda menambahkan latar belakang video ke bagian tersebut sehingga berada di belakang semua yang ada di latar depan.

Kami menambahkan beberapa teks dan tombol ke bagian dalam tutorial kami. Lanjutkan dan pilih ikon Edit Bagian , lalu pilih tab Gaya .

Langkah 3: Masukkan latar belakang video Anda

Di sini, Anda akan melihat area dropdown Background . Pilih opsi Video di sebelah Jenis Latar Belakang . Kemudian rekatkan URL dari YouTube, Vimeo, atau file lokal di bidang Tautan Video .

Langkah 4: Edit pengaturan latar belakang video

Anda mungkin perlu memperluas latar belakang video untuk mengambil lebih banyak layar. Untuk melakukannya, alihkan ke tab Layout , dan sesuaikan Height dan Minimum Height .

Kembali di bawah tab Gaya , pertimbangkan untuk mengubah pengaturan untuk video latar belakang:

• Waktu mulai
• Akhir waktu
• Mainkan sekali
• Mainkan di ponsel
• Mode privasi

Selanjutnya, pikirkan tentang menambahkan Background Overlay —biasanya warna netral seperti hitam atau putih, dan beberapa perubahan opacity—untuk membuat teks, tombol, dan gambar di latar depan lebih terlihat.

Langkah 5: Lihat latar belakang video WordPress di frontend

Setelah selesai, video diputar di belakang semua konten di bagian!

Opsi 4: Gunakan tema WordPress yang mendukung latar belakang/tajuk video

Berbagai tema WordPress menawarkan pengaturan header, slider, dan media satu halaman penuh; ini memungkinkan Anda mengunggah gambar, GIF, atau video untuk memenuhi seluruh layar, paling sering digunakan sebagai header ke beranda Anda.

Untuk menemukan tema dengan fitur latar belakang video, cari "latar belakang video" di pasar populer:

️ Pastikan untuk memindai daftar fitur, atau bahkan meminta pengembang sebelum mengunduh/membeli, untuk memastikan tema memiliki fungsionalitas latar belakang video.

Sebagai contoh, tema WP Colibri menawarkan latar belakang video.

Langkah 1: Instal dan aktifkan tema

Untuk mengaktifkan latar belakang video, instal tema WP Colibri, lalu buka Appearance > Colibri Settings > Get Started . Di sini, Anda dapat mengaktifkan fitur Colibri Page Builder.

Langkah 2: Tambahkan situs demo

Klik pada tab Situs Demo dan Impor template demo yang Anda pilih.

Langkah 3: Sesuaikan gambar Pahlawan

Arahkan ke Appearance > Customize , dan pilih ikon roda gigi Pengaturan di sebelah modul Hero .

Langkah 4: Tambahkan latar belakang video

Pilih tab Style , dan alihkan Background ke Video .

Terakhir, pilih YouTube untuk ditempel di URL Video Eksternal atau Dihosting Sendiri untuk mengunggah video lokal.

Hasilnya, Anda akan melihat latar belakang video bergerak di pratinjau Customizer.

Mulailah dengan latar belakang video yang sempurna

Dalam posting ini, Anda mempelajari empat metode berbeda, setidaknya satu di antaranya harus sesuai untuk situasi Anda.

️ Untuk beberapa cara lain untuk meningkatkan situs Anda, lihat posting kami dengan 10 elemen desain beranda yang sukses.

Untuk pertanyaan apa pun tentang latar belakang video WordPress, bagikan pemikiran Anda di komentar di bawah.