Sorotan Plugin Divi – Modul Divi Breadcrumbs

Saat saya menavigasi situs web, salah satu alat navigasi yang saya cari adalah remah roti. Mereka bagus untuk menunjukkan kepada Anda di mana Anda berada dalam hierarki navigasi dan memudahkan untuk menemukan artikel lain di dalam struktur. Breadcrumbs dapat ditambahkan ke Divi dengan plugin bernama Divi Breadcrumbs Module.

Divi Breadcrumbs Module adalah plugin pihak ketiga dari CodeCrater yang membuat breadcrumb berbasis lokasi. Dengan kata lain, ini menunjukkan kepada Anda hierarki kategori halaman yang sedang Anda baca. Itu juga menyediakan tautan untuk setiap elemen dalam hierarki sehingga Anda dapat dengan mudah melihat posting terbaru untuk setiap kategori. Remah roti sangat dapat disesuaikan.

Dengan menggunakan Modul Breadcrumbs, Anda dapat menempatkan remah roti pada halaman dan posting individual yang menggunakan Divi Builder. Ini juga berfungsi dengan plugin Extra dan Divi Builder. Dalam sorotan plugin ini kita akan melihat plugin di Divi dan Extra dan melihat beberapa cara untuk menyesuaikannya.

Mengapa Menggunakan Breadcrumb?

Remah roti meninggalkan jejak yang menunjukkan hierarki kategori dan merupakan cara yang bagus untuk meningkatkan navigasi. Mereka tidak memakan banyak ruang dan dapat mengurangi serta menyederhanakan jumlah tindakan yang harus dilakukan pengguna untuk menavigasi konten Anda. Ini sangat penting jika Anda memiliki banyak kategori yang disematkan.

Modul Divi Breadcrumbs meningkatkan SEO dengan memberikan informasi hierarki kepada Google tentang situs web Anda. Ini berarti Anda harus memilih kata kunci untuk kategori yang ingin Anda rangking. Ini juga memaksa desainer untuk menggunakan nama kategori yang lebih mudah dipahami.

Breadcrumb meningkatkan UX dan UI. Mereka seharusnya tidak menggantikan navigasi menu standar Anda, tetapi mereka dapat membangun minat dan membuat pengunjung tetap berada di situs Anda lebih lama.

Modul Divi Breadcrumbs

Unggah dan aktifkan plugin seperti biasa. Modul akan muncul dalam warna merah terang yang disebut Hollywood Cerise. Banyak plugin remah roti memerlukan Yoast karena mereka menarik remah roti dari plugin Yoast, tetapi Modul Divi Breadcrumbs tidak memerlukan Yoast. Sebaliknya, ia menciptakan remah roti sendiri. Jadi tidak ada plugin lain yang diperlukan.

Pengaturan konten termasuk menyembunyikan remah roti rumah, menambahkan teks remah roti rumah Anda sendiri, memilih ikon pemisah (dari 12 pilihan), menyembunyikan halaman saat ini, pengaturan latar belakang, dan label admin. Pengaturan desain mencakup gaya untuk ikon, teks, dan tautan, serta opsi spasi standar.

Contoh Modul Divi Breadcrumb

Ini adalah tata letak artikel dasar dengan modul judul posting dengan gambar, modul remah roti, dan modul teks artikel. Saya meninggalkan pengaturan remah roti pada defaultnya.

Beginilah tampilan modul dengan pengaturan default. Tautan untuk Rumah dan Anggar berwarna biru untuk menunjukkan bahwa mereka dapat diklik. Remah roti bisa diletakkan di kiri, tengah, atau kanan.

Dalam contoh ini saya telah menempatkan remah roti di tengah dan menambahkan latar belakang gradien dan meningkatkan ukuran font untuk judul artikel (14 poin) dan tautan (12 poin). Teksnya berwarna putih. Karena mereka dicetak di atas gradien, saya membuatnya dengan warna yang sama. Saya juga mengubah pemisah garis. Dalam posting biasa saya tidak akan menarik perhatian pada remah roti dengan latar belakang gradien, tetapi ini menunjukkan apa yang dapat Anda lakukan dengannya.

Menambahkan Breadcrumbs Di Bawah Menu Fullwidth

Tempat terbaik untuk menambahkan remah roti adalah di bagian atas halaman. Dalam contoh ini saya membuat posting menggunakan menu lebar penuh dan mengatur padding dan margin ke 0 untuk bagian lebar penuh dan bagian standar. Saya menyematkan kategori untuk menunjukkan hierarki.

