Sabtu, 08 September 2012
Cara Memasang Breadcrumb di Blogspot
Do you like this story?
Kalau secara visual, breadcrumb adalah tampilan seperti pada gambar dan yang saya lingkari tersebut.
Kalau pengertiannya breadcrumb adalah sebuah sebuah navigasi yang menyatakan keberadaan kita dalam blog tersebut. Misalnya pada gambar, breadcrum tersebut menyatakan kalau kita sedang membaca postingan yang berjudul Blogger Harus Kreatif yang terletak pada kategori SEO dari blog kawan SEO.
Saya rasa sudah cukup penjelasannya, sekarang saatnya cara memasangnya.
Langkah untuk Memasang Breadcrumb di Blogspot adalah sebagai berikut :
1. Yang pertama pasti masuk ke Blogspot terlebih dahulu.
2. Kemudian pilih Template -> Edit HTML
3. Cari kode <b:include data='top' name='status-message'/>
4. Setelah ketemu, letakkan kode berikut diatasnya kode pada langkah ketiga.
<b:include data='posts' name='breadcrumb'/>5. Langkah selanjutnya adalah mencari kode <b:includable id='main' var='top'>
6. Letakkan kode berikut diatas kode pada pencarian langkah kelima
<b:if cond='data:blog.pageType == "item"'>6. Langkah terakhir adalah klik SIMPAN dan lihat hasilnya.
<div class='similiar'>
<div class='widget-content'>
<h3>Related Post</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>
Sekian dulu postingan tentang Cara Memasang Breadcrumb di Blogspot kali ini. Semoga bermanfaat buat kawan-kawan semua.
Langganan:
Posting Komentar (Atom)
0 Responses to “Cara Memasang Breadcrumb di Blogspot”
Posting Komentar
Blogger yang baik selalu meninggalkan jejak.