Sunday, 17 November 2013

Cara Membuat Menu pada Blog

1. Login ke akun Blogger sobat
 
2. Sekarang Klik Template
3. Klik EDIT HTML
4. Sekarang Cari Kode </head> agar mudah dalam pencarian tekan Ctrl+f
5. Letakan kode di bawah tepat di atas kode </head>


<style type='text/css'> 
#tabs28 {   float:left;   width:100%;   background:#fff;   font-size:93%;   line-height:normal; border-bottom:1px solid #DD740B;   }
 #tabs28 ul { margin:0; padding:10px 10px 0 50px; list-style:none;   } 
#tabs28 li {   display:inline;   margin:0;   padding:0;   } 
#tabs28 a {   float:left;   background:url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtTJJPZNdxyT034_Dy_5F9sqiGeB368DxLjRn11ZlJKpUJp17n4hP6ppWKGjM8bVAc3P_Lcx5M4AsLV5ffrVWNph_ErixeaekwD1DXxA_-nkr_ii7H4j3D1ShX5_MPvG_1TsLYkEa98txV/s1600/slide-left.gif&quot;) no-repeat left top;   margin:0;   padding:0 0 0 5px;   text-decoration:none;   } 
#tabs28 a span {   float:left;   display:block;   background:url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbPMowVz9yBoe14262rBOhJ1B6JRd41u1vUqdKCJc9vCDBvIQhAUCr1Nhil_5Cl6z9eYoQpJ1nBkPb33GvwYVCdzJ2t6EDC_cVXgaI3G1eL-yS4al1Mv9XYKOumwyXV_YN3ZukRTy-T9gY/s1600/side-right.gif&quot;) no-repeat right top;   padding:5px 15px 4px 6px;   color:#FFF;   } 
#tabs28 a span {float:none;}  #tabsI a:hover span {   color:#FFF;   } #tabs28 a:hover {   background-position:0% -42px;   } 
#tabs28 a:hover span {   background-position:100% -42px;   }</style>
Catatan:
Anda Boleh Ganti tulisan 10 dengan yang anda inginkan(fungsinya untuk panjang jarak atas)
Anda Boleh Ganti tulisan 50 dengan yang anda inginkan(fungsinya untuk panjang sebelah kiri)  

7. Sekarang kita menuju ke layout 
 
8. Klik Tambahkan Gadget dan pilih 'HTML/Javascript
9. Letakan script html di bawah ini di kolom yang disediakan. (Ingat, untuk kolom judul gadget tidak perlu diisi)


<div id="tabs28">

<ul>
<li><a href="#"><span>Home</span></a></li>
<li><a href="#"><span>Link 1</span></a></li>
<li><a href="#"><span>Link 2</span></a></li>
<li><a href="#"><span>Link 3</span></a></li>
<li><a href="#"><span>Link 4</span></a></li>
<li><a href="#"><span>Link 5</span></a></li>
<li><a href="#"><span>Link 6</span></a></li>
<li><a href="#"><span>Link 7</span></a></li>
<li><a href="#"><span>Link 8</span></a></li>
</ul>

</div>
10. Klik Simpan
catatan: ganti tanda # dengan alamat URL
               ganti Link 1 - Link 8 dengan nama menu yang anda inginkan,
oke mungkin cukup sekian, Semoga Bermanfaat jangan lupa follow akun twitter saya dan like fanspagenya :) 

Related Posts:

  • DOWNLOAD… Read More
  • Yuuhi Wo Miteiruka (English Verse) You think about what kind of day you’ve had On the way home, don’t you? There are sad times and painful times too I hope the good times win out… Read More
  •  PENERAPAN SIFAT KOLIGATIF LARUTAN DALAM KEHIDUPAN SEHARI-HARI Sifat koligatif adalah sifat-sifat fisis larutan yang hanya berga… Read More
  • Cara Memasang Musik/Lagu Berputar Secara Otomatis Saat Dibuka di Blog  Cara Memasang Musik/Lagu Berputar Secara Otomatis Saat Dibuka di Blog - Sebuah blog akan terasa… Read More
  • Karya Hasil editing Photoshop ane gan,ada yang mau belajar?… Read More

0 comments:

Post a Comment

sealkazzsoftware.blogspot.com resepkuekeringku.com