Menu Horizontal yang mengikuti saat di gulir (fixed) memang dibutuhkan untuk memudahkan orang yang mengunjungi blog kita, jadi kita harus mempunyainya..
Menu Horizontal ini bisa untuk menempatkan link ke Sitemap, Laman anda, dan pencarian

Hasil Menu Horizontal bisa anda lihat dibawah ini


Tertarik?? Langsung saja
Blogger - Edit HTML

Cari ]]></b:skin> dan taruh kode dibawah ini di atasnya

.page-menu{background:#222;width:100%;z-index:299;margin:0 auto;padding:0;position:fixed;left:0;top:0}
.page-menu ul{list-style:none;color:#ddd;z-index:999;width:910px;margin:0 auto;padding:0}
.page-menu ul li{list-style:none;line-height:34px;display:inline-block}
.page-menu li a{transition:all .99s ease;background:transparent;color:#ddd;display:block;font-size:13px;font-family:Arial,Helvetica,Tahoma,sans-serif;position:relative;text-decoration:none;text-transform:capitalize;padding:0 10px}
.page-menu li a:hover,.page-menu .selected{box-shadow: 100px 0px 0 #59c3e2 inset;
transition:all .99s ease}
.menusearch{width:200px;float:right;margin:0 auto;padding:4px 0 0}
.searchform {margin-top:0px;display: inline-block;*display: inline;padding:0;background:#fff;width:200px;height:23px; overflow:hidden;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;border:1px solid #000;}
.searchform input {font:italic 12px Arial;color:#222;line-height:23px;height:23px;padding:0;margin:0;}
.searchform .searchfield {background:transparent;padding:0 0 0 6px;margin:0;width: 160px;height:23px;border:0px;outline: none;line-height:23px;}
.searchform .searchbutton{border:none;font-size:12px;height:23px;width:23px;margin:0;padding:0}

Simpan, sekarang ke tata letak dan taruh kode dibawah ini :


<div class="page-menu"><ul>
<li><a href="http://rishad-harisdias.blogspot.com/">Home</a></li>
<li><a href="http://rishad-harisdias.blogspot.com/p/disclaimer.html">Disclaimer</a></li>
<li><a href="http://rishad-harisdias.blogspot.com/p/privacy-policy.html">Privacy Policy</a></li>
<div class="menusearch">
<form action="http://rishad-harisdias.blogspot.com/search" class="searchform" method="get">
<input class="searchfield" id="q" name="q" onblur="if(this.value==&#39;&#39;)this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value=&#39;&#39;" type="text" value="Search here....">
<input class="searchbutton" src="http://2.bp.blogspot.com/-X6XaMdnPCmo/U2zDmYzPEOI/AAAAAAAAACg/suDNhqcXMdU/s1600/tombolcari.gif" style="cursor:pointer;vertical-align:top" type="image" value="Go">
</form>
</div>
</ul></div>

Simpan dan sekarang lihat hasilnya...
:)

12 komentar:

  1. wiihhh keren gan :D
    izin praktek yah :v

    ReplyDelete
  2. Replies
    1. iya gan, susah kalo dijelasin satu2, kalo penjelasan tag bisa ke kangismet aja..
      tapi untuk posting lain saya kasih penjelasan :)

      Delete
  3. wah mantap tuh gan, izin sedot yah gan :D

    ReplyDelete
    Replies
    1. silahkan gan,, kalo bisa yang bermerk dot nya :v

      Delete
  4. ini dia yang saya cari :D
    akhirnya ketemu juga .. izin bookmark ya gan

    ReplyDelete
    Replies
    1. Silahkan.. terimakasih sudah berkunjung

      Delete
  5. Blog ane sudah ada, tapi nice post sob :)

    ReplyDelete

- Komentar yang Relevan
- Dilarang ada Link Aktif
- No Sara, Pornografi
- No OOT

 
Top