Tuesday 22 April 2014

CARA MEMBUAT MENU TAB VIEW OTOMATIS TANPA EDIT HTML

selain tanpa edit html/ templates serta pengisiannya masing-masing menu tabview menggunakan 1 widget. Sangat mudah sekali dalam pengeditan isi menu tab view dan cocok untuk orang awam sekalipun seperti saya :D

Jadi anda cukup menambahkan widget html, dan meng copy kode menu tabview. Nantinya 3 widget dibawah widget tabview tersebut akan menjadi isi dari menu tabview. Logikanya seperti gambar berikut.

menu tabview tanpa edit html

Cara Membuat Menu Tab View Otomatis tanpa Edit HTML

1. Login ke akun blogger
2. masuk menu Tata letak
3. tambahkan gadget > HTML/JavaScript
4. Copy kode berikut
<style type="text/css">
.blogtabs {padding: 0px !important;border: 1px solid #bbb;}
.blogtabs h2 {float: left;margin: 0 2px 4px 0;font-size: 12px;padding: 3px 5px;border: 1px solid #bbb;overflow: hidden;position: relative;background: #e0e0e0;cursor:pointer;}html .blogtabs h2.active {background: #fff;}.blogtabs .widget-content {border: 1px solid #bbb;padding: 10px;background: #fff;clear:both;margin:0;}.btab, #showtabs {display:none;}</style><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script><script type="text/javascript" src="http://bloggergubug.googlecode.com/files/tabviewjquery.js"></script><script type="text/javascript">$(document).ready(function() {$('#showtabs').simpleBlogTab ({organictabs: 3});});</script><div id="showtabs"></div>
4. Simpan tanpa diberi judul


Untuk jumlah tab bisa disesuaikan, ganti angka yang berwarna merah dan untuk style nya silahkan sesuaikan dengan keinginan anda. Ok selamat mencoba Membuat Menu Tab View Otomatis  ;)

selain tanpa edit html/ templates serta pengisiannya masing-masing menu tabview menggunakan 1 widget. Sangat mudah sekali dalam pengeditan isi menu tab view dan cocok untuk orang awam sekalipun seperti saya :D

Jadi anda cukup menambahkan widget html, dan meng copy kode menu tabview. Nantinya 3 widget dibawah widget tabview tersebut akan menjadi isi dari menu tabview. Logikanya seperti gambar berikut.
menu tabview tanpa edit html

Cara Membuat Menu Tab View Otomatis tanpa Edit HTML

1. Login ke akun blogger
2. masuk menu Tata letak
3. tambahkan gadget > HTML/JavaScript
4. Copy kode berikut
<style type="text/css">
.blogtabs {padding: 0px !important;border: 1px solid #bbb;}
.blogtabs h2 {float: left;margin: 0 2px 4px 0;font-size: 12px;padding: 3px 5px;border: 1px solid #bbb;overflow: hidden;position: relative;background: #e0e0e0;cursor:pointer;}html .blogtabs h2.active {background: #fff;}.blogtabs .widget-content {border: 1px solid #bbb;padding: 10px;background: #fff;clear:both;margin:0;}.btab, #showtabs {display:none;}</style><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script><script type="text/javascript" src="http://bloggergubug.googlecode.com/files/tabviewjquery.js"></script><script type="text/javascript">$(document).ready(function() {$('#showtabs').simpleBlogTab ({organictabs: 3});});</script><div id="showtabs"></div>
4. Simpan tanpa diberi judul


Untuk jumlah tab bisa disesuaikan, ganti angka yang berwarna merah dan untuk style nya silahkan sesuaikan dengan keinginan anda. SELAMAT MENCOBA.

No comments:

Post a Comment