November 16, 2010   Blog Lebih Keren , Menu , Page , Widget

MEMBUAT MENU TABVIEW KEREN DI BLOG "TANPA EDIT HTML"

1. Sign In di Blogger  2. Klik Menu Rancangan 3. Klik Menu Tambah Gadget 4. Klik Menu HTML Java/Script 5. dan Copy dan Pastekan Script di Ba...

1. Sign In di Blogger 

2. Klik Menu Rancangan

3. Klik Menu Tambah Gadget

4. Klik Menu HTML Java/Script

5. dan Copy dan Pastekan Script di Bawah Ini di HTML Java/Scriptmu:

<style type='text/css'>
/* tabqrachmath.co.cc */
div.Tabateonsoft div.TFs
{height: 30px; overflow: hidden;}
div.Tabateonsoft div.TFs a
{float: left; display: block; text-align: center; text-decoration: none; font: normal 12px arial; padding:3px 5px 3px 3px; margin:0 5px 0 0;
background:#f0f0f0;
color: #333;
border-top:1px solid #CCCCCC;
border-right:1px solid #999999;
border-bottom:1px solid #999999;
border-left:1px solid #cccccc;
-moz-border-radius: 0px 0px 15px 0px;
}
div.Tabateonsoft div.TFs a:hover
{ background: #E8E8E8;
font-weight: bolder;
text-shadow: 4px 4px 4px #f8f8ff;
border-top:1px solid #999999;
border-right:1px solid #cccccc;
border-bottom:1px solid #cccccc;
border-left:1px solid #999999;}
div.Tabateonsoft div.TFs a.Active
{ background: #E8E8E8;
color: #000000;
border-top:1px solid #999999;
border-right:1px solid #cccccc;
border-bottom:1px solid #cccccc;
border-left:1px solid #999999; font-weight:bold;}
div.Tabateonsoft div.Pages
{ clear: both; overflow: hidden; height:240px; border:2px dashed #000; padding:2px;background: #ffffff; -moz-border-radius-topleft: 15px; -moz-border-radius-topright: 0px; -moz-border-radius-bottomright: 15px; -moz-border-radius-bottomleft: 0px; -webkit-border-top-left-radius: 15px; -webkit-border-top-right-radius: 0px; -webkit-border-bottom-left-radius: 0px; -webkit-border-bottom-right-radius: 15px;}
div.Tabateonsoft div.Pages div.Page
{height: 100%;padding: 0px; overflow: hidden; }
div.Tabateonsoft div.Pages div.Page div.floor
{ font-size:12px;padding: 5px 5px; text-align:left;}
</style>
<script style='text/javascript'>var pageCount=5;var displayPageNum=5;var upPageWord="Sebelumnya";var downPageWord="Selanjutnya";</script>
<script style='text/javascript' src='http://ayomaju.com/friendsharingfile/ateonsoft_tab.js'></script>

<form action="tabateonsoft.html" method="get">
<div class="Tabateonsoft" id="Tabateonsoft">
<div class="TFs">
<a>Tab 1</a>
<a>Tab 2</a>
<a>Tab 3</a>
<a>Tab 4</a>
</div>
<div class="Pages">
<div class="Page"><!-- Tab -->
<div class="floor">
Tulisanmu Untuk Tab 1
</div>
</div><!-- end Tab -->
<div class="Page"><!-- Tab -->
<div class="floor">
Tulisanmu Untuk Tab 2
</div>
</div><!-- end Tab -->
<div class="Page"><!-- Tab -->
<div class="floor">
Tulisanmu Untuk Tab 3
</div>
</div><!-- end Tab -->
<div class="Page"><!-- Tab -->
<div class="floor">
Tulisanmu Untuk Tab 4
</div>
</div><!-- end Tab -->
</div>
</div>
</form>
<script type="text/javascript">tabateonsoft_name('Tabateonsoft');</script>

6. Ganti Nama Tabmu di Tab 1, 2, 3 dan 4
7. dan Ganti Tulisanmu Untuk Tab 1, 2, 3 dan 4 dengan Isi dari Tab Tersebut

8. Simpan dan Selesai