Cara Mengaktifkan Navigasi Dot pada Modul Slider Video Divi Anda

Diterbitkan: 2022-02-25

Navigasi titik adalah salah satu bentuk navigasi paling umum yang ditemukan di dalam bilah geser. Ini benar terlepas dari konten slider. Navigasi titik menyediakan cara yang sederhana dan intuitif bagi pengguna untuk menavigasi konten slider. Untungnya, modul Video Slider Divi menyertakan opsi navigasi titik. Pada artikel ini, kita akan melihat cara mengaktifkan navigasi titik pada modul Video Slider Divi Anda. Kami juga akan menjelajahi beberapa kombinasi opsi di sepanjang jalan.

Mari kita mulai.

Navigasi Default Penggeser Video Divi

Pertama, mari kita lihat bagaimana navigasi bekerja di dalam modul Video Slider. Secara default, setiap slide ditampilkan sebagai thumbnail di bawah pemutar video. Slide saat ini digelapkan dengan overlay. Dalam contoh ini, slide paling kiri adalah slide aktif.

Navigasi Default Penggeser Video Divi

Memilih gambar mini slide akan mengarahkan pemutar video ke slide tersebut. Dalam contoh ini, slide ketiga dari kiri adalah slide aktif. Gambar mini lebih gelap untuk menunjukkan bahwa itu adalah slide aktif. Yang saya lakukan hanyalah mengklik thumbnail-nya.

Navigasi Default Penggeser Video Divi

Kita juga dapat menavigasi dengan panah yang muncul saat kita mengarahkan kursor ke slide yang aktif. Ini membawa kita ke slide sebelumnya atau berikutnya. Ini berguna jika Anda ingin maju atau mundur melalui slide satu per satu. Ini sangat ideal untuk menavigasi beberapa slide. Jika Anda memiliki banyak slide, perlu beberapa saat untuk menemukan video tertentu.

Navigasi Default Penggeser Video Divi

Apa itu Navigasi Titik?

Navigasi titik adalah kumpulan titik kecil yang muncul di bagian bawah slide video. Setiap titik mewakili slide video di dalam penggeser. Mengklik sebuah titik mengungkapkan slide itu di pemutar video. Titik untuk slide aktif lebih terang daripada titik lainnya. Ini adalah cara yang bagus untuk melihat berapa banyak slide yang ada, di mana slider berada dalam daftar slide, dan untuk menavigasi ke slide tertentu dengan cepat.

Apa itu Navigasi Titik?

Navigasi titik sangat membantu saat Anda memiliki banyak slide, atau Anda ingin menghemat ruang. Navigasi ditingkatkan, seperti navigasi gambar mini, sambil menggunakan lebih sedikit ruang dalam tata letak dan mengurangi kekacauan visual.

Saat pengguna ingin melihat slide tertentu, mereka tidak perlu menunggu hingga penggeser menunjukkannya lagi kepada mereka, atau menggunakan panah untuk membolak-balik slide hingga mereka mendapatkan slide yang ingin mereka lihat. Mereka cukup memilih slide yang ingin mereka lihat dengan mengklik titiknya.

Mengaktifkan Navigasi Titik di Slider Video

Thumbnail terlihat bagus, tetapi membutuhkan ruang ekstra. Terkadang kami menginginkan footprint yang lebih kecil untuk modul Video Slider kami atau desain yang tidak terlalu berantakan. Saat diaktifkan, navigasi titik menggantikan navigasi gambar mini, memberi kami desain yang lebih bersih dan tidak berantakan. Kita dapat menggunakannya dengan atau tanpa panah navigasi.

Untuk mengaktifkan navigasi titik di modul Video Slider, pertama, aktifkan Visual Builder dengan mengklik link di bagian atas halaman Anda. Selanjutnya, arahkan kursor ke modul Video Slider dan klik ikon roda gigi untuk membuka pengaturannya.

Mengaktifkan Navigasi Titik di Slider Video

Gulir ke bawah ke Elemen . Di sini, Anda akan melihat opsi untuk mengaktifkan atau menonaktifkan panah, dan kotak tarik-turun berlabel Slider Controls .

Mengaktifkan Navigasi Titik di Slider Video

Klik pada kotak dropdown untuk melihat opsi Anda.

Mengaktifkan Navigasi Titik di Slider Video

Pilih Gunakan Navigasi Titik dan Anda akan melihat gambar mini dihapus dan titik ditambahkan ke slide utama.

  • Kontrol Penggeser: Gunakan Navigasi Titik

Mengaktifkan Navigasi Titik di Slider Video

Video Slider Anda sekarang memiliki tampilan yang lebih sederhana dan membutuhkan lebih sedikit ruang. Anda akan melihat titik untuk setiap slide, jadi jika Anda memiliki banyak slide, itu akan lebih terlihat.

Mengaktifkan Navigasi Titik di Slider Video

Navigasi Titik Terang atau Gelap

Warna navigasi titik default adalah putih. Ini berfungsi baik untuk gambar dan overlay video gelap, tetapi mungkin sulit untuk melihat apakah gambar atau overlay itu terang. Untungnya, Anda dapat mengubahnya sesuai kebutuhan Anda dengan satu kontrol sederhana.

