Salah satu halaman arahan eksklusif yang banyak disediakan untuk pelanggan mereka selama periode Cyber ​​​​Monday, adalah halaman arahan rilis perangkat lunak yang luar biasa. Tata letak ini menampilkan ilustrasi yang bagus dan penggunaan pemisah bagian yang unik yang akan memukau pembaca. pengunjung.

cyber monday.jpg

Cara mendapatkan halaman pendaratan rilis perangkat lunak eksklusif untuk Cyber ​​Monday

Sebelum Anda mulai menggunakan ini, Anda harus membiasakan diri dengan halaman arahan Cyber ​​Monday eksklusif yang bisa Anda peroleh dengan menjadi anggota Tema Elegan baru, meningkatkan akun yang ada, atau sudah menjadi anggota seumur hidup. bersama kami. Jika Anda sudah menjadi anggota seumur hidup, Anda dapat masuk ke area anggota kami dan mengunduh semua halaman eksklusif kami di sini. Semua pengguna lain perlu menggunakan tombol di bawah ini untuk membeli atau meningkatkan sebelum mereka dapat menyelesaikan sisa tutorial kami.

Sudah menjadi anggota seumur hidup? Anda dapat mengunduh paketnya sekarang, tidak perlu berpartisipasi dalam penawaran Cyber ​​Monday!

Cara membuat video demo kontekstual di Divi

Setelah mengunduh laman landas versi perangkat lunak baru dari area anggota kami, Anda dapat terus membaca yang berikut ini.

Dalam kasus penggunaan tutorial ini, kami akan menunjukkan cara membuat demo video dengan mengklik tombol. Video yang muncul saat diklik akan terlihat bagus di desktop dan layar kecil. Ini adalah pendekatan yang bagus jika Anda tidak ingin menyertakan video langsung di halaman Anda, tetapi lebih memilih untuk membuat interaksi dengan pengunjung.

penelitian

Sebelum kita mendalami tutorial, mari kita lihat hasil akhirnya dalam berbagai ukuran layar.

Biro

hasil akhir divi video popup.gif

mobil

hasilkan popup video seluler divi.gif

Mari kita mulai!

Gunakan plugin Video PopUp gratis

Instal dan aktifkan plugin

Hal pertama yang harus dilakukan adalah mengunduh Plugin gratis Video PopUp . Anda dapat menemukan plugin ini dengan membuka situs web WordPress > Plugin > Tambah Baru > Cari 'Video PopUp'. Setelah Anda menemukan plugin ini, instal. Setelah Anda selesai, pastikan untuk mengaktifkan plugin.

video popup.jpg

Pengaturan plugin

Lanjutkan dengan membuka pengaturan umum plugin ini dan mengaktifkan dua opsi di atas.

konfigurasi video popup.jpg

Tambahkan halaman baru menggunakan halaman landing versi software

Tambahkan halaman baru dan aktifkan menggunakan Visual Builder

Saatnya untuk mulai mempraktikkan berbagai hal! Tambahkan halaman baru, beri judul halaman Anda dan segera aktifkan Visual Builder.

buat halaman baru divi.jpg

Unduh tata letak versi perangkat lunak dari tata letak yang disimpan

Buka "Tata letak tersimpan Anda" dan unduh laman landas yang Anda unggah.

tata letak yang diunggah divi.jpg

Tambahkan modul teks di bawah modul Blurb tombol putar

Seperti yang Anda lihat, halaman tersebut sudah memiliki tombol putar yang akan membantu kami mencapai hasil yang diinginkan. Tetapi agar ini berfungsi, kita perlu membuat ulang desain di modul Blurb menggunakan modul teks. Tambahkan modul teks baru tepat di bawah modul Blurb.

tambahkan teks di atas modul blurb.jpg

Tambahkan gambar ke area konten

Setelah Anda menambahkan modul teks, lanjutkan dan tambahkan gambar tombol putar ke area konten modul teks Anda dengan mengklik " Tambahkan media Dan memilih tombol putar di perpustakaan media Anda.

Tambahkan media untuk mengacak divi.jpg

pilih gambar divi.jpg

Tambahkan salinan ke area konten

Lanjutkan dengan menambahkan salinan tepat di bawah gambar.

duplikasi modul blurb.jpg

Pengaturan teks

Untuk membuat modul sesuai dengan tata letak, kami akan mengaktifkan orientasi teks pusat dalam pengaturan teks modul.

aktifkan central orientation.jpg

Pengaturan teks tautan default

Dan kami juga akan memodifikasi parameter teks tautan sesuai:

  • Tautan Font: Kabin
  • Tautkan bobot font: tebal
  • Warna Teks Tautan: rgba (162,176,193,0.7)
  • Ukuran teks tautan: 17px
  • Ketinggian garis tautan: 1.6em

tautan menu desain divi.jpg

Arahkan kursor ke pengaturan teks

Ubah warna teks hover.

  • Tautkan warna teks: # a2b0c1

ubah warna dari tautan divi.jpg

jarak

Terakhir, tambahkan juga margin atas negatif ke modul teks.

  • Marign atas: -20vw

atur margin atas divi.jpg

Tambahkan pembacaan kontekstual ke isi modul teks

Beralih ke editor teks

Untuk membuat pop-up saat diklik, kita perlu menambahkan link kustom ke konten modul teks. Kembali ke area konten modul teks dan pilih mode Editor Teks.

edit modul teks dalam mode editor teks divi.jpg

Tambahkan tautan ke semua konten

Tautkan tempat konten Anda ke pop-up dengan menambahkan link ke gambar dan salinannya. Pastikan untuk mengganti URL tautan dengan milik Anda.

<a class="vp-s vp-yt-type" href="https://www.youtube.com/watch?v=zesTKCnvyAU" data-dwrap="1"></a>

tambahkan tautan gambar dengan divi.jpg video

Hapus modul Blurb dari tombol putar

Sekarang kita telah membuat mod teks yang terlihat persis sama dengan mod Blurb, kita dapat menghapus mod Blurb yang sudah ada sebelumnya dan hanya itu! Anda dapat menerapkan metode ini ke semua jenis tata letak yang Anda gunakan, tetapi ini benar-benar nilai tambah yang bagus untuk halaman arahan versi perangkat lunak.

hapus modul blurb yang tidak digunakan divi.jpg

final pikiran

Seperti yang Anda lihat, menambahkan popup di Divi menggunakan plugin Video Popup cukup sederhana. Ini akan memungkinkan Anda untuk menyajikan video blog Anda tanpa secara otomatis perlu mengintegrasikannya ke dalam konten.