Senin, 14 Februari 2011

Membuat Navigasi Menu Seperti Taskbar Windows

Anda pasti sudah pernah mencoba atau melihat taskbar milik windows kan?jika belum,silahkan lihat dulu di komputer teman atau saudara anda,nah pada tutorial ini saya sedikit share bagaimana cara mengubah tampilan navigasi menu diblog kita seperti layaknya taskbar milik windows,memang terdengar aneh atau anda tidak suka dengan ini,daripada milik anda yang saat ini digunakan.Pada dasarnya kita hanya mengubah gambarnya saja,background daripada navigasi tersebut,hal ini saya temukan saat saya berpikir untuk merubah tampilan blog saya agar lain dari blog - blog yang baik navigasinya.saya hanya bermain - main dengan aplikasi Photoshop CS5 yang saya miliki untuk membuat taskbar seperti milik windows,dan hasilnya saya coba terapkan diblog saya untuk dijadikan navigasi menu,intinya kita seperti sedang menggunakan komputer kita (Offline).
nah,daripada panjang lebar,ayo kita mulai bekerja untuk membuatnya,alangkah baiknya jika anda sudah memiliki gambarnya terlebih dahulu,tapi jangan kuwatir,di tutorial ini saya akan berikan gambarnya ataupun membuatnya (Ukuran terserah anda).

  • Pertama anda harus Login dengan akun Blogger anda
  • Setelah Login anda masuk ke bagian Rancangan > Edit HTML.
  • Cari kode seperti berikut.

    #foxmenucontainer{
    height:40px;
    display:show;
    margin:0px auto;
    font-size: 12px;
    text-transform:uppercase;
    background:url(Letakkan URL gambar anda disini) no-repeat;

    }
    #menu{
    margin:0px auto;
    paddiang: 0px;
    heaaaight:40px;
    overflow:hidden;
    width:990px;
    }

    #menu ul {
    float: left;
    list-style: none;
    margin: 0px;
    padding: 0px;
    }
    Apabila tidak tersedia di blog anda,coba cari kode yang membentuk navigasi menu anda (setiap template berbeda fungsi HTMLnya).
  • Kemudian,Letakkan URL gambar anda di bagian kode yang saya beri warna biru

    background:url(Letakkan URL gambar anda disini) no-repeat;
  • Jika sudah,Simpan template anda dan lihat hasilnya.
Cukup simpel memang,cara ini saya yang mencoba sendiri dan memahami koding web programming,walaupun saya bukan master-nya tetapi saya ingin seperti mereka para master programming,sekian dahulu dari saya,berilah komentar pada karya saya.
NB : Jika anda ingin dibuatkan gambar,anda cukup berkomentar dibawah berikut alamat email anda untuk mengirim gambar.
Terimakasih atas kunjungannya. Keep Blogging !!!

4 comment:

♕ K I N G z ♛ mengatakan...

SAlam Insav
blognya Bagus
mohon kunjungannya balik
http://insav-xp.blogspot.com/

╚══█▓▒╣Cyberfrogteam╠▒▓█══╝ mengatakan...

hadir..!!
di tunggu kunjungannya bos

Alven_maretinus mengatakan...

bantu aku dong
email alven_maretinus@yahoo.com

Muhammad Harun Al Rasyid mengatakan...

Gimana Tuh Maksudnya : Gue carinya cara buat taskbar seperti window 8 di blogger

Kunjungi balik ya bro http://www.Venus-5.blogspot.com

Posting Komentar