Recent Posts

Membuat 2 atau 3 kolom di bawah header

Penutup tutorial blog di bulan puasa ini , saya akan memposting bagaimana cara membuat 2 kolom di bawah header , ini buat sobat blogger yang suka menaruh banyak widget untuk mempercantik blognya, dan sempat di tanyakan juga oleh pembaca blog ini yaitu sobat badot, setelah mencari inspirasi akhirnya ketemu juga bagaimana caranya membuat 2 kolom di bawah header, kalau mau lihat screenshotnya di bawah ini :
Dan hasil nyatanya sementara ini saya aplikasikan di blog ini
Mau tahu cara buatnya?

1. Seperti biasa login terlebih dahulu ke blogspot, kemudian masuk ke Tata Letak > edit HTML

Jangan lupa simpan template lengkapnya, klik Download Template Lengkap!!
2. Setelah itu cari kode ini ]]></b:skin> dan masukkan kode di bawah ini di atas kode tersebut :

#box-main-container {
clear:both;
}
.box-column {
padding:0px 10px 10px 10px;
border:1px dotted $bordercolor;
}

Simpan hasil pekerjaan sobat
3. Kemudian cari kode <div id='main-wrapper'>, setelah ketemu masukkan kode di bawah ini di atas kode tersebut.

<div id='box-main-container'>
<div id='box1' style='width: 50%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='box2' style='width: 50%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col2' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
</div>

Simpan kembali hasil pekerjaan sobat
4. Setelah selesai menyimpan, kemudian sobat ke Layout dan lihat hasilnya.
Kode pada tahap 3 bisa sobat modifikasi apabila ingin menambahkan 3 kolom di bawah header yang perlu di perhatikan adalah widht dengan floatnya!!

Tapi kalau sobat bingung saya sudah sediakan kode untuk menambahkan 3 kolom di bawah header, silahkan ikuti langkah 1 dan 2 kemudian ketika tahap 3 masukkan kode ini :


<div id='box-main-container'>
<div id='box1' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='box2' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='box-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='box3' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='box-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
</div>

Semua tergantung kebutuhan sobat dalam menambahkan widget, dan saya sampaikan terimakasih banyak telah menjadi pembaca setia blog ini :p . Happy blogging sobat and be Thinking Out Of The Box!!

Mengenal "atom.xml?redirect=false&start-index=1&max-results=100"

Sumpah ini sebenarnya di luar kehendak saya wekekekekek dan kemungkinan saya salah paste , mungkin ini di sebut korban blogspot , saking asyiknya ngeblog jadi ke pencet kali yak mepublikasikan posting soalnya saya sudah mengantuk berat. Saya baru tahu jam 3.00 sore tadi ketika inbok di gmail yang isinya ini postingan apa? Ok deh dari pada sayang ini postingan saya hapus dan sobat blogger sudah mengeluarkan komentarnya saya akan menjelaskan atom.xml?redirect=false&start-index=1&max-results=100.
Kode di atas adalah untuk memasukkan sitemap ke webmaster google di mana membantu mbah google untuk mengindeks situs/blog kita ibaratnya sebuah peta isi rumah kita. Sobat blogger login dulu ke webmaster google tentunya dengan account gmail sobat. Setelah itu masukkan blog sobat kalau belum di masukkan ke add site , bagi yang sudah klik add site map kemudian pilih add general web sitemap kemudian masukkan kode atom.xml?redirect=false&start-index=1&max-results=100 buat yang isi postingannya di bawah 100. kalau di atas 100 post masukkan atom.xml?redirect=false&start-index=101&max-results=100 dan kalau di atas 200 masukan kode ini atom.xml?redirect=false&start-index=201&max-results=100 setelah selesai save sitemap ini. Thanks buat Jovie, Bayu, Rafi dan Frendli yang memberikan komentar pamungkasnya di postingan yang tidak terencana ini wekekekekeke :p.
Langganan: Postingan (Atom)