Cara Membuat Menu Horizontal Tabs di Blogspot

saya akan berbagi Cara Membuat Menu Horizontal untuk Blogger/Blogspot.Cara Membuat menu horizontal ini sangat mudah dan berbasis tab individual, dan tidak menggunakan list (HTML unordered list).

Langsung saja inilah Tutorial blog bagi para sobat untuk Cara Membuat menu horizontal pada blogger/blogspot:

1.Login ke dasbor blog milik sobat
2.Klik Template-Edit HTML dan centang Expand Template Widget
3.Copy kode CSS dibawah ini dan letakkan kode tersebut tepat diatas kode ]]></b:skin>

/* Navigasi tabs Sederhana darmanto.com Starts */
a.darmantotabs, a.darmantotabs:link, a.darmantotabs:visited {display:block; width:102px; height:30px; background:#444444; border:1px solid #ebebeb; margin-top:2px; text-align:center; text-decoration:none; font-family:arial, sans-serif; font-size:12px; font-weight:bold;color:#FFFFFF; line-height:25px; overflow:hidden; float:left;}
a.darmantotabs:hover {color:#FFFFFF; background:#666666;}
#darmantobar {width:auto; margin:0 auto;}
/* Navigasi tabs Sederhana Ends */

4.Klik Simpan.

Setelah memasukkan kode CSS pada template blog milik sobat,buka Tata Letak,Tambah Gadget dan pilih HTML/JavaScript.
Copy dan paste kan kode dibawah ini pada kolom HTML/Javascript:

<!-- Navigasi tabs Sederhana http://www.darmanto.com Starts -->
<div id='darmantobar'>
<a href="#" class="darmantotabs">Home</a>
<a href="#" class="darmantotabs">About</a>
<a href="#" class="darmantotabs">Blog Tips</a>
<a href="#" class="darmantotabs">SEO Tips</a>
<a href="#" class="darmantotabs">Contact</a>
<a href="#" class="darmantotabs">Sitemap</a>
<a href="#" class="darmantotabs">Advertise</a>
</div>
<!-- Navigasi tabs Sederhana Ends -->

Setelah itu Simpan.

Keterangan Cara mengisi Menu Horizontal

-Ganti # dengan URL yang dikehendaki. Ganti juga Home,About, Blog Tips, SEO Tips, dan seterusnya dengan anchor text/judul menu tabs yang diinginkan. Untuk menambah atau mengurangi tab, copy/tambahkan atau hapus bagian <a href="#" class="darmantotabs">Anchor Text</a> di atas </div>.

- Drag/geser widget menu horizontal tersebut ke bawah/atas header (letakkan pada slot gadget) dan simpan lagi. 

OK sobat semua,semoga Tutorial Blog pada catatan kali ini mengenai Cara Membuat Menu Horizontal di Blogspot/blogger berhasil sobat praktekkan.Bila ada yang masih bingung silahkan sampaikan pada kolom komentar.

Cara Mengubah Tampilan Kursor Mouse Pada Blog

Mengubah Tampilan Kursor Mouse Pada Blog adalah salah satu cara untuk memperindah dan mempercantik blog, mungkin sobat bosan dengan tampilan standard maka dapat diganti dengan tampilan yang unik-unik dari http://totallyfreecursors.com/ ini,

Ok, langsung saja mari ke cara untuk mengubahnya :

1. Masuk ke Blogger
2. Pilih Template → Edit HTML
3. Cari kode </head>
4. Tempatkan kode dibawah ini diatas </head>

<style type='text/css'>
body{cursor: url(&quot;http://downloads.totallyfreecursors.com/thumbnails/pandaloveu.gif&quot;), auto;}
body a:hover{cursor: url(&quot;http://downloads.totallyfreecursors.com/thumbnails/pandaloveu.gif&quot;), auto;}
</style>

5. Simpan template
6. Lihat hasilnya

Keterangan :
Kode yang berwarna merah adalah kursor mouse yang akan ditampilkan, bila bosan sobat dapat mengganti tampilan kursor mouse yang lain, caranya ganti kode yang berwarna Hijau tersebut dengan yang dibawah ini :

*.Panda Love U → http://downloads.totallyfreecursors.com/thumbnails/apple-tmani.gif
* Apple → http://downloads.totallyfreecursors.com/thumbnails/apple-tmani.gif
* Smiley Bounce → http://downloads.totallyfreecursors.com/thumbnails/bounce.gif
* Spongebob → http://downloads.totallyfreecursors.com/thumbnails/unavail145.gif
* Bloming Red Rose → http://downloads.totallyfreecursors.com/thumbnails/BloomingRedRose.gif
* All In Love → http://downloads.totallyfreecursors.com/thumbnails/AllInLove.gif
* BMW → http://downloads.totallyfreecursors.com/thumbnails/BMW.gif
*  Black Glitter Pointer → http://downloads.totallyfreecursors.com/thumbnails/blackglitter.gif
* Guitar Green Blue → http://downloads.totallyfreecursors.com/thumbnails/GuitarGreenBlue.gif
* Tail-Heart → http://downloads.totallyfreecursors.com/thumbnails/hearttailup.gif

Cara Memasang Musik MP3 di Blog

Berbagai macam widget dan gadget dapat dipasang di blog. Mulai dari Musik, MP3, Radio Online, Chat Box, Widget Melayang, Kalender, Animation, Game dan lain sebagainya. Pemasangan beberapa gadget tadi tergantung dengan kebutuhan pemilik blog.

Untuk anda pengguna blog dengan menggunakan blogger/blogspot, semua widget dapat dipasang dengan mudah. kali ini saya akan membahas bagaimana Cara Memasang Widget Musik MP3 di Blogger. Banyak yang telah mengetahui cara pemasangan musik yang autoplay ini, karena hanya dengan menambahkan script HTML/Javascript sederhana.

Cara Memasang Widget Music / MP3 di Blog :
1. Login ke Blogger

2. Pilih blog anda yang ingin dipasang gadget MP3.
3. Klik Layout, lalu pilih Add a Gadget / Tambah Gadget pada elemen blog Anda.
          Disini anda dapat meletakkannya sesuai dengan keinginan. Bisa diletakkan di sidebar sebelah kanan.
4. Pilih HTML / Javascript.
5. Masukkan kode musik MP3 yang dapat anda cari di :
    Gadget Musik MP3 Blogger
6. Anda juga dapat menggunakan kode lagu di bawah ini jika anda menyukainya. ( Contoh Script )

• Avril Lavigne - Girlfriend
  
                  <center>
  <a href="http://divine-music.info" target="_blank"><img src="http://divine-music.info/images/dmmusicbar.gif" border="0" alt="Free Music Online"></a><br>
  <a href="http://divine-music.info" target="_blank"><img src="http://divine-music.info/images/dmlogo.gif" border="0" alt="Free Music Online"></a>
  <br><br><b>
  <a target="_blank" title="Free Music" href="http://www.divine-music.info">free music</a> at divine-music.info</b><br>
  <EMBED SRC="http://divine-music.info/musicfiles/avril lavigne - girlfriend.swf" AUTOSTART="TRUE" LOOP="TRUE" WIDTH="1" HEIGHT="1" ALIGN="CENTER"></EMBED>
  
  
                      
• Maroon 5 - Makes Me Wonder
  
                  <center>
  <a href="http://divine-music.info" target="_blank"><img src="http://divine-music.info/images/dmmusicbar.gif" border="0" alt="Free Music Online"></a><br>
  <a href="http://divine-music.info" target="_blank"><img src="http://divine-music.info/images/dmlogo.gif" border="0" alt="Free Music Online"></a>
  <br><br><b>
  <a target="_blank" title="Free Music" href="http://www.divine-music.info">free music</a> at divine-music.info</b><br>
  <EMBED SRC="http://divine-music.info/musicfiles/Maroon 5-Makes Me Wonder.swf" AUTOSTART="TRUE" LOOP="TRUE" WIDTH="1" HEIGHT="1" ALIGN="CENTER"></EMBED>
  
  
                      Dengan menambahkan widget mp3 musik ini, pengunjung dapat mendengarkan lagu dengan asyik. Tetapi, tidak semua orang menyukai lagu yang anda pasang. Tentu sangat mudah, untuk memasang musik mp3 di blogger untuk wordpress dapat menambahkan plugins yang ada. Semoga Bermanfaat :)