Saya mengubah warna font remah roti agar sesuai dengan menu lebar penuh, tetapi kemudian melunakkannya sehingga tidak menonjol. Saya mengubah pemisah menjadi panah dan menghapus Beranda dan halaman saat ini dari navigasi remah roti.

Perhatikan remah roti mengikuti struktur tersemat yang sama dengan kategori pada gambar di atasnya. Artikel itu sendiri juga memasukkan kategori-kategori itu, tetapi tidak ada struktur hierarkis. Mereka dapat dihapus dari judul jika Anda tidak ingin menampilkan kategori yang sama beberapa kali.

Dalam contoh ini saya menempatkan warna latar belakang di baris, membuatnya lebar penuh, mengubah warna font agar tidak overpower ke menu, dan menambahkan 1 piksel ke spasi huruf. Perubahan kecil dapat membuat perbedaan besar.

Ini adalah pengaturan yang sama menggunakan latar belakang di dalam modul remah roti alih-alih baris. Saya menambahkan padding untuk mengurangi lebarnya. Saya suka itu menciptakan elemen kecil yang terlihat terpisah tetapi melekat pada menu di atasnya.

Menata Pemisah

Pemisah juga memiliki fitur penataan. Ubah gaya font, ukuran, warna, spasi, dan tinggi. Di antara opsi pemisah dan fitur penataan, Anda dapat dengan mudah membuat pemisah agar sesuai dengan branding situs web Anda.

Contoh ini menggunakan font default berwarna ungu dan ukuran font 20 untuk pemisah.

Berikut pemisah yang sama dengan font Georgia untuk pemisah. Cukup mengubah font pemisah sudah cukup untuk memberikan tampilan baru.

Berikut pemisah yang sama menggunakan font Black Ops One. Ini lebih berani dan lebih menonjol.

Ini adalah Droid Serif pada font 20 titik dengan spasi baris 4 piksel. Saya telah membuat font menjadi merah tua.

Bahkan titik-titik berubah bentuk dengan pilihan font. Yang ini adalah Passion One di 24 poin. Sebaiknya luangkan waktu untuk bereksperimen dengan font, warna, dan ukuran untuk menciptakan sesuatu yang unik. Mudah dilakukan dengan kontrol gaya standar.

Menggunakan Modul Divi Breadcrumbs dengan Ekstra

Modul Divi Breadcrumbs bekerja dengan Extra dan plugin Divi Builder. Berikut ini tampilan Extra dengan remah roti di bawah gambar di sebelah kanan. Saya memasukkan nama posting karena remah roti sangat jauh dari judul di bagian atas layar. Ini menggunakan pemisah batang.

Idealnya remah roti berada di bagian atas halaman. Dalam tata letak halaman saya, modul remah roti ada di atas. Alasan ditampilkan di bawah gambar adalah saya mengizinkan Extra untuk menampilkan gambar unggulan.

Dalam contoh ini saya telah menempatkan gambar di dalam tata letak dan mengatur bagian untuk memiliki 0 padding atas. Saya menghapus posting saat ini dan membuat pemisah menjadi merah.

Lisensi, Pembaruan, Dukungan

Plugin dapat diinstal di situs web tanpa batas untuk Anda dan klien Anda. Pembaruan adalah seumur hidup. Ini termasuk enam bulan dukungan.

• Klik di sini untuk membeli: Modul Divi Breadcrumbs

Pikiran Akhir

Breadcrumb adalah salah satu hal kecil yang Anda perhatikan ketika hilang. Jika dirancang dengan benar, mereka akan ada saat pengguna membutuhkannya dan tidak mengganggu saat tidak dibutuhkan. Modul Divi Breadcrumbs adalah cara yang bagus untuk menambahkannya ke halaman dan posting Divi Anda dan mereka dapat dengan mudah ditata agar sesuai dengan branding situs Anda. Ini sederhana dan intuitif.

Jika Anda tertarik untuk menambahkan remah roti ke tata letak Divi Anda, Modul Divi Breadcrumbs mungkin merupakan plugin yang Anda butuhkan.

Kami ingin mendengar dari Anda! Sudahkah Anda mencoba Modul Divi Breadcrumbs? Beri tahu kami tentang pengalaman Anda di komentar di bawah.

Gambar Unggulan melalui Yevgenij_D / shutterstock.com