MEMBAGI SATU WIDGED MENJADI BEBERAPA KOLOM

MEMBUAT  1 WIDGED MENJADI 4 KOLOM

bagi widget jadi 4kolom


Pada tutorial kali ini saya akan memaparkan bagaimana cara mendapatkan 1 widget, tetapi dapat di bagi menjadi 4 kolom..
untuk lebih jelasnya, perhatikan bagian kiri pada blog saya,,,,. disitu nampak ada 4 kolom dalam 1 widged, dimana nampak kolom berita, link, profil, dan sms gratis..

Bagaimana cara membuatnya?
Sebenarnya gampang, kita dapat menyatukan beberapa widged menjadi satu widged aja, ini berfungsi selain menjadikan penampilan blog kita menjadi rapi, juga membuat blog kita lama loadingnya...

Berikut cara kerjanya...

    1. Silakan Login ke blog sobat
      2. Masuk ke tab Perancangan lalu pilih edit HTML
        3. Seperti biasa centang "Expand widget templates" untuk menghindaran apabila terjadi kesalahan.

        4. Silahkan cari kode ]]></b:skin> Tekan CTRL+F untuk mengeluarkan kotak pencarian
        5. Setelah ketemu kode diatas silahkan letakkan kode dibawah ini di atas kode ]]></b:skin>



        /* tab model 2 ateonsoft.com */
        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;letter-spacing:-0.07em;
        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-bottomright: 10px; -moz-border-radius-topright: 0px;
        }
        div.Tabateonsoft div.TFs a:hover
        { background: #E8E8E8;
        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: #333;
        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; color: #ffffff;}
        div.Tabateonsoft div.Pages
        { clear: both; overflow: hidden; height:333px; border:1px solid #EFF0F1; padding:0;background: #222222; -moz-border-radius:5px;}
        div.Tabateonsoft div.Pages div.Page
        {height: 100%;padding: 0px; overflow: hidden; }
        div.Tabateonsoft div.Pages div.Page div.floor
        { font-size:12px;padding: 3px 5px; text-align:left;}


        6. Selanjutnya cari kode </head> jika udah ketemu, proses selanjutnya adalah, letakan kode di bawah ini diatas kode </head>


        <script src='http://zuazz.googlecode.com/files/ateonsoft_tab.js' type='text/javascript'/>



        7. Save template
        8. Masuk ke tab Elemen laman
        9. Tambahkan widget HTML/JavaScript
        10. Silakan letakkan kode di bawah ini di dalam widget HTML/JavaScript

        <form action="tabateonsoft.html" method="get">
        <div class="Tabateonsoft" id="Tabateonsoft">
        <div class="TFs">
        <a>tab1</a>
        <a>tab2</a>
        <a>tab3</a>
        <a>tab4</a>
        </div>
        <div class="Pages">
        <div class="Page"><!-- Tab -->
        <div class="floor">
        Disini letakkan kode untuk tab 1 anda
        </div>
        </div><!-- end Tab -->
        <div class="Page"><!-- Tab -->
        Disini letakkan kode untuk tab 2 anda
        </div><!-- end Tab -->
        <div class="Page"><!-- Tab -->
        <div class="floor">
        Disini letakkan kode untuk tab 3 anda
        </div>
        </div><!-- end Tab -->
        <div class="Page"><!-- Tab -->
        <div class="floor">
        Disini letakkan kode untuk tab 4 anda
        </div>
        </div><!-- end Tab -->
        </div>
        </div>
        </form>
        <script type="text/javascript">tabateonsoft_name('Tabateonsoft');</script> 


        KETERANGAN
        1. Untuk kode yang di masukan pada html, jika anda mau merubahnya sesuai keinginan sendiri, maka anda dapat merubah kode yang berwarna bitu, dimana tab 1 dapat anda rubah dengan judul widged yang akan anda pasang, begitu pula tab2 dan seterusnya
        2. Untuk kode berwarna biru yang berjudul " disini letakan kode untuk tab 1,2,3,dan 4 dapat di letakan kode html dari widged yang ingin anda letakan...
        SAVE DAN LIHAT HASILNYA..


        SLIMING CAPSUL
        Suplement pelangsing terbaik. Lulus Standard GMP (Good Manufacturing Practice) dan uji tes SGS. Pesan sekarang Juga!!!
        sikkahoder.blogspot
        ABE CELL
        (Jamu Tetes)Mengatasi diabetes, hypertensi, kanker payudara, mengurangi resiko stroke, meningkatkan fungsi otak, dll.
        sikkahoder.blogspot
        MASKER JERAWAT
        Theraskin Acne Mask (Masker bentuk pasta untuk kulit berjerawat). Untuk membantu mengeringkan jerawat.
        sikkahoder.blogspot
        ADHA EKONOMIS
        Melindungi kulit terhadap efek buruk sinar matahari, menjadikan kulit tampak lenih cerah dan menyamarkan noda hitam di wajah.
        sikkahoder.blogspot
        BIO GLOKUL
        Khusus dari tanaman obat pilihan untuk penderita kencing manis (Diabetes) sehingga dapat membantu menstabilkan gula darah
        sikkahoder.blogspot


        ADVERTISE HERE Ads by Sikkahoder
        Body Whitening
        Mengandung vit C+E, AHA, Pelembab, SPF 30, Fragrance, n Solk Protein yang memutihkan kulit secara bertahap dan PERMANEN!!
        Sikkahoder.blogspot
        PENYEDOT KOMEDO
        Dengan alat ini, tidak perlu lg memencet hidung, atau bagian wajah lainnya untuk mengeluarkan komedo.
        Sikkahoder.blogspot
        Obat Keputihan
        Crystal-X adalah produk dari bahan-bahan alami yang mengandung Sulfur, Antiseptik, Minyak Vinieill. Membersihkan alat reproduksi wanita hingga kedalam.
        Sikkahoder.blogspot
        DAWASIR
        Obat herbal yang diramu khusus bagi penderita Wasir (Ambeien), juga bermanfaat untuk melancarkan buang air besar dan mengurangi peradangan pada pembuluh darah anus
        Sikkahoder.blogspot
        TERMOMETER DIGITAL
        Termometer digital dengan suara Beep. Mudah digunakan, gampang dibaca dengan display LCD dan suara beep ketika selesai mendeteksi suhu.
        Sikkahoder.blogspot


        ADVERTISE HERE Ads by Sikkahoder