Di tab Desain pada pengaturan Video Slider, buka Slider Controls Color dan pilih Dark dari kotak dropdown.

  • Warna Kontrol Slider: Gelap

Navigasi Titik Terang atau Gelap

Warna Geser Kontrol Gelap bekerja sangat baik dengan gambar terang atau Warna Hamparan Thumbnail seperti contoh di bawah ini. Pastikan untuk menguji opsi warna navigasi titik Anda untuk melihat mana yang paling sesuai dengan gambar dan warna overlay Anda.

Navigasi Titik Terang atau Gelap

Video Slider Dot Navigation Tanpa Navigasi Panah

Mengubah dari gambar mini ke navigasi titik menambahkan satu set tombol navigasi ke slide itu sendiri. Baik panah dan titik sekarang muncul saat pengguna mengarahkan kursor ke slide, dan titik-titik selalu terlihat. Karena pengguna akan selalu melihat titik, Anda mungkin memutuskan untuk tidak menyertakan panah.

Video Slider Dot Navigation Tanpa Navigasi Panah

Untungnya, Anda memiliki opsi untuk menonaktifkan panah. Dalam pengaturan Konten modul Video Slider, Anda akan melihat bagian bernama Elements . Bagian ini memiliki pengaturan yang disebut Show Arrows . Ini diaktifkan secara default. Cukup klik untuk menonaktifkannya.

  • Tampilkan Panah: Tidak

Video Slider Dot Navigation Tanpa Navigasi Panah

Slider video sekarang menampilkan slide hanya dengan navigasi titik saat saya mengarahkan kursor ke atasnya.

Video Slider Dot Navigation Tanpa Navigasi Panah

Contoh Navigasi Titik Penggeser Video

Mari kita lihat bagaimana modul Divi Video Slider terlihat dalam tata letak Divi menggunakan navigasi titik. Untuk contoh saya, saya menggunakan halaman Tentang dari Paket Tata Letak Kafe gratis yang tersedia di Divi. Halaman ini berisi modul Video yang ditempatkan di atas gambar latar belakang gambar kopi untuk lingkungan kafe.

Berikut tata letak halaman Tentang:

Berikut tampilan close-up dari bagian yang saya sesuaikan. Anda dapat melihat gambar di latar belakang. Jika kita tidak hati-hati dengan desainnya, kita bisa membuatnya terlihat berantakan dengan mudah.

Menyederhanakan Desain

Pertama, saya mengganti modul Video dengan modul Video Slider. Selanjutnya, saya membuat empat slide dan menambahkan overlay gambar ke setiap slide. Saya telah membiarkan navigasi default diaktifkan. Ini berfungsi, tetapi navigasi thumbnail terlihat sedikit berantakan dengan latar belakang ini. Ada terlalu banyak gambar dalam ruang kecil dan itu menjadi sangat cepat membingungkan. Modul Video asli tampak lebih bersih. Navigasi titik akan memperbaikinya.

Menyederhanakan Desain

Inilah modul Video Slider dengan navigasi titik yang diaktifkan. Ini memiliki tampilan modul Video yang lebih sederhana dan lebih bersih dan masih dapat digunakan sebagai penggeser video. Selain titik-titik tambahan pada gambar, tampilannya sama dengan modul Video asli.

Menyederhanakan Desain

Mengubah Desain di Ponsel

Titik-titik tersebut mungkin terlalu kecil atau sulit digunakan pada penggeser video Anda saat digunakan dengan ponsel cerdas. Dalam hal ini, Anda dapat menggunakan navigasi gambar mini hanya di ponsel dan tetap menggunakan navigasi titik di desktop dan tablet.

Mengubah Desain di Ponsel

Dalam pengaturan Kontrol Slider , klik ikon tablet untuk membuka opsi ukuran layar. Pilih ikon telepon lalu pilih Gunakan Trek Gambar Mini . Ini mengaktifkan navigasi thumbnail untuk ponsel, membiarkan desktop dan tablet menampilkan navigasi titik. Pengguna sekarang memiliki cara yang mudah untuk menavigasi melalui slide terlepas dari ukuran layar perangkat mereka.

Mengubah Desain di Ponsel

Mengakhiri Pikiran

Itulah tampilan kami tentang cara mengaktifkan navigasi titik pada modul Video Slider Divi Anda. Dots memberikan desain sederhana dan bersih yang sangat cocok untuk tata letak apa pun. Titik-titik itu intuitif, jadi pengguna sudah tahu cara menavigasinya. Memilih antara opsi warna terang dan gelap memberi Anda beberapa fleksibilitas sehingga mereka akan bekerja dengan baik dengan gambar dan overlay Anda. Navigasi dot Video Slider Divi adalah pilihan yang sangat baik jika Anda menginginkan tampilan yang bersih dan minimal untuk slider video Anda.

Kami ingin mendengar dari Anda. Apakah Anda menggunakan navigasi titik dalam modul Divi Video Slider Anda? Beri tahu kami tentang hal itu di komentar di bawah.