Jika Anda baru mulai membuat website, istilah breadcrumbs bisa jadi asing di telinga. Tapi Anda tak perlu terintimidasi. Breadcrumb adalah salah satu elemen pada website yang cukup mudah dipelajari.

Lewat artikel ini, kami akan memberikan penjelasan lengkap mengenai apa itu breadcrumbs. Anda bisa menemukan definisi, fungsi, pentingnya breadcrumbs untuk SEO, serta cara menambahkannya pada website.

Apa Itu Breadcrumb?

Breadcrumb adalah salah satu elemen yang penting dalam website yang berfungsi untuk menunjukkan letak spesifik sebuah halaman pada website.

Istilah ini dipinjam dari cerita anak, Hansel and Gretel. Di mana Hansel meninggalkan breadcrumb trail atau remahan roti di jalan sebagai petunjuk jalan untuk pulang dari hutan.

Selain dari cerita tersebut, cara kerja breadcrumbs bisa Anda samakan seperti alamat. Ia berguna untuk menunjukkan letak sebuah halaman diambil dari menu navigasi sebuah website.

Mari kita ambil contoh breadcrumbs dari blog Pediaon.

Panjangnya breadcrumbs sangat tergantung dari struktur konten pada sebuah website. Jika Anda membuat struktur website dengan ringkas, hal yang sama akan ditunjukkan oleh breadcrumbs. Begitu juga halnya ketika Anda membuat struktur yang panjang.

Dengan analogi alamat, Anda bisa anggap breadcrumbs pendek seperti alamat rumah di pinggir jalan. Ini berarti halaman atau post Anda cukup mudah ditemukan. Bandingkan dengan letak rumah yang cukup terpencil. Anda perlu menuliskan alamat lengkap hingga ciri-ciri rumahnya jika perlu. Begini pula yang tercermin pada breadcrumbs.

Berikut adalah contoh lain yang diambil dari website sebuah portal berita.

Apa Fungsi Breadcrumbs?

Breadcrumbs adalah bagian yang penging pada blog karena bisa berfungsi sebagai navigasi kedua setelah menu utama. Fungsi ini memudahkan pengunjung web untuk menjelajah website.

Pengunjung tak perlu mengulangi navigasi dari awal untuk menemukan artikel dengan topik yang sama pada website. Ia hanya perlu mengklik breadcrumbs untuk kembali ke halaman yang sebelumnya diakses.

Mengapa Breadcrumbs Penting?

Meski terlihat remeh, elemen satu ini sangat penting untuk website Anda karena dua hal.

Pertama, breadcrumbs berguna untuk mengoptimalkan SEO website Anda. Hal ini pada akhirnya akan berpengaruh ke ranking di search engines (mesin pencarian).

Mengapa bisa begitu?

Breadcrumbs adalah elemen website yang disukai user dan bot dari search engine. Adanya breadcrumbs memudahkan Google untuk memahami struktur data di website. Dengan struktur website yang jelas, Google bisa menampilkan hasil pencarian yang relevan tentang sebuah website.

Ketika konten tersebut dianggap relevan oleh user, maka posisinya di mesin pencarian akan semakin di atas.

Kedua, ia mampu mengurangi bounce rate atau persentase pengunjung yang meninggalkan website tanpa mengklik apapun.

Breadcrumbs mampu mengindeks halaman website hingga struktur navigasi terdalam. Ini tentu menjadikan hasil pencarian di Google semakin relevan. Pengunjung website bisa melewati navigasi yang rumit dari home page. Sebaliknya, mereka langsung bisa menemukan konten yang dicari dengan sekali klik.

Bayangkan saja skenario ketika pengunjung tak menemukan apa yang dicari dengan cepat. Bisa aja mereka meninggalkan website dengan cepat. Tentunya ini tak baik untuk reputasi website.

Cara Membuat Breadcrumb di WordPress

Membuat breadcrumb di website berbasis WordPress sangatlah mudah. Di bawah ini kami memberikan tiga cara yang bisa Anda pilih salah satunya.

Menginstall Tema yang Kompatibel

Jika Anda menyukai kepraktisan, menginstall tema yang sudah kompatibel adalah solusi tepat.

Biasanya tema WordPress untuk ecommerce sudah otomatis menggunakan breadcrumbs. Ini karena website ecommerce cenderung memiliki items yang banyak dan menu navigasi yang dalam. Berikut adalah rekomendasi tema WordPress khusus untuk ecommerce:

