Belajar Linux

Monday, April 9, 2012

Cara Membuat 3 Kolom Di Bawah Header

Cara Membuat 3 Kolom Di Bawah Header. Artikel kali ini kita akan membahas sedikit cara memodifikasi blog yaitu Cara Membuat 3 Kolom Di Bawah Header. Biasanya 3 kolom ini digunakan sebagai space iklan. Selain digunakan sebagai space iklan, 3 kolom ini juga bisa digunakan sebagai daftar artikel, daftar link dan sebagainya. Nah langsung aja yuk kita cari tau Cara Membuat atau Menambah 3 Kolom Di Bawah Header  :
  1. Masuk ke akun bloggger anda.
  2. Klik Layout/Template (New) > Klik Edit HTML.
  3. Beri tanda centang pada Expand Widget Template.
  4. Sekarang Cari kode ]]></b:skin>.
  5. Setelah ketemu Copas dan letakan kode berikut diatas kode ]]></b:skin>.

  6. <div id="box3" style="float: left; margin: 0; text-align: left; width: 35%;"> <b:section class="box-widget" id="col3" preferred="yes" style="float: left;"> </b:section></div>

  7. Selanjutnya Cari kode <div id='main-wrapper'> atau <div id="main-outer">
  8. Copas kode dibawah ini dan letakan diatas salah satu kode <div id='main-wrapper'> atau <div id="main-outer">.

  9. <div id='box-kolom-widget'> <div id='box1' style='width: 35%; float: left; margin:0; text-align: left;'> <b:section class='box-widget' id='col1' preferred='yes' style='float:left;'/> </div> <div id='box2' style='width: 30%; float: left; margin:0; text-align: left;'> <b:section class='box-widget' id='col2' preferred='yes' style='float:left;'/> </div> <div id='box3' style='width: 35%; float: left; margin:0; text-align: left;'> <b:section class='box-widget' id='col3' preferred='yes' style='float:left;'/> </div> <div style='clear:both;'/> </div>

  10. Langkah terakhir klik Tombol Simpan Template.
  11. Selesai dan lihat hasilnya.
    Untuk melihat hasilnya silahkan anda masuk pada halaman Tata Letak atau Layout. Semoga bermanfaat Artikel Cara Membuat 3 Kolom Di Bawah Header, Terima kasih.

roy87.blogspot.com, SARJANA | COPY | PASTE
Description » Cara Membuat 3 Kolom Di Bawah Header » Rating: 5.0 » Reviewer: Muhammad Royani » ItemReviewed: Cara Membuat 3 Kolom Di Bawah Header

Artikel Terkait:

Posted » Muhammad Royani » Updated : 1:52 PM

27 comments:

sikkahoder said...

bos, gimana cara mengganti warna backgroundnya?

http://sikkahoder.blogspot.com/

blogger newbie said...

mantap gan tapi biasanya kode div id='main-wrapper
tidak ada pada template bawaan blogspot
thanks atas info nya, salam kenal

Muhammad Royani said...

SIp gan... thank's atas infonya.. hehe, saya pemula gan jadi sama2x belajar kita gan... hehe

si-irung said...

makasi mas ilmunya..
hehehe
senengnya berbagi
jangan lupa bermain di blogku ya mas

aneka download Softwere said...

mantap ,, lanjutkan brooo

M.E.Service said...

Terimakasih ya Mas M. Roy artikelnya boleh ngopas ya...!tak cobain.

wahid said...

mantab gan lagsung ane ke TKP....

Asy Shahid AM (SkaterSulawesi) said...

jadi gmn caranya agar blog bawaan blogspot bisa 3 kolom dibawah headernya ??

Aldo fahreza said...

template yang bawaan BLOGGER,, caranya tuh,,

cari kode <div class (truss ada tulisannya main-outer )

jadi perbedaannya,, dalam postingan ini tulisannya "ID" tetapi klo bawaan blogger "CLASS"

kunjung balek http://aldofahreza.blogspot.com

vezhphoria said...

keren bang, sangat membantu ..

CS Pe said...

makasih gan sangat membantu bagi para pemula....

nomorcntk kren said...

KREN BOS

Fikri Al-mabrur said...

Keren.... sangat mencerahkan..

Muhammad Royani said...

thank's bang :D

Mmichaeltsaico Mico said...

artikel menarik mas, dan juga sangat menarik ulasannya dan saya suka, dan salam kenal dari mico dan juga bagi teman2 yg suka dengan download film box office terbaru silakan kunjungi situsnya loe, makasi untuk admin juga. thanks

Argha Winata said...

contohnya g ada?
apakah cara ini sama dengan yang ada di blog sobat?
yg ada 3 kolom di atas itu bukan?

Edhie Jonas said...

thank,s http://pendidikanjasmani13.blogspot.com/

Anju Alexander said...

memang si muncul 3 kotak
tapi gan kok jadi gak bisa ya tambah gadget,,,,
mohon bantuannya segera

Amrita P.W said...

ok.... thanks ya....,insyaallah berguna...

Ochieed boneng said...

How To Change Blogger Background

Best Free Seo Tools to Optimize Your Blog

Profitable for your business - Guest Blogging

What Function Margin at Your CSS / Tips For Beginner

How to Host Jquery Script in Blogger / Blogspot

How to Earn Money with Chatika, Clicksor & Adhitz Learn in Urdu

How to Reduce site/blog Loading Speed Time?

Social Media & Email Subscription Box For Blogger

SiteMap

How to Make / Install Back To Top Button With

NoFollow | Understanding tag (rel = "nofollow") Attribute

Change Blog's Background Color Automatically with JavaScript

How to Make a Box Convert / Parse HTML and Functions

how to increase visitors easily to 2000

How to Make 2 Column Element in Lower Post

How To Add Message Box Like Wordpress With Close Button

RSS Feed Directories List

Best Alternatives to Google Adsense in 2013

Mas Riian said...

Thank's atas infonya gan, udah di terapkan di blog ane Mas Riian | All Free Download ™

mister-complete said...

aduh pusing bos gagal terus saya membuatnya. kira-kira ada cara yang lebih mudah gak bos. mohon bantuannya.

pake herbal said...

ga ketemu nih caranya gan,..
kalo yang buat dibawah bagaimana caranya?
www.pakepe.com

Supplier Herbal Jember said...

btw css awalnya itu harus di hapus ato langsung nambahin script di atas itu aja? thanks gan
monggo mampir
Ashab
Supplier Herbal Jember
Supplier Herbal Sidoarjo
Supplier Herbal Tulungagung

Ace Maxs31 said...

mantap dah
http://acemaxs31.com/

Ace Maxs said...

terimakasih banyak sob, sangat membantu sekali

http://acemaxsshop.com/

Theresia Prismawati said...

thanks sob artikelnya sangat bermanfaat sekali buat saya yg masih newbie..
awalnya saya juga bingung, tp stlah saya baca sesuai pnjelasan di atas akhirnya berhasil juga..dan salam kenal dari admin http://hingga.blogspot.co.id/

Post a Comment

◄ Posting Baru Posting Lama ►
 

Kawan-kawan Blogger

Copyright 2012 Sarjana Copy Paste