membuat menu di blog

 

Cara membuat menu horizontal ini cukup mudah, tahap pertama yang harus dilakukan adalah:

- sign in ke blog

- klik layout/tata letak

- klik edit HTML

- (sebaiknya kalian download template lengkap terlebih dahulu, agar jika hasil tidak sesuai dengan keinginan maka bisa dikembalikan seperti semula)

- beri tanda  centang pada Expand Widget Template (agar code widget muncul)

- kemudian cari kode: ]]></b:skin>

- untuk mempermudah pencarian tekan CTRL+F

- letakkan code berikut diatasnya:

 /* linktab

================== */



#linktab{

background:url(http://i634.photobucket.com/albums/uu61/adetea/tabhijau.gif) ;

width: 864px;

height: 30px;

font-size: 11px;

font-family: georgia, Tahoma, Verdana;

color: #ffff66;

font-weight: bold;

margin: 0px auto 0px;

padding: 0px;

border-left: 1px solid #000;

border-right: 1px solid #000;

overflow: hidden;

}

#tabright {

width: 200px;

height: 30px;font-size: 11px;

float: right;

margin-right:10px;

margin-bottom:50px;

padding: 0px;

}

#tabright a img {

border: none;

margin: 5px;

padding: 0px;

}



#linktab ul {

margin:0;

padding:1px 10px 0px 0px;

list-style:none;

}

#linktab li {

display:inline;

margin:0;

padding:0;

}

#linktab a {

float:left;

background:transparent;

margin:0;

padding:0 0 0 3px;

text-decoration:none;

}

#linktab a span {

float:right;

height: 35px;

display:block;

background:transparent;

padding:7px 6px 4px 6px;

color:#ffff66;

border-right: 1px solid #000;

}

#linktab a span {

float:none;

}

#linktab a:hover span {

color:#fff;

}

#linktab a:hover {

background-position:0% -42px;

}

#linktab a:hover span {

background-position:100% -42px;

}

- simpan template

jika template sudah disimpan tahap selanjutnya adalah:

-  masuk ke menu edit laman

- tambah gadget (lihat gambar Klik Disini)

- pilih HTML/JavaScript

- kemudian copy code berikut:



<div id='linktab'>

<ul>

<li><a href='URL Link Disini'><span>Home</span></a></li>

<li><a href='http://almansuqie-tips.blogspot.com/' target='_blank'><span>AlmansuQie</span></a></li>

<li><a href='URL Link Disini' target='_blank'><span>TAJUK</span></a></li>

<li><a href='URL Link Disini' target='_blank'><span>TAJUK</span></a></li>

<li><a href='URL Link Disini' target='_blank'><span>TAJUK</span></a></li>

<li><a href='URL Link Disini' target='_blank'><span>TAJUK</span></a></li>

</ul>



<div id='tabright'>

<form action='http://NAMABLOGSOBAT.blogspot.com/search' id='searchform' method='get' name='searchform'>

<input id='s' name='q' type='text' value=''/>

<input id='searchsubmit' type='submit' value='Cari'/>

</form>



</div></div>



- kemudian simpan



 keterangan: kode yang berwarna ungu adalah kode untuk kotak pencarian, jika kalian tidak ingin menggunakannya kode dapat dihapus

































Tag:

membuat menu di blog tanpa edit html

membuat menu di blogsport

membuat menu di blog wordpress

membuat menu di blogdetik

membuat menu di blogspot dengan jquery

membuat menu dalam blogger

membuat menu dan submenu di blogspot

cara membuat menu di blogspot

cara membuat menu di blog wordpress

cara membuat menu di blog tanpa edit html

cara membuat tab menu di blog tanpa edit html

cara membuat menu bar di blog tanpa edit html

cara membuat menu dropdown di blog tanpa edit html

membuat menu di blog

membuat menu di blog wordpress

membuat menu di blogspot

membuat menu di blogspot dengan jquery

cara membuat menu di blogsport

cara membuat menu di blog wordpress

membuat sub menu di blog

cara membuat menu di blog dengan mudah



membuat menu dropdown di blog