Cara Paling mudah membuat Bar Menu di Blog

Assalamualaikum w.b.t



Orang nak edit blog, khaty pun nak buat. Tetapi kalau tidak mencuba pastinya tidak tahu erti kepayahan dan kesusahannya. Belajar belajar dan belajar. Sampai bila pun ilmu mengenai blog tetap banyak yang perlu di pelajari.

Baru cuba satu widget terbaru bagi khaty dan mungkin dah lama bagi anda semua. Susah juga sebab apabila nampak kod kod ja mata macam blurr sekejap. Maklumlah bukannya ada kemahiran pasal IT ni.

Cara membuat Menu Bar.

1. Log in ke dashboard
2. Pergi ke layout dan pilih add gadget
3. Pilih HTML/Javascript widget
4. Tinggalkan kosong di bahagian tajuk
5. Salin kod di bawah dan masukkan di bahagian jotak yang di sediakan

<style type="text/css">
.tabber {
 padding: 0px !important;
 border: 0 solid #bbb !important;
}
.tabber h2 {
 float: left;
 margin: 0 1px 0 0;
 font-size: 12px;
 padding: 3px 5px;
 border: 1px solid #bbb;
 margin-bottom: -1px; /*--Pull tab down 1px--*/
 overflow: hidden;
 position: relative;
 background: #e0e0e0;
 cursor:pointer;
}
html .tabber h2.active {
 background: #fff;
 border-bottom: 1px solid #fff; /*--"Connect" active tab to its content--*/
}
.tabber .widget-content {
 border: 1px solid #bbb;
 padding: 10px;
 background: #fff;
 clear:both;
 margin:0;
}
.codewidget, #codeholder {
 display:none;
}
</style>

<script type="text/javascript" src="http://www.khatyaiman.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<script type="text/javascript" src="http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bloggertabs0.1_min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
 $('#codeholder').bloggerTabber ({
  tabCount : 4
 });
});
</script>

<!-- to make sure the widget works, do not alter the code below -->
<div id='codeholder'><p>Get this <a href="http://www.bloggersentral.com/2011/05/create-tabbed-content-blogger-widgets.html" target="_blank">tabber widget</a></p></div>

tukar kepada URL blog anda dan pilih berapa jenis tab yang anda mahu.

Tarik kotak ke bahagian yang telah di senaraikan. 

Selepas itu simpan dan boleh preview.
credit to bloggersentral

 Inilah hasilnya..
Ini adalah salah satu cara yang khaty cuba dan bagi khaty memang ok. Jika anda dah buat tahniah ya. Biasalah, bila betul-betul fokus baru boleh nak buat kerja edit-mengedit. Jika ada kesilapan maafkan kan khaty ya. Sila komen untuk khaty menambah baik lagi blog. Selamat mencuba.

6 komen:

  1. good info tapi sya tak faham part ni "pilih berapa jenis tab yang anda mahu. Tarik kotak ke bahagian yang telah di senaraikan. " sorry.

    http://najwazahid94.blogspot.my/

    ReplyDelete
    Replies
    1. dekat layout atrik kotak tadi dekat bahagian yang najwa ingin buat..khaty baru masuk contoh bar menu yang khaty punya, baru di jadi..hehehe..buat banyak kali dan simpan sampai puas hati..khaty pun try banyak kali

      Delete
  2. Perkenalkan, saya dari tim kumpulbagi. Saya ingin tau, apakah kiranya anda berencana untuk mengoleksi files menggunakan hosting yang baru?
    Jika ya, silahkan kunjungi website ini www.kumpulbagi.com untuk info selengkapnya.

    Di sana anda bisa dengan bebas share dan mendowload foto-foto keluarga dan trip, music, video, filem dll dalam jumlah dan waktu yang tidak terbatas, setelah registrasi terlebih dahulu. Gratis :)

    ReplyDelete
  3. rajinnyer buat tutorial., hehe2

    ReplyDelete