Rombak Kolom Templete Blogspot

Banyak newbie yang tanya gimana cara merombak kolom templete di blogspot, pada dasarnya sangat sederhana dan mudah, emang secara default blogspot hanya menyediakan satu sidebar dan satu main kolom atau kolom untuk posting, merombak atau menambahkan sidebar bisa dilakukan dengan menambah script CSS.

Hal yang perlu di lakukan(dengan asumsi anda menggunakan templete default bawaan blogspot):

Setelah anda berada di halaman dashboard klik layout, lalu pilih edit HTML kemudian  cari skrip berikut

#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

Setelah menemukan skrip ini, width: 660px; merupakan lebar wrapper(bagian luar) di rubah agak lebih besar menjadi width:1000px; setelah selesai simpan templete anda

Kemudian lihat hasilnya, akan terdapat ruang kosong antara sidebar dan main kolom (tempat posting), kemudian kembali ke edit HTML, kemudian cari skrip berikut:

#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}

Skrip CSS di atas merupakan skrip sidebar default blogspot, untuk menciptakan sidebar baru copy skrip di atas kemudian copy rubah skrip tersebut menjadi

#new-sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}

Kemudian paste dibawah skrip sidebar yang pertama jadi akan terlihat seperti ini

#sidebar-wrapper {
width: 220px; (ukuran ini bisa diganti2)
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}

#new-sidebar-wrapper {
width: 220px; (ukuran ini bisa diganti2)
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}

Setelah melakukan hal di atas yang langkah berikutnya yang dilakukan mencari skrip berikut:

<div id=’sidebar-wrapper‘>
<b:section class=’sidebar’ id=’sidebar‘ preferred=’yes’>
</b:section>
</div>

Copy skrip di atas kemudian paste di bawah skrip tersebut dan lakukan edit menjadi berikut:

<div id=’new-sidebar-wrapper‘>
<b:section class=’sidebar’ id=’new-sidebar‘ preferred=’yes’>
</b:section>
</div>

Variable new di atas untuk mendefinisikan sidebar baru yang baru dibuat, setelah dibuat, jadi skrip tersebut berbentuk seperti berikut:

<div id=’sidebar-wrapper’>
<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’>
</b:section>
</div>

<div id=’new-sidebar-wrapper’>
<b:section class=’sidebar’ id=’new-sidebar‘ preferred=’yes’>
</b:section>
</div>

Setelah ini selesai, simpan template dan lihat hasilnya, anda akan melihat ada tambahan sidebar baru, menjadi 2 sidebar dan satu kolom untuk posting atau kebanyakan orang menyebut 3 colom.

Jika anda ingin mengecilkan salah satu dari sidebar atau main sidebar anda tinggal merubah rubah width di sidebar dan main sidebar sesuai dengan selera masing-masing, Selamat mencoba

Comments

• Categories

  • Adsense Policy
  • ATM
  • Blogspot
  • Celoteh
  • Cryptography
  • Film Review
  • Google Adsense
  • Human Computer Interaction
  • Lowongan
  • Network Security
  • Nilai Mahasiswa
  • Pemrograman
  • Sekilas Info
  • Sistem Operasi
    • Tugas
  • Steganography
  • Tips & Tricks
  • Tutorial
  • Uncategorized

• Adsense advance encryption standard aes Algoritma animation Blog Computer Interaction Cryptography Design web Exercise External link Final Project Google Adsense Google index HCI Human Computer Interaction IMK interactive computing systems Interaksi Manusia dan Komputer jaringan sosial JavaScript Keamanan Jaringan kejahatan Komfirmasi Ulang kriptografi mahasiswa Management File Management Process Minimal Google Index Nama domain Nilai nilai kuliah Operating System Resolve Domain rijndael Semester Ganjil Steganographia Steganography Templete Blogspot Tugas Akhir tugas mahasiswa Tutorial Ujian akhir Semester Waster Union Yahoo index

  WP Cumulus Flash tag cloud by Roy Tanck and Luke Morton requires Flash Player 9 or better.

• Partner Site

  Home Design Ideas

  Great Indonesia IT School

  Free Downloads Software

  Hosting Murah

  Best Hosting Support

• Unknown Feed

• Softfive – Free Software Downloads Site

  • Comodo Firewall 5.8: Internet Threats from Accessing you PC
  • ICQ 7.6: Contact Friends and Family Online Software
  • qBittorrent 2.9.0.1
  • Easy Feed Editor 3.5.2: Free Tool Create and Edit RSS Feeds
  • Comodo Antivirus 5.8: Completely Rid your Computer of Viruses and Other Internet Threats
  • Microsoft Malicious Software Removal Tool 4.1: Checks for and Remove

• Recent Posts

  • Deindex Ecommerce Website, Resubmit Your Task Again
  • Tugas E-commerce S1 Reguler 2011
  • Tugas D3 TI and S1TT E-commerce
  • Banned Massal yang Benar-Benar Menyakitkan
  • Verifikasi dan Komfirmasi Tugas

Popular Search