Headlines News :
Home » » Cara Mengubah Ukuran Template Dan Elemen Blog

Cara Mengubah Ukuran Template Dan Elemen Blog

Written By Unknown on Jun 20, 2011 | Monday, June 20, 2011


Bookmark and Share
Saya tebak kalian yang membaca artikel ini adalah orang yang memiliki sebuah Blog dan sedang mencari sebuah artikel yang membahas tentang cara mengatur ukuran konten yang terdapat pada blog kalian mungkin itu meliputiMengubah Ukuran Halaman Blog, Mengubah Halaman Posting, Mengubah Ukuran Header, Mengubah Ukuran Sidebar, atau Mengubah Ukuran Footer. Tenang saya akan membahas semuanya sekaligus (all in one gitu lohhh) hehehe. Mungkin kalian sulit menemukan Template Blog yang cocok dengan selera kalian dan utamanya bahwa Template Blog di ibaratkan seperti sebuah tampilan rumah yang indah, bagus, dan mempesona agar banyak orang yang ingin berkunjung di Blog kalian. tapi bukan hanya tampilan saja yang digunakan melainkan tata letak dan ukuran setiap konten haruslah sesuai dengan isi dari blog itu sendiri, mungkin juga kalian ingin mengedit ukuran inilah itulah agar semua terlihat seperti keigninan kalian. tidak usah berlama-lama langsung saja saya akan memberikan caranya walau ini hanya ilmu yang sangat mudah tapi cukup membantu dikala kalian sedang membutuhkannya.






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, 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: 660px;
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.
Share this article :

0 Komentar:

Total Pageviews

 
Support : Creating Website | Johny Template | Mas Template
Proudly powered by Blogger
Copyright © 2011. PORTAL KAMPUNGAN - All Rights Reserved
Template Design by Creating Website Published by Mas Template