Mengenal apa itu Breadcrumbs & Cara Membuatnya

Mengenal apa itu Breadcrumbs & Cara Membuatnya

Mengenal apa itu Breadcrumbs & Cara Membuatnya

Apa Itu Breadcrumbs? | Republika OnlineJogja One Solution – 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. Supaya kita lebih mengenal apa itu breadcrumbs & cara membuatnya. Anda perlu memperhatikan artikel ini.

 

 

Apa itu Breadcrumbs

Breadcrumbs adalah elemen pada website yang memiliki fungsi sebagai navigasi halaman. Bisa disebut sebagai navigasi sekunder dalam website, karena breadcrumbs dapat menunjukan urutan struktur halaman-halaman yang sudah dibuka oleh pengunjung website. Ini belum tentu bisa ditemukan pada setiap website, karena ada beberapa website yang tidak memiliki breadcrumbs. Padahal jika Anda tahu breadcrumbs ini memiliki banyak fungsi penting untuk website. Agar lebih jelasnya berikut kami berikan contoh penerapan breadcrumbs pada website dan blog.

Breadcrumbs website

Breadcrumbs website/blog biasanya memiliki struktur yang lebih pendek.

Breadcrumbs toko online

Breadcrumbs toko online biasanya memiliki hirarki yang lebih panjang, ini dilakukan karena memang toko online memiliki banyak kategori dan produk yang banyak macamnya, jadi perlu diberikan navigasi yang berbeda setiap kategori produknya.

Fungsi Breadcrumbs

Breadcrumbs memiliki fungsi sebagai alat navigasi pada website untuk memudahkan pengunjung setelah menu utama pada header website. Pengunjung tidak perlu membuka halaman dari awal, cukup dengan membuka struktur breadcrumbs sebelumnya saja.

Contohlah website memiliki struktur breadcrumbs Home > Teknologi > Cara Membuat Website, untuk kembali ke kategori Teknologi, Anda tidak perlu kembali ke Home website, cukup dengan mengklik breadcrumbs Teknologi. Nah saat sudah dibuka Anda akan masuk pada halaman sebelum Anda membuka artikel Cara Membuat Website.

Cara membuat Breadcrumbs

Pada pembahasan artikel tentang breadcrumbs ini, kami akan memberikan 3 cara membuat breadcrumbs untuk website WordPress, silahkan Anda pilih mana kira-kira yang paling mudah untuk diterapkan pada website.

1.    Install themes WordPress yang support breadcrumbs

Cara pertama ini paling mudah dan cepat, Anda tinggal mencari themes WordPress yang sudah support fitur breadcrumbs. Biasanya template untuk kebutuhan toko online dan blog magazine memiliki fitur standar navigasi breadcrumbs.

Themes Smartmagz

Berikut beberapa contoh template WordPress dari Themeforest.net yang sudah include breadcrumbs : SmartMag, Pixwell, GoodLife, Gloria, Motive, Urban Mag dan lainnya. Jika ada rekomendasi template lain yang bagus dan breadcrumbs ready silahkan tuliskan pada kolom komentar dibawah.

2.  Install Yoast SEO

Yoast SEO adalah plugin SEO WordPress terbaik paling recomended menurut kami. Banyak fitur-fitur SEO yang dimiliki dan dapat dimaksimalkan untuk optimasi website salah satunya breadcrumbs. Masih banyak orang yang belum tau bagaimana setting breadcrumbs pada Yoast SEO.

yoast SEO

Untuk memulai memasang breadcrumbs pada website WordPress, pastikan Anda sudah menginstall plugin Yoast SEO. Silahkan Anda buka pada artikel sebelumnya tentang “Cara Setting Yoast SEO”. Jika sudah berhasil silahkan ikuti cara membuat breadcrumbs berikut ini.

  • Silahkan masuk ke script template website Anda, kemudian pilih pada salah satu menu single.phppage.php atau header.php yang terdapat pada template.
  • Silahkan masukan script dibawah ini

<?php

if ( function_exists(‘yoast_breadcrumb’) ) {

yoast_breadcrumb( ‘<p id=”breadcrumbs”>’,'</p>’ );

}

?>

  • Jika sudah jangan lupa untuk save atau update template
  • Selanjutnya silahkan masuk pada website WordPress Anda dan login.
    SEO Yoast
  • Scroll kebawah dan pilih menu “SEO” kemudian pilih “Search Appearance” dan pilih menu “Breadcrumbs”.
  • Silahkan pilih menu “Enabled”.

3.   Install Breadcrumbs NavXT

Terakhir, cara memasang breadcrumbs bisa menggunakan plugin Breadcrumbs NavXT. Jika Anda belum install silahkan ikuti tutorialnya berikut ini:

  • Silahkan masuk pada menu plugin WordPress, kemudian pilih Add New dan tuliskan pada search box “Breadcrumbs”, kira-kira hasilnya seperti berikut ini.
    Install Breadcrumbs NavXT
  • Setelah muncul beberapa pilihan, silahkan pilih plugin “Breadcrumbs NavXT” kemudian “Install Now” dan “Activate”.
  • Silahkan Anda masuk ke bagian editor template WordPress Anda, pilih pada menu “Appearance” kemudian pilih “Theme Editor”.
  • Silahkan Anda cari pada Theme Header (header.php) dan masukan script berikut

<div class=”breadcrumbs” typeof=”BreadcrumbList” vocab=”https://schema.org/”>

<?php

if(function_exists(‘bcn_display’))

{

bcn_display();

}?>

</div>

Jika sudah jangan lupa save.

–          Setelah itu silahkan masuk pada menu Plugin > Breadcrumbs NavXT > Setting

–          Silahkan Anda kustomisasi sendiri “Post Types”,“Taxonomies” sesuai dengan kebutuhan website Anda.

Dari ketiga cara tersebut silahkan Anda pilih mana yang kira-kira paling mudah dan cepat untuk dikerjakan.

JOGJA ONE SOLUTION – Kami hadir memberi solusi untuk kebutuhan media promosi bisnis atau usaha Anda. Grafik order dan omzet meningkat. Dapatkan website murah, desain menarik, kompleks, dan full maintenance dengan harga yang terjangkau KLIK DISINI. Atau hubungi kami di Telp (0274) 5017127 | WA : 0888 0289 8802


Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

WhatsApp chat