Memasang Navigasi Breadcrumb

-
Pada kesempatan ini saya akan berbagi informasi dan pengetahuan mengenai Cara membuat navigasi breadcrumb pada blog. Tahukan teman apa itu breadcrumb ?
Coba lihat diatas judul post ini, teman - teman akan menemui tulisan "Home >> Blog >> Cara Membuat Breadcrumb Pada Blog". Itulah yang namanya breadcrumb.
Fungsinya sendiri adalah untuk menunjukan sedang dimana posisi pembaca saat ini dan untuk mempermudah navigasi pada blog. Namun selain fungsi - fungsi tersebut ternyata navigasi breadcrumb ini juga SEO friendly lhooo.. Jadi sangat rugi bila kita tidak menggunakannya :)
Caranya ikuti petunjuk dibawah ini:
  • Pertama masuk ke dashboard
  • Klik design
  • Pilih tab Edit HTML
  • Berikan tanda Cek pada Expand Widget Templates
  • Download terlebih dahulu template teman yang sekarang ini untuk menghindari kerusakan akibat salah memasukkan kode nantinya, dengan klik Download Full template.
  • Cari kode <div class='post hentry'> atau <div class='post hentry uncustomized-post-template'> (Bisa dengan CTRL + F)
  • Letakkan kode berikut ini setelah kode diatas:
<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='breadcrumbs'> <span itemscope="http://data-vocabulary.org/Breadcrumb" itemtype="http://data-vocabulary.org/Breadcrumb"> <a expr:href='data:blog.homepageUrl' itemprop="url"><span itemprop="title">Home</span></a> &gt; </span><span itemscope="http://data-vocabulary.org/Breadcrumb" itemtype="http://data-vocabulary.org/Breadcrumb"><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' itemprop="url"><span itemprop="title"><data:label.name/></span></a> <b:if cond='data:label.isLast != &quot;true&quot;'> &gt; </b:if> </b:loop> </b:if> &gt; </span><span itemscope="http://data-vocabulary.org/Breadcrumb" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title"><data:post.title/> </span></span></div> </b:if></b:if>
  • Cari kode ]]></b:skin>
  • Letakkan kode berikut ini sebelum ]]></b:skin>
.breadcrumbs{padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px;font-size:95%;line-height:1.4em;
border-bottom:2px double #cadaef;
}
  • Klik Save Template
  • Selesaiii.... 
Bagaimana teman ? Berhasilkan ? Selamat blogging dan semoga semakin sukses :)
 
Sumber Artikle Referensi Kita

Postingan populer dari blog ini

Cara Membuat Formulir Contact Us (email me from) pada blog

-
Gambar
Sebagai blogger pemula maupun yang sudah professional sobat pasti sangat membutuhkan sekali kritik dan saran , kali ini saya akan  memberikan tutorial membuat laman contact us dengan email me form seperti contact punya saya, berikut dari kegunaan laman contact us adalah mengirim pesan kritik maupun saran dari pembaca kepada pemilik blog atupun bisa sebagai wadah untuk para pengiklan mengirimkan iklanya karena emil me form ini dilengkapi dengan upload option yang memudahkan pemberi saran maupun pengiklan mengirimkan file berupa gambar, video, music, dan .docs , untuk lebih mudah dalam pemasangan email me form ini ikuti langkah-langkah berikut dengan benar. kunjungi website emailmefrom klik sign up for free dan akan muncul tampilan seperti ini gambar diatas merupakan menu-menu yang akan tampil pada laman contact us klik name klik email klik phone klik website klik file upload klik paragraph text lihat pada gambar berikut Langkah selanjutnya adalah menged...
Baca selengkapnya

Pasang Meta Deskripsi dan Meta Keyword

-
Gambar
Assalamualaikum.. Pada kesempatan ini, saya akan berbagi informasi mengenai  Cara Memasang Meta Keyword dan Deskripsi Blog. Meta keyword dan deskripsi sangat penting bagi pengoptimalan Search engine (SEO) blog kita. Dengan meta keyword , search engine akan mudah mengenali apa saja isi / konten dari blog kita. Selain iut dengan meta desripsi , kita bisa memberitahukan kepada para pencari informasi melalui search engine tentang apa sajakah konten - konten yang ada dalam blog kita tersebut. Daripada bingung kegunaannya mari saya tunjukkan contoh gambar dibawah ini: Itu adalah hasil pencarian blog saya melalui Google, Lihatlah pada Tulisan : "Informations about blogging, science, knowledge, tutorials , mathematic, biology, etc." Itulah yang dinamakan meta desripsi. Jadi kita bisa menceritakan pada pencari informasi bahwa isi blog kita itu mengenai apa saja... Langsung saja ya daripada panjang lebar, Ini dia caranya: Masuk ke dashboard Klik design Pili...
Baca selengkapnya

Cara membuat halaman depan blog tanpa postingan

-
Sebenarnya tempat posting / posts blog masih ada dan tidak akan hilang tapi hanya disembunyikan saja di halaman depan / halaman utama, dan apabila pengunjung melakukan search dan menemukan postingan anda, maka postingan anda masih bisa ditampilkan, bisa dipahami bukan? Apabila di sidebar anda terdapat beberapa widget, maka widget tersebut masih tampil di homepage. Nah disini peranan conditional tag yang ditambahkan untuk membuat tampilan homepage blog tersendiri tanpa postingan, anda dapat lihat gambar di bawah ini, dimana di homepage / halaman depan tidak terdapat posts blog / tempat postingan dan sebagai gantinya anda dapat menambahkan tulisan "Selamat Datang berupa gambar" atau menambah widget menurut selera Sobat. Dengan menambah conditional tag yang akan diletakkan pada kode posts blog nantinya, maka posts blog / posting blog akan tampil di halaman utama saja dan tidak akan tampil di halaman posting. Dan nantinya jika conditional tag / tag kondisional dit...
Baca selengkapnya