Cara Membuat Breadcrumbs Navigasi Pada Blogger

Sebelumnya apakah sobat tahu apa itu Breadcrumbs? Apa Fungsinya? Penting nggak?

Breadcrumbs Adalah sistem navigasi sekunder yang menunjukkan lokasi pengguna pada situs atau aplikasi web.

Maksudnya, pengunjung bisa melihat posisi dimana ia berada saat menjelajah di situs kita.

Fungsi Breadcrumbs sebagai alat bantu visual yang efektif, menunjukkan lokasi pengguna dalam hirarki situs. Properti ini membuat navigasi breadcrumb menjadi sumber informasi kontekstual untuk pengguna dan membantu mereka menemukan jawaban atas pertanyaan berikut:

• dimana saya? Breadcrumbs menginformasikan pengunjung dimana lokasi mereka
• Kemana saya bisa pergi? Breadcrumbs memperbaiki findability dari bagian dan halaman situs. Struktur situs lebih mudah dipahami saat diletakkan di breadcrumb daripada jika dimasukkan ke dalam menu.
• Haruskah saya pergi kesana? Breadcrumbs mengkomunikasikan nilai konten dan mendorong penjelajahan (misalnya pengunjung situs e-commerce mungkin berada di halaman produk, produk mungkin tidak cocok, tapi pengunjung mungkin ingin melihat produk lain dari kategori yang sama). Hal ini, akan mengurangi tingkat pentalan situs secara keseluruhan .

Breadcrumbs adalah salah satu bagian yang paling penting bagi blog atau website manapun untuk memberikan konten navigasi yang mudah dibawa ke konten sebelumnya dan selanjutnya.

Dengan demikian kita dapat meningkatkan kemampuan membaca pengguna dan strategi SEO. Jadi breadcrumbs memberikan kemudahan navigasi bagi pengunjung blog.

Sekarang mari kita pelajari bagaimana untuk menambahkan breadcrumbs di blog.

Langkah 1: silahkan masuk ke dashboard, pilih Tema dan Edit HTML

Kemudian, klik Edit HTML

Langkah 2: Sekarang, tekan CTRL+F pada keyboard dan cari kode ini
<div class='blog-posts hfeed'>

Langkah 3: Kemudian, pastekan kode berikut tepat dibawah kode tadi

<b: if cond = 'data: blog.pageType == & quot; item & quot;'><br /><br /><p class = 'breadcrumbs'><br /><span class = 'post-labels'><br /><br /><a expr:href='data:blog.homepageUrl' rel='tag'> Beranda </a><br /><br /><b: nilai loop = 'data: posting' var = 'post'><br /><br /><b: jika cond = 'data: post.labels'><br /><br /><b: nilai loop = 'data: post.labels' var = 'label'><br /><br /><b: jika cond = 'data: label.isLast == true'> & # 187;<br /><br /><a expr:href='data:label.url' rel='tag'> <data: label.name/> </a><br /><br /></ b: if><br /><br /></ b: loop><br /><br /><b: else /><br /><br />& # 187; Tidak berlabel<br /><br /></ b: if><br /><br />& # 187; <span> <data: post.title /> </ span><br /><br /></ b: loop><br /><br /></ span><br /><br /></ p><br /><br /></ b: if><br /><br /><b: if cond = 'data: blog.pageType == & quot; static_page & quot;'><br /><br /><p class = 'breadcrumbs'><br /><a expr:href='data:blog.homepageUrl'> Beranda </a> & # 187; <data: blog.pageName /><br /><br /></ p><br /><br /></ b: if><br /><br /><b: if cond = 'data: blog.pageType == & quot; archive & quot;'><br /><br /><p class = 'breadcrumbs'><br /><a expr:href='data:blog.homepageUrl'> Beranda </a> & # 187; <data: blog.pageName /><br /><br /></ p><br /><br /></ b: if><br /><br /><b: if cond = 'data: blog.searchLabel'><br /><br /><p class = 'breadcrumbs'><br /><a expr:href='data:blog.homepageUrl'> Beranda </a> & # 187; <data: blog.pageName /><br /><br /></ p><br /><br /></ b: if>

Kemudian simpan dan lihat perubahannya, contoh punya saya seperti ini

Itulah artikel Cara Membuat Breadcrumbs Navigasi Pada Blogger, semoga bermanfaat dan semoga berhasil. Sekian dan terimakasih !