Langung saja membuat tab multi widget di blog.

http://galeripopart.com/
  • Login ke blog kamu
  • Masuk template
  • Pilih Edit HTML
  • Cntr+F - cari tulisan </head> 
  • Letakkan kode ini di atasnya
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

http://galeripopart.com/


  • Klik simpan templated.
Selanjutnya kita beralih ke
  • Tata letak
  • Tambahkan widget
  • Pilih HTML/JavaScript
  • Masukkan kode ini
-----------------------------------------------------------------------------------
<style type="text/css">
        .blogtabs {padding: 0px !important;border: 0 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://ayriyzone.googlecode.com/files/SimpleTabViewJQuery.js"></script>

        <script type="text/javascript">

        $(document).ready(function() {
        $('#showtabs').simpleBlogTab ({organictabs: 3});
        });
        </script>

        <div id="showtabs"></div>
-----------------------------------------------------------------------------------

Ganti angkanya ({organictabs: 3}); sesuai banyak tap yang ini anda buat

simpan widget dan hasilnya sama seperti gambar di bawah ini. 


http://galeripopart.com/

Artikel Keren Lainnya
Di ambil dari berbagai sumber publikasi CA 
JANGAN LUPA SHARE YAH KLO BERMANFAAT :D
0 Komentar untuk "MEMBUAT MULTI WIDGET DI BLOG"

Note: only a member of this blog may post a comment.