Tips Mengubah Ukuran Template Dan Elemen Blog

Elemen Blog

Memiliki Blog yang cantik dan bagus adalah idaman bagi setiap blogger. Berikut adalah beberapa tips yang mempermudah para blogger khususnya bagi para pemula untuk mendesain sendiri blognya agar tampil bagus dan tentu saja menarik untuk disimak….

Langkah awal :

- Login ke Blog Kalian
- Klik Tata Letak
- Klik Edit HTML
- Saya sarankan sebelum Mengedit HTML di Blog kalian, silahkan kalian BackUp Template kalian terlebih dahulu agar nantinya jika terjadi sesuatu yang tidak di inginkan kalian bisa memasang template semula yang belum kalian Edit HTML nya. (dan setelah di Edit jangan langsung di save, cukup di Pratinjau lebih dahulu dan bila sudah sesuai dengan keinginan kalian barulah kalian save hasil Editan kalian tadi).

Untuk mengubah ukuran Halaman Blog
Cari kode di bawah ini:

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

Keterangan:
Untuk memudahkan mencari Kode di Atas gunakan bantuan dengan menekan Ctrl + F
Untuk mengubah ukuran lebar Halaman Blog, kalian cukup mengubah angka pada width sesuai dengan keinginan kalian.

Untuk mengubah ukuran Halaman Posting
Cari kode di bawah ini:

#main-wrapper {
width: 410px;
float: $startSide;
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 */
}

Keterangan :
Untuk memudahkan mencari Kode di Atas gunakan bantuan dengan menekan Ctrl + F
Untuk mengubah ukuran lebar Halaman Posting, kalian cukup mengubah angka pada width sesuai dengan keinginan kalian.

Untuk mengubah ukuran Sidebar Blog
Cari kode di bawah ini:

#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 */
}

Keterangan :
Untuk memudahkan mencari Kode di Atas gunakan bantuan dengan menekan Ctrl + F
Untuk mengubah ukuran lebar Sidebar Blog, kalian cukup mengubah angka pada width sesuai dengan keinginan kalian.

Untuk mengubah ukuran Header Blog
Cari kode di bawah ini:

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}

Keterangan :
Untuk memudahkan mencari Kode di Atas gunakan bantuan dengan menekan Ctrl + F
Untuk mengubah ukuran lebar Header Blog, kalian cukup mengubah angka pada width sesuai dengan keinginan kalian.

Untuk mengubah ukuran Footer Blog
Cari Code di bawah ini:

#footer {
width:660px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}

Keterangan :
Untuk memudahkan mencari Kode di Atas gunakan bantuan dengan menekan Ctrl + F
Untuk mengubah ukuran lebar Footer Blog, kalian cukup mengubah angka pada width sesuai dengan keinginan kalian.

Perhatian !!!

Jika lebar salah satu dari kelima elemen di atas (Halaman Blog, Halaman Posting, Side Bar Blog, Header Blog, dan Footer Blog) diubah, maka akan mempengaruhi keserasian elemen yang lain. Oleh karena itu, jika kalian ingin mengubah lebar salah satu elemen, maka kalian juga harus menyesuaikan dengan lebar elemen yang lain, karena jika antara satu elemen yang satu dengan yang lain tidak serasi, maka tampilan blog kalian akan menjadi kacau, kalian tidak mau kan kalau tujuan kalian yang mulanya ingin menyesuaikan tampilan blog kalian sesuai keinginan dan selera kalian malah justru merusak blog kalian sendiri. Seperti yang sudah saya bilang diatas, jangan langsung di save melainkan di pratinjau terlebih dahulu, jika sudah sesuai dengan keinginan kalian barulah kalian save.

Semoga bermanfaat, Selamat Berkreasi.... ^^Y