Senin, 02 Juli 2012

Cara Mudah Membuat Tab Menu Blog

Selamat Siang Smua...Kesempatan kali ini Helriz IT akan berbagi pengetahuan mengenai Cara membuat Tab Menu Di Bawah Header Blog. Bagi rekan blogger yang menggunakan template yang belum difasilitasi dengan menu horisontal dibawah header pada blognya, berikut saya postkan bagaimana cara membuat menu tersebut. Fungsi dan kegunaan menu ini adalah agar memudahkan kita dalam menelusuri  semua isi yang terkandung didalam blog tersebut.


Langkah Membuat Tab Menu di Bawah Header Blog (Judul Blog)  

  • Cari kode yang mirip dengan di bawah ini di Tata Letak > Edit HTML >Expand Widget Template                                                                                                                                                                                                                                                                                                                              
    <b:section class='crosscol' id='crosscol' showaddelement='no'>
    <b:widget id='HTML1' locked='false' title='' type='HTML'/>
    </b:section>
    </div>
            
  • Anda ubah kode showaddelement='no' menjadi  showaddelement='yes' , kalau sudah jangan disimpan dulu.
  • Masih di Tata Letak > Edit HTML , cari kode </b:skin> , agar mudah gunakan tombol CTRL+F 
    Copy kode dibawah ini dan letakan tepat diatas kode  </b:skin> kemudian simpan.
    a.navigation {
    background: #3333ff ;
    color: #ffffff;
    margin: 1px;
    padding: 2px;
    border-width: 0;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: bold;
    }
    a.navigation:hover {
    background: #333333;
    color: #ffffff;
    text-decoration: none;
    } 
    *Perhatikan kode yang berwarna biru adalah warna tombol dan efek hover dan bisa dirubah sesuka hati Anda. Dan yang berwarna merah adalah jarak antara tombol satu dengan lainnya, silahkan Anda sesuaikan sesuai selera.
    Setelah langkah di atas, sekarang kita lanjut lagi ke : klik Page elements / Elemen Laman > Tambah Gadget > HTML/Javascript , copy kode dibawah ini,simpan dan letakan tepat dibawah header.


    <a href="http://www.helryzprata.co.cc " class="navigation">HOME</a>
    <a href="http://www.helryzprata.co.cc " class="navigation">CONTACT</a>
    <a href="http://www.helryzprata.co.cc " class="navigation">BUKU TAMU</a>
    <a href="http://www.helryzprata.co.cc " class="navigation">FACEBOOK</a>
    <a href="http://www.helryzprata.co.cc " class="navigation">TWITER</a>
    <a href="http://www.helryzprata.co.cc " class="navigation">DOWNLOAD</a>
    <a href="http://www.helryzprata.co.cc " class="navigation">LAIN-LAIN</a>
    <a href="http://www.helryzprata.co.cc " class="navigation">CHATTING</a>

    Itulah sedikit Cara membuat Tab Menu Blog, semoga bermanfaat.
    Join This Site Gan..

0 komentar:

Posting Komentar

Recent Comments

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Powerade Coupons