• Flat Some ⎼ Tema WooCommerce dengan banyak pilihan demo. Ada pengaturan bawaan dari tema. Terintegrasi dengan Yoast.
• Shopkeeper ⎼ Tema WooCommerce dengan desain yang elegan dan modern. Pengaturan bisa dilakukan dengan mudah.

Namun, jika Anda tak tertarik dengan ecommerce, kami merekomendasikan dua tema premium yang kompatibel.

• Knowledge Base ⎼ Tema WordPress khusus didesain untuk membuat pusat informasi.
• Smart Mag ⎼ Tema WordPress berbasis majalah. Cocok untuk blog, portal informasi, dan konten berbasis teks lainnya.

Menggunakan Plugin NavXT

Cara membuat breadcrumb di blog yang mudah dan gratis adalah dengan menginstall plugin. Salah satu plugin yang kami rekomendasikan adalah plugin NavXT.

Sebelum lebih lanjut mengeksplor pengaturan dan fitur plugin ini, Anda perlu membackup website Anda atau menambahkan kode di bawah ke dalam file header.php pada child theme.

<div class=”breadcrumbs” typeof=”BreadcrumbList” vocab=”https://schema.org/”>
<?php
if(function_exists(‘bcn_display’))
{
bcn_display();
}?>
</div>

Kode tersebut berguna untuk menampilkan breadcrumbs di seluruh bagian header website. Akan tetapi, jika dirasa terlalu teknis, Anda bisa menambahkannya melalui Appearance > Widgets lalu tarik widget Breadcrumb NavXT ke letak yang diinginkan.

Di sisi lain, Anda juga bisa mengatur bagaimana breadcrumb trail ditampilkan. Akses fitur ini melalui Settings > Breadcrumb NavXT

Melalui bagian ini Anda bisa mengkustomisasi breadcrumbs sesuai dengan tipe konten, mengubah taksonomi, dan sebagainya.

Memaksimalkan Fitur Yoast SEO

Alternatif lain untuk membuat breadcrumbs adalah dengan memaksimalkan fitur dari plugin Yoast SEO.

Yoast SEO adalah satu plugin yang mampu menangani segala hal soal SEO. Tak hanya soal technical SEO dalam website, plugin satu ini membantu penulis membuat konten berkualitas tinggi.

Di samping itu, Yoast SEO memiliki fitur untuk mengoptimalkan snippet dan meta description. Kedua elemen tersebut akan menambah tampilan konten di mesin pencarian supaya lebih menarik. Hasilnya, ada kemungkinan besar konten Anda di klik oleh pengguna.

Nah, untuk menambahkan breadcrumbs pada website, Anda perlu lebih dulu meletakkan kode di bawah ke single.php, page.php, atau header.php.

<?php
if ( function_exists(‘yoast_breadcrumb’) ) {
yoast_breadcrumb( ‘<p id=”breadcrumbs”>’,'</p>’ );
}
?>

Setelah itu, Anda bisa mengaktifkan breadcrumb melalui SEO > Search Appearance. Setelah itu pilih tab Breadcrumbs dan klik Enabled pada Breadcrumbs settings.

Anda bisa mengubah pengaturan yang lain di tab ini. Seperti pengaturan untuk memperlihatkan blog post ataupun bold breadcrumbs trail di halaman yang sedang di buka.

Ketika Anda mengaktifkan fitur ini, Anda bisa mengakses pengaturan yang lebih spesifik di halaman atau post tertentu. Contohnya seperti di bawah ini.

Ketika judul halaman atau post terlalu panjang, Anda bisa membuat judul khusus agar breadcrumbs terlihat lebih rapi. Caranya, cukup klik bagian Advanced dan tulis judul alternatif di bagian Breadcrumbs Title.

Kesimpulan

Meskipun terlihat kecil di website, breadcrumbs adalah elemen website yang tak bisa Anda abaikan. Elemen yang satu ini tak hanya memudahkan pengunjung menjelajah website, tetapi juga berpengaruh ke SEO.

Breadcrumbs membantu Google mengindeks halaman website dengan tepat. Pun, keberadaannya akan mengurangi bounce rate pada website.

Lewat artikel ini, kami menyuguhkan tiga alternatif cara memasang breadcrumb di WordPress. Kami harap tutorial ini membantu mengoptimalkan potensi website Anda. Selamat mencoba!

Soni Indratmoko

Penulis aktif di Pediaon yang membahas teknologi, website, WordPress, digital marketing, dan berbagai tutorial internet.