Dalam dunia SEO, khususnya SEO onpage, Breadcrumb menjadi salah satu elemen penting yang harus diperhatikan dengan baik lho. Karena fitur ini dapat mempermudah user memahami posisi halaman web yang sedang mereka lihat.
Bagi pengguna theme Generatepress, fitur Breadcrumb ini biasanya ada pada fitur “elemen”. Masalahnya, kadang Breadcrumb yang ada di elemen theme tersebut suka hilang, baik karena tidak sengaja terhapus ataupun karena kesalahan lainnya.
Apabila hal tersebut sampai terjadi, kamu gak perlu panik.
Karena Breadcrumb di GeneratePress ini bisa dibuat dengan mudah. Kamu bisa gunakan bantuan plugin seperti Rankmath dan Yost.
Tapi apabila kamu belum memahami cara membuat Breadcrumb di WordPress, khususnya untuk tema Generatepress, kamu bisa baca artikel ini.
Di sini sudah saya tuliskan panduan lengkap cara membuat dan menambahkan Breadcrumb ke tema GeneratePress dengan mudah.
Yuk baca lanjut!
Apa itu Breadcrumb?
Buat kamu yang masih pemula dalam dunia website dan SEO, mungkin belum paham secara mendalam tentang Breadcrumb. Sebelum membuatnya, mari kita pahami dulu dari definisinya.
Breadcrumb adalah elemen navigasi pada sebuah website yang membantu pengguna mengetahui lokasi mereka dalam struktur situs. Biasanya, breadcrumb ditampilkan dalam bentuk jalur hierarki di bagian atas halaman, seperti:
Beranda > Kategori > Sub kategori > Halaman Saat Ini
Bagi kamu yang memanfaatkan website untuk kegiatan marketing online ataupun membuat website untuk tujuan apa pun, baiknya website yang kamu bangun itu menampilkan Breadcrumb.
Bukan cuma karena bagus dari sisi SEO, tapi hal ini juga membantu user melihat navigasi halaman yang sedang dia lihat.
Cara Membuat Breadcrumb di WordPress
Seperti yang sudah saya katakan sebelumnya, cara membuat Breadcrumb di WordPress ini bisa menggunakan beberapa cara. Mulai dari dengan menggunakan bantuan plugin ataupun tanpa menggunakan plugin.
Berikut beberapa cara yang bisa kamu gunakan:
1. Menggunakan Plugin Rankmath
Jika kamu menggunakan plugin Rankmath, coba ikuti langkah-langkah berikut:
Aktifkan dulu fitur Breadcrumb:
- Login ke wp-admin
- Pilih menu Rankmath
- Pilih pengaturan umum
- Klik Breadcrumb
- Aktifkan (on) fitur Breadcrumb tersebut
- Pilih karakter pemisah misalnya pakai », | atau – (pilih sesuai keinginan sendiri)
- Tampilkan tautan beranda » On
- Label beranda pilih On
- Tautan beranda » https://hallokim.com/ gunakan sesuai dengan domain blog atau web yang kamu miliki
- Untuk fitur lainnya, biarkan default saja
- Klik simpan
Menambahkan Breadcrumb ke tema Generatepress:
- Login ke wp-admin
- Pilih tampilan » Generatepress
- Aktifkan fitur elements
- Kemudian pilih lagi menu tampilan » elements
- Klik add new elements di bagian atas kanan
- Klik Choose element type » Hook » Create
- Add new hook: Breadcrumb.
- Salin fungsi Breadcrumb (kotak warna biru) dan masukan ke kolom editor
- Setting:
- Hook : generate_before_entry_title
- Execute PHP: on
- Display Rules:
- Location: Pos » All Pos
- Klik tombol Terbitkan
Breadcrumb selesai dibuat dan ditambahkan pada theme Generatepress. Silahkan kamu refresh halaman blognya, pasti Breadcrumb sudah muncul.
2. Menggunakan Plugin Yoast
Apabila kamu menggunakan plugin Yost SEO, kamu juga bisa membuat Breadcrumb di WordPress dan menambahkannya ke tema GeneratePress dengan mudah. Silahkan kamu ikuti langkah-langkah berikut:
Aktifkan Breadcrumb:
- Login ke WP-admin
- Pilih dan klik Yost
- Klik pada menu SEO » tampilan pencarian » Breadcrumb
- Pada menu pengaturan breadcrumbs, setting seperti ini:
- Enable Breadcrumbs: Aktif
- Tebalkan Laman terakhir: Regular
- Kemudian taksonomi yang akan ditampilkan pada breadcrumbs untuk jenis konten, pilih:
- Pos (post): Kategori
- Klik tombol Simpan Perubahan.
Menambahkan Breadcrumb ke Tema Gemeratepress:
- Pilih menu tampilan » Pilih elements
- Klik add new element » Choose element type » Hook » Create
- Add new hook: Breadcrumb
- Salin fungsi Breadcrumb di bawah ini dan masukan ke kolom editor
<?php
if ( function_exists('yoast_breadcrumb') ) {
yoast_breadcrumb( '<p id="breadcrumbs">','</p>' );
}
?>
- Setting:
- Hook : generate_before_entry_title
- Execute PHP: on
- Display Rules:
- Location: Pos » All Pos
- Klik terbitkan
- Selesai
Tinggal buka halaman blog kamu, lalu cek apakah Breadcrumb sudah tampil atau belum. Jika tidak muncul, ulangi lagi langkah di atas, pastikan sudah sesuai urutannya.
3. Menggunakan Script Breadcrumb
Kamu bisa membuat breadcrumb di WordPress tanpa plugin dengan menambahkan kode PHP secara manual ke dalam file tema. Berikut adalah langkah-langkahnya:
3.1. Tambahkan Script Breadcrumb di functions.php
Buka file functions.php
di tema WordPress kamu, lalu tambahkan kode berikut:
function custom_breadcrumb() {
if (!is_home()) {
echo '<nav class="breadcrumb">';
echo '<a href="' . home_url() . '">Beranda</a> » ';
if (is_category() || is_single()) {
the_category(', ');
if (is_single()) {
echo " » ";
the_title();
}
} elseif (is_page()) {
echo the_title();
} elseif (is_archive()) {
echo post_type_archive_title();
} elseif (is_search()) {
echo 'Hasil pencarian untuk: "' . get_search_query() . '"';
}
echo '</nav>';
}
}
3.2. Panggil Breadcrumb di header.php
atau single.php
Sekarang, panggil fungsi breadcrumb ini di dalam file header.php
, single.php
, atau page.php
, tergantung di mana kamu ingin breadcrumb muncul. Tambahkan kode berikut:
<?php custom_breadcrumb(); ?>
3.3. Tambahkan CSS untuk Styling Breadcrumb (Opsional)
Agar breadcrumb tampil lebih rapi, tambahkan CSS berikut ke dalam file style.css
:
.breadcrumb {
font-size: 14px;
margin-bottom: 15px;
}
.breadcrumb a {
text-decoration: none;
color: #0073aa;
}
.breadcrumb a:hover {
text-decoration: underline;
}
Dengan cara ini, kamu bisa menampilkan breadcrumb di WordPress tanpa perlu menggunakan plugin.
Fungsi dan Manfaat Breadcrumb Bagi SEO Website
Breadcrumb bukan hanya membantu navigasi pengguna, tetapi juga memiliki manfaat besar untuk SEO.
1. Fungsi Breadcrumb dalam Website
Breadcrumb berfungsi sebagai elemen navigasi yang menunjukkan struktur halaman dalam hierarki website. Contohnya:
Beranda » Blog » SEO » Fungsi Breadcrumb untuk SEO
Fungsi utama breadcrumb:
- Memudahkan navigasi – Pengguna dapat berpindah ke halaman sebelumnya dengan lebih cepat.
- Menampilkan struktur halaman – Menjelaskan posisi halaman dalam website.
- Membantu pengindeksan oleh Google – Mesin pencari lebih mudah memahami hubungan antar halaman.
2. Manfaat Breadcrumb untuk SEO
2.1. Meningkatkan User Experience (UX)
Pengguna bisa dengan mudah memahami struktur website dan kembali ke kategori yang lebih tinggi tanpa perlu menekan tombol “Back”. UX yang baik dapat mengurangi bounce rate, yang berpengaruh positif terhadap SEO.
2.2. Mempercepat Crawling oleh Google
Google menyukai struktur website yang jelas. Dengan breadcrumb, Googlebot bisa lebih cepat mengindeks halaman dan memahami hubungan antar kategori dalam website.
2.3. Menambah Tampilan Rich Snippet di SERP
Google sering menampilkan breadcrumb di hasil pencarian sebagai pengganti URL. Ini membuat tampilan website lebih menarik dan meningkatkan click-through rate (CTR).
Contoh Breadcrumb di Google SERP:
Beranda > Blog > SEO
Ini lebih bersih dan jelas dibandingkan URL panjang seperti:
domain.com/kategori/subkategori/judul-artikel/
2.4. Mengurangi Bounce Rate
Breadcrumb membantu pengguna menemukan halaman relevan lainnya dalam website. Jika mereka tidak menemukan informasi yang dicari, mereka lebih cenderung berpindah ke halaman lain daripada langsung keluar dari website.
2.5. Memperkuat Internal Linking
Breadcrumb secara otomatis menambahkan tautan internal ke kategori dan halaman lainnya, yang dapat membantu distribusi link juice untuk meningkatkan peringkat halaman di Google.
Kesimpulan
Jadi, Breadcrumb itu adalah fitur navigasi yang akan memberitahukan kepada user letak halaman yang sedang dia lihat saat itu.
Dari hal inilah Breadcrumb dianggap penting dalam dunia SEO. Bahkan praktisi SEO expert memasukkan fitur ini sebagai fitur wajib yang harus ada pada sebuah halaman web.
Cara membuat Breadcrumb di WordPress bisa dilakukan dengan banyak cara. Saya menulis 3 panduan di artikel ini. Ini yang menurut saya paling mudah dan praktis. Bisa dilakukan dengan menggunakan plugin Rankmath maupun Yoast.
Adapun jika kamu tidak ingin menggunakan plugin karena khawatir memakan banyak resource hosting kamu juga bisa menggunakan script Breadcrumb. Di atas sudah saya tulis juga panduan lengkapnya.
Silahkan dibaca seteliti mungkin. Buat yang sudah membaca artikel ini, saya ucapkan terima kasih dan semoga bermanfaat.