Membuat Gadget/Widget Menu Tab Blogger (Blogspot)

Gadget/Widget Tab Blogger (Blogspot) sangat berguna untuk mempercantik tampilan blog yaitu untuk menyatukan tata letak beberapa gadget/widget menjadi satu lokasi dengan navigasi menu tab horizontal.

Hal ini dapat meringkas tampilan beberapa gadget/widget blog/website menjadi satu gadget/widget dengan menu tab horizontal.

Berikut ialah langkah-langkah membuat gadget/widget menu tab blogger (blogspot) :

  1. Buka dashboard blogger (blogspot).
  2. Pilih menu tata letak (layout).
  3. Buat gadget/widget html baru dan letakkan di atas gadget/widget yang akan disembunyikan/diringkas dalam menu tab.
  4. Masukkan kode berikut pada gadget/widget html yang baru dibuat :<style type='text/css'>.tabber{padding:0!important;border:0 solid #bbb}.tabber h2{float:left;margin:0 1px 0 0;font-size:12px;padding:3px 5px;border:1px solid #bbb;margin-bottom:-1px;overflow:hidden;position:relative;background:#f5f5f5;cursor:pointer;-moz-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0}html .tabber h2.active{background:transparent;border-bottom:1px solid #bbb}.tabber .widget-content{padding:10px;background:transparent;clear:both;margin:0}.codewidget,#codeholder{display:none}</style><script src='//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'/><script src='http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bloggertabs0.1_min.js' type='text/javascript'/><script type="text/javascript">$(document).ready(function(){$("#codeholder").bloggerTabber({tabCount:2})});</script><div id='codeholder'><p>Get this <a href="http://www.bloggersentral.com/2011/05/create-tabbed-content-blogger-widgets.html" target="_blank">widget</a></p></div>
  5. Sesuaikan jumlah widget yang akan disembunyikan dengan merubah angka tabCount pada kode yang berwarna kuning di atas.
  6. Klik simpan (save).
  7. Muat halaman blog/website.
  8. Selesai.
Letak kode gadget/widget menu tab di atas gadget/widget yang akan disembunyikan/diringkas
Hasil Akhir Menu Tab

Komentar

Postingan populer dari blog ini

Menampilkan File Google Drive Pada Blog / Website

Membuat Tombol Kembali Ke Atas Melayang di Pojok Kanan Bawah Blogger (Blogspot)

Membuat Judul Halaman Blog Dinamis Blogger (Blogspot) Untuk Optimasi Mesin Pencarian