Navigasi Breadcrumb di blogspot - Hallo Sob Jody Blog, artikel kali ini berjudul Navigasi Breadcrumb di blogspot, kami telah menuliskan yang kami tahu pada artikel ini, semoga bermanfaat.

Judul : Navigasi Breadcrumb di blogspot
link : Navigasi Breadcrumb di blogspot

Navigasi Breadcrumb di blogspot

Navigasi dalam blog merupakan tombol cepat yang bisa kita gunakan untuk menuju ke halaman- halaman/ link-link tertentu. Dengan adanya navigasi adalah memudahkan setiap pengunjung untuk menjelajah dari isi blog karena biasanya navigasi ditanamkan beberapa link yang sebagian besar adah link dari sebuah artikel yang dianggap penting, dan juga bisa menuju ke label tertentu. Mungkin kita telah mengenal beberap anavigasi dalam blog. kali ini kita akan bahas mengenai navigasi breadcrumb. Yaitu sebuah navigasi yang memudahkan untuk kembali ke halaman sebelumnya atau halaman tertentu. 

Biasanya susunannya yaitu browse >Home > label > judul posting.  Bagi sobat yang belum tahu cobalah lihat demonya disini [lihat di atas judul artikel]

Langsung saja bagaimana cara pembuatannya.

• Pertama Login ke akun blogger sobat.
• Pada halaman Dashboard Pilih Tata Letak - Edit HTML
• Jangan lupa centang kotak kecil Expand Template Widget
• Back up dahulu untuk antisipasi kesalahan fatal, Download Template Lengkap
•  Carilah kode ]]></b:skin>  [tekan F3 atau Ctrl + F untuk memunculkan jendera pencarian]
•  Letakkan Kode-kode di bawah ini di atas kode ]]></b:skin>  tadi
  

  .breadcrumbs {
  padding:5px 5px 5px 0px;
  margin: 0px 0px 15px 0px;
  font-size:95%;
  line-height: 1.4em;
  border-bottom:3px double #e6e4e3;
  }

  sehingga menjadi seperti ini:
  

  .breadcrumbs {
  padding:5px 5px 5px 0px;
  margin: 0px 0px 15px 0px;
  font-size:95%;
  line-height: 1.4em;
  border-bottom:3px double #e6e4e3;
  }
  ]]></b:skin>

• Lalu cari kode berikut ini:
  <div class='post hentry uncustomized-post-template'>
• Letakkan kode-kode berikut tepat di bawah kode tadi
  

  <b:if cond='data:blog.homepageUrl == data:blog.url'>
  <b:else/>
  <b:if cond='data:blog.pageType == &quot;item&quot;'>
  <div class='breadcrumbs'>
  
  Browse &#187; <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
  <b:loop values='data:posts' var='post'>
  <b:if cond='data:post.labels'>
  <b:loop values='data:post.labels' var='label'>
  <b:if cond='data:label.isLast == &quot;true&quot;'> &#187;
  <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
  </b:if>
  &#187; <span><data:post.title/></span>
  </b:loop>
  </b:if>
  </b:loop>
  
  </div>
  </b:if>
  <b:else/>
  <b:if cond='data:blog.pageType == &quot;archive&quot;'>
  <div class='breadcrumbs'>
  Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; Archives for <data:blog.pageName/>
  </div>
  </b:if>
  <b:else/>
  <b:if cond='data:navMessage'>
  <div class='breadcrumbs'>
  <data:navMessage/>
  </div>
  </b:if>
  </b:if>

• Klik Simpan
• Lihat hasilnya dengan membuka satu artikel saja...
• selesai

Sangat mudah dan simple bukan. Kita berjumpa pada postingan selanjutnya.

BELAJARLAH DARI SEBUAH KESALAHAN, MENCOBA- DAN TERUS MENCOBA SAMPAI KAU BISA

Demikianlah Artikel Navigasi Breadcrumb di blogspot

Sekian Navigasi Breadcrumb di blogspot, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sekian postingankali ini.

Anda sedang membaca artikel Navigasi Breadcrumb di blogspot dan artikel ini url permalinknya adalah https://caratutorialgratis.blogspot.com/2010/01/navigasi-breadcrumb-di-blogspot.html Semoga artikel ini bisa bermanfaat.

Tweet