Membuat Menu Bar

Cara membuat menu bar di blogspot dengan mudah

menu bar di blogspot
http://langkah2membuatblog.blogspot.com

 

1. Silahkan masuk ke akun Blogge
2. Klik halaman "Template" download template lengkap untuk berjaga-jaga terjadi hal-hal  yang tidak di inginkan.
3. Centang "Expand Template Widget". 
4. Terus silahkan cari kode ]]></b:skin> denan menggunakan Ctrl + F.
5. Simpan kode script di bawah ini tepat di atas kode ]]></b:skin>

#menubar{
border-bottom:4px solid #ff0000;
width:1025px;
height:32px;
background:#000000;
float:center;
margin-bottom:3px;
}
#menubar ul{
float:left;
margin:0;
padding:0;
}
#menubar li{
float:left;
list-style:none;
margin:0;
padding:0;
}
#menubar li a, #menubar li a:link{
float:left;
padding:8px 12px;
color:#fff;
text-decoration:none;
font-size:13px;
font-weight:bold;
}
#menubar li a:hover, #menubar li a:active, #menubar .current_page_item a  {
background: #ff0000;
color: #fff;
text-decoration:none;
}
#menubar li li a, #menubar li li a:link, #menubar li li a:visited{
font-size: 12px;
background: #ff0000;
color: #fff;
text-decoration:none;
width: 150px;
padding: 0px 10px;
line-height:30px;
}
#menubar li li a:hover, #menubar li li a:active {
background: #000000;
color: #ffffff;
}
#menubar li ul{
z-index:9999;
position:absolute;
left:-999em;
height:auto;
width:170px;
margin-top:32px;
border:1px solid ##ff0000;
}
#menubar li:hover ul, #menubar li li:hover ul, #menubar li li li:hover ul, #menubar li.sfhover ul, #menubar li li.sfhover ul, #menubar li li li.sfhover ul{
left:auto
}
#menubar li:hover, #menubar li.sfhover{
position:static
}       
6. Untuk seterusnya silahkan cari kode <div id="content-wrapper"> 
7. Simpan kode script di bawah ini tepat di atas kode <div id="content-wrapper">
<div id='menubar'>
<ul>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><ahref='http://hendicmgnet.blogspot.com'>About Me</a></li>
<li><ahref='http://hendicmgnet.blogspot.com'>Contact Me</a>
<ul>
<li><ahref='http://hendicmgnet.blogspot.com'>Google +</a></li>
<li><ahref='http://facebook.com'>Facebook</a></li>
<li><a href='http://hendicmgnet.blogspot.com'>Twitter</a></li>
</ul></li>
</ul>
</div>
8. Simpan Template.
Note: 
  • Sesuaikan kode #ff0000 (border bawah menubar), 1025px (lebar menubar), #000000 (background menubar).
  • Silahkan nama menubar yang berwarna biru Home sesuai dengan keinginan
  • Ganti link yang berwarna merah

Comments

Post a Comment

Popular posts from this blog

Contoh Format Surat Kesalahan Nama Pada Raport dengan Ijazah

Image
hai sob, pada postingan kali ini saya ingin membagikan contoh surat keslahan nama pada raport dengan ijazah PEMERINTAH KABUPATEN _____ UPT PENDIDIKAN ____ KEC. _________ SEKOLAH DASAR NEGERI ________ Alamat : Jl ____________________________________ “Terakreditasi : A” E-mail : _______________   SURAT KETERANGAN NOMOR : 421.1/122/SD/04/2016 Yang bertanda tangan dibawah ini, Kepala Sekolah SD N ..................................menerangkan bahwa : Nama Siswa                             : _________________________ No Induk Siswa                       : _________________________ Tempat dan Tanggal lahir        : _________________________ Nama Orang Tua                      : _________________________ Alamat                                                 : _________________________                                                 : Kecamatan _____ Kabupaten ___ Bahwa nama siswa yang tercantum di atas adalah benar-benar siswa SD N ......
Read more

CONTOH SOAL PENJAS KELAS X PENJAS MID SEMESTER K13

Image
SOAL UJIAN AKHIR SEMESTER GANJIL .......................................... TAHUN PELAJARAN 2014/2015   Mata Pelajaran           : Penjaskes                                          Hari/Tanggal : ................................................... Kelas                            : X.MIA /IIS                                          Nama Siswa    : ......................................................   I.          Berilah tanda silang (x) pada huruf a, b, c, d, atau e dengan jawaban yang paling benar! 1.       Senam lantai menekankan pada keindahan, kelincahan, kekuatan dan ............gerak tubuh. a.        Kelenturan                       c. Keuletan                  e. Kecepatan b.       Keinginan                         d. Keseimbangan 2.       Gerakan-gerakan dalam senam lantai dengan menggunakan alat adalah ....... a.        Lompat kangkang           c. Guling ke depan      e. Back extention b.       Flix-flax                            d
Read more

PROGRAM KERJA SENI MUSIK ANGGKLUNG

Image
PROGRAM KERJA SENI MUSIK ANGGKLUNG BAB I PENDAHULUAN 1.1. Dasar Pemikiran kreatifitas adalah bentuk luapan rasa atau jiwa yang dimiliki manusia. Kreatifitas ini adalah hasil dari suatu eksplorasi rasa akan momentum atau pengalaman individu seseorang. Olah rasa ini kemudian mengasah kepekaan manusia terhadap lingkungan dan dirinya. Kritik social, politik dan budaya adalah sebagian dari perwujudannya. Akan tetapi hakekat kreatifitas ini adalah sebuah anugrah sang pencipta yaitu daya cipta, sehingga selayaknyalah apabila kreatifitas kemudian dijadikan pula sebagai perwujudan rasa syukur manusia kepada sang pencipta. Sejalan dengan pemikiran tersebut, perlu ditingkatkan intensitas pembinaan kegiatan kesiswaan melalui ekstrakurikuler sebagai aktualisasi dan optimasi dari ilmu pengetahuan dan teknologi yang diperoleh siswa dari proses pembelajaran dalam berbagai mata pelajaran atau bidang studi. Proses kreatif atau inovasi merupakan sebuah kemampuan manusia untuk berke
Read more