Malem ini topik yang akan dibawakan adalah masalah Utak-Atik Blog, yaitu gimana sih caranya nambahin "Breadcrumbs" kedalam blogger blog.
Apa itu Breadcrumbs
Breadcrumbs nama yang cukup aneh -menurutku- mengingat kegunaannya itu untuk memberikan atau menunjukkan kita ini baru ada dimana dalam sebuah web, mungkin nama kerennya penunjuk jalan. Ya, jadi ngga bakal ada nama kesasar waktu mau balik lagi ke artikel itu. Tinggal klik..klik..dah nyampe ke tempat tujuan.Jadi breadcrumbs itu yang mana sih? Ok ok..
Di atas itu tampilan breadcrumbs waktu ada di halaman depan blog ini. Nah kalo yang ini udah masuk kedalam salah satu artikel yang judulnya Cara Membuat Blog Translator.
Kalo sekarang, mungkin tulisannya bakal jadi gini kali ya,
Home >> Utak Atik Blog >> Tambahkan "Breadcrumbs" Pelacak Navigasi
Jadi cara nambahinnya lumayan gampang, cuma mungkin ada beberapa jenis template yang ngga compatible dengan code ini.PertamaX masuk ke dalam HTML editor di Blogger blog.
Langkah Kedua, cari code ini
<b:include data='top' name='status-message'/>
Yang Ketiga, tindih code doatas dengan code dibawah ini <!-- Breadcrumbs code -->
<div id='places'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<div class='breadcrumbs'>
Selamat Datang di <data:blog.title/>
</div>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumbs'>
<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 == "true"'> »
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
» <span class='post-title entry-title'><data:post.title/></span>
</b:loop>
</b:if>
</b:loop>
</div>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<div class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> » 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>
</div>
<!-- Breadcrumbs berakhir -->
Untuk mengganti kata sambutan, bisa dengan mengubah kata Selamat datang di dengan kata-kata kesukaan, trus kalau mau pengubahan lebih lanjut bisa dengan manghapus <data:blog.title/> soalnya code ini yang memanggil judul blog dengan otomatis.<div id='places'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<div class='breadcrumbs'>
Selamat Datang di <data:blog.title/>
</div>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumbs'>
<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 == "true"'> »
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
» <span class='post-title entry-title'><data:post.title/></span>
</b:loop>
</b:if>
</b:loop>
</div>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<div class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> » 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>
</div>
<!-- Breadcrumbs berakhir -->
Ok, langkah Keempat
Cari code </b:skin>, tepat sebelumnya paste code ini
#places {
border: 1px solid #000000;
padding: 5px 15px;
margin: 10px 0;
line-height: 1.4em;
}
Kalu ngga suka sama warna bordernya, item, bisa diganti dengan code warna yang lain. border: 1px solid #000000;
padding: 5px 15px;
margin: 10px 0;
line-height: 1.4em;
}
0 comments:
Sobat, Apa pendapatmu?