Blog Tutorial

Tutorial Blog, Cheat Games, Tutorial Ponsel, Tutorial Komputer, Tutorial Browser

Kamis, 15 April 2010

Membuat 2 kolom Widget di atas Postingan

Kategori :
Setelah kemarin saya membahas tentang "Menaruh Widget di atas Postingan" kini saatnya Membuat dua kolom widget di atas Postingan. Hanya menggunakan kode css dan kode pemanggilnya yaitu HTML sobat sudah dapat dua kolom widget diatas postingan, trik ini tidak membuat blog sobat bertambah berat banyak namun kalau menaruh widget yang berlebihan maka akan bertambah berat jadi saya sarankan agar menaruh widget yang penting saja jangan widget yang tidak terlalu penting di masukan ke dalamnya.

Sekarang mari kita kelangkah pembuatannya :
  1. Loggin ke blogger
  2. masuk ke Tata letak => Edit HTML
  3. cari kode ]]></b:skin> lalu taruh kode di bawah ini tepat diatasnya

    .widget-atas-post {
    margin:15px 0px 10px 0px;
    padding:5px 0;
    clear:both;
    }

    .widget-atas-post-kiri {
    float:left;
    width:49%;
    margin-right:15px;
    }

    .widget-atas-post-kanan {
    float:right;
    width:49%;
    }



  4. setelah membuat kode css-nya sekarang kita buat kode pemanggilnya yaitu HTML
  5. cari kode <div id='main-wrapper'> lalu taruh kode di bawah ini tepat di bawahnya

    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='widget-atas-post'>
    <div class='widget-atas-post-kiri'>
    Taruh kode widget disini
    </div>
    <div class='widget-atas-post-kanan'>
    Taruh kode widget disini
    </div>
    </div>
    </b:if>



  6. Setelah itu sobat bisa menyimpannya dan melihat hasilnya
  7. Selesai

Bagaimana? mudah bukan cara mebuatnya? di atas hanya contoh saja untuk cara Membuat dua kolom Widget di atas postingan. kalau ada pertanyaan tentang trik ini sobat bisa tinggalkan pesan di bawah ini tepatnya di kotak komentar ini, saya pergi dulu y. Terima kasih dan Happy Blogging :)).
Bagikan Artikel : Facebook Twitter Google+ Linkedin Technorati Digg

33 Komentar untuk Membuat 2 kolom Widget di atas Postingan

nanti saya coba utak atik sendiri lah :)

mantap sob artikel membuat widget dua kolom di atas posting..

yup mantaff buat nambah kolom lagi...

Hmmm Tri yang bagus mass... Tx yaw

oke bnget xml nya,trims :4:

salam sobat, salam kenal, kunjungan pertama
triknya oke-oke banget, sesuai namanya mas,oke trik...

trik oke..heheheh

sama-sama sob ^_^

sipppp daaaahh

TUTORIAL APA INI!!!!!! :@

Tulisan "Taruh kode widget disini" yang berwarna merah kode widget yang mana? mohon diperjelas

@Dede Rachman => untuk tulisan itu maksudnya, tulisan itu adalah tempat untuk menaruh widget yang ingin di tampilkan di kolom widget di atas post, misalnya kalau anda ingin menaruh widget buku tamu, tinggal hapus tulisan itu lalu taruh kode buku tamu di sana. Terima kasih ^_^

@Remba => Tutorial untuk membuat 2 kolom widget di atas post sob. maaaf kalau sulit di mengerti, maklum saya hanya seorang manusia ^_^

yup thankz bnyak yg bermanfaat dsini bwt newbie sperti saya, pisaran aja tiap trik untuk disertakan gambara hasil dari penggunaan/penambahan code skrip yg dilakukan trhadap blog, ok sekali lgi trims berat.

@Andi lala >> sama-sama sob, makasih juga nich atas masukannya...

sebenarnya sebagian tutorial ada yang di tampilkan screenshout di akhir postnya tapi ada juga yang tidak, untuk kedepannya akan saya perbaiki sob....

Salam kenal Om....

mau tanya gan, ditemplate saya ga ada main wrapernya nya

from psychomputer

klo g ada coba cari main saja, mudah2an aja ketemu. setiap template kodenya berbeda beda jadi sulit untuk memodifikasi sendiri tanpa mengetahui seluk beluk kode template.

Bisa nggak di template minima ya bos...

thx saya coba gan, btw tukeran link yuk..

mas kok saya jadinya ada yang widget nya di dalem postingan semua, dan satu diatas dan satu di bawah, trus parahnya lagi judulnya juga ada diatas widget itu gimana atasinnya yah mas ?

test---test........., kalo membuat
1 kolom + 2 kolom di bawah postingan kaya yang di atas caranya gimana ya............???

kok bisa? kesulitannya dmn ya? bisa saya bantu?

gan mo saran aja nee ......lebih bagus dikasi contoh gambar sesudah dan sebelum nya deh biar tambah wokeh

Nice share.... thanks...

keren bro
visit me back :)
http://blogsfiw.blogspot.com/

oke banget gan, tapi cara ini cara manual, karena widget gak muncul di element, tambahin juga dong cara otomatisnya, makasih

ok bagus bung....pi gemana cara ngapus dua elemen gadget di atas postingan....soalnya punya gw mau di apus pi gx ngerti caranya.

oke gan mantap......... thank's n salam kenal...

tutornya ini langsung menambahkan kedalam template ya mas, dan kolomnya tidak muncul di Tata Letak?

makasih mas caranya, salam blogger dari wonogiri

thanks for the information...

saya lihat dulu hasilnya kayak gimana ya..