Cara Membuat Halaman Navigasi
21:56 wita
- Jumat, 26 Oktober 2012
-
Sekarang saya akan mencoba berbagi dengan kawan cara membuat Halaman Navigasi, :z; untuk kawan Blogger yang konsen di Blogspot saya rasa pasti tak asing dengan yang namanya Navigasi, tapi tak ada salahnya untuk kawan yang belum mengetahui apa itu Navigasi, tak ada salahnya saya sampaikan Navigasi biasanya berada diatas Blog kita, tapi pada Blog saya ini saya taruh di bawah :x;
Cara membuatnya :
- Masuk Account Blogger dengan ID kawan
- Pada Dasbor pilih Template - Edit HTML - Lanjutkan
- Copas Script berikut diatas ]]></b:skin>
#Bego-nav img {/* margin: 5px auto; */vertical-align: middle;}#Bego-nav p.info {float: right;padding: 0 10px;margin: 0 auto 0;line-height: 1.6;height: 100%;vertical-align: bottom;}#Bego-nav p {float: left;margin: 0 0 -5px 0; padding: 0 10px;line-height: 1.6;vertical-align: bottom;}#Bego-nav a {color:#00F;text-decoration:none;}#Bego-nav a:hover{color: #F00;}#Bego-nav {align: center;position: fixed;border-top: 0px solid #DDD;border-bottom: 0px solid #030;background: #000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmMbZkGog6ISK1QwCM_L3aglmbHO_-OqphmC0Lqc2HimcRueLKUZSdTULn2KfkoJFeIq36Xr-5Uk3w8g6XVcUFDT8XyADUqiGe_u42RvPENYWEh-yUzi5ifhS8M8y5eO82dJBnKiJ2Ssgp/s1600/bg_nav-bego.png) repeat-x center center;width: 100%;left: 0px;text-align: left;color: #ffffff;font-family: verdana;font-size: 14px;z-index:10000;bottom:0px;}
Teks yang saya beri warna merah menunjukkan posisi Navigasi, kalau kawan ingin merubah posisim silahkan menggantinya, sedangkan 0px adalah menandakan nempel / mepet kepinggir,
- Silahkan simpan sementara Template kawan :q;
- Selanjutnya Copas Script berikut diatas </body>
Simpan disini File kawan
</div>
- Sebagai contoh yang sudah jadi saya gabung dengan Daftar Isi Plus Komentar Berjalan selengkapnya sebagai berikut :
<div id='Bego-nav'><table border='0' width='1000px'><tr><td align='center'><div style='width:250px; border: 0px solid #ccc; background:transparent;padding:10px 10px 0 10px;margin:0; text-shadow:2px 2px 2px #F00; font-size: 14px; COLOR: white;'><b>ARSIP BLOGBEGO CREATION :</b></div>
</td><td align='center'>
<div style='border: 2px solid #ccc; background: #FFF; padding:0px 10px; font-size: 14px; color:blue;margin:12px 10px 3px;'><b><!-- Alphabetical/chronological Post Title Listing with comment count Start --><script type="text/javascript">function getYpipeTL(feed) {document.write('<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4">');var i;for (i = 1; i < feed.count ; i++){var href = "'" + feed.value.items[i].link + "'";var pTitle = feed.value.items[i].title + "</a> &#187; ";var pComment = " \(" + feed.value.items[i].commentcount + " komentar\) &#171;&nbsp; ";var pList = "</a>" + "<a href="+ href + '"target="_blank">' + pTitle;document.write(pList);document.write(pComment); //to remove comment count delete this linedocument.write('</a></li>');}document.write('</marquee>');}</script><script src="http://pipes.yahoo.com/pipes/pipe.run?YourBlogUrl=http://blogbego-creation.blogspot.com&Order=alphabet&_id=401e43055731c1a29f1e1d3eb5e8e13f&_callback=getYpipeTL&_render=json"type="text/javascript"></script><span style="font-size: 8px; float:right;"> </span><!-- Alphabetical Post Title Listing End --></b></div></td></tr></table></div>
- Kalau kawan ingin mencobanya, saya persilahkan untuk mengganti Link Blog saya, dan jangan lupa simpan Template kawan :y;
Cara Membuat Halaman Navigasi
Kalau pada Artikel Cara Membuat Halaman Navigasi
kurang jelas atau ada Artikel, Link yang tak jalan / rusak bisa disampaikan lewat Komentar
mudah-mudahan saya bisa segera memperbaiki
---ooOOOoo---
{[["☆","★"]]}
Rate this posting: Kalau pada Artikel Cara Membuat Halaman Navigasi
kurang jelas atau ada Artikel, Link yang tak jalan / rusak bisa disampaikan lewat Komentar
mudah-mudahan saya bisa segera memperbaiki
---ooOOOoo---
mantap gan, terima kasih banyak ya atas ilmunya.. :)
BalasHapus