Merasa bosan dengan tampilan navigasi breadcrumb yang begitu-begitu saja? Dengan memanfaatkan deklarasi
position:fixed; kita sanggup menciptakan sebuah objek (dalam hal ini navigasi breadcrumb) menjadi melayang. Untuk membuatnya lakukan beberapa langkah berikut ini:- Masuk ke tab Rancangan lalu pilih Edit HTML. Cek Expand Template Widget biar seluruh elemen pembangun posting tampil.
- Salin isyarat pemodel di bawah ini, lalu letakkan di atas isyarat
]]></b:skin>atau</style>:
.alaihumcrumb { position:fixed; z-index:1000; top:0; left:0; background:#333; width:98%; color:#ccc; border-bottom:2px solid #999; padding:1px 1% 1px 1%; -webkit-box-shadow:0 0 7px #000; -moz-box-shadow:0 0 7px #000; box-shadow:0 0 7px #000; } .alaihumcrumb a, .alaihumcrumb a:visited, .alaihumcrumb a:active { color:#fff; } .alaihumcrumb span.kanan { float:right; }
- Kemudian carilah isyarat yang tampak menyerupai ini:
<a expr:name='data:post.id'/>
TIP: tekan CTRL + F lalu ketik expr:name='data:post.id' untuk mempermudah pencarian.
Salin isyarat di bawah ini, lalu letakkan sempurna di atas isyarat<a expr:name='data:post.id'/>:
<b:if cond='data:blog.pageType == "item"'> <div class='alaihumcrumb'> <a expr:href='data:blog.homepageUrl'>Beranda</a> » <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'> <data:label.name/> </a> <b:if cond='data:label.isLast != "true"'> » </b:if> </b:loop> </b:if> » <data:post.title/> <span class='kanan'> Konten Lain di Sini </span> </div> </b:if>
Dalam sebuah template blogspot terkadang terdapat satu atau dua buah isyarat<a expr:name='data:post.id'/>. Jika apa yang telah kau lakukan tidak mengatakan hasil, cobalah untuk meletakkan isyarat tersebut di atas isyarat<a expr:name='data:post.id'/>yang kau temukan berikutnya.
- Klik Simpan Template.
Sedikit Penyesuaian:
- Kamu sanggup mengganti
BerandadenganHomeatau yang lainnya. Letakkan juga konten lain menyerupai jam dinding, jumlah komentar, jumlah posting atau yang lainnya di dalam wilayah kekuasaan<span class='kanan'> ... </span>