Wednesday, January 5, 2011

Cara membuat template

1. Kembali ke blogger dan ke menu
"Edit HTML".
2. Trus klik tombol "Brows" untuk
mengupload template yg udah
kamu donwload tadi.
3. Kemudian Cari kode seperti ini:
body { margin: 0px; padding: 0px;
text-align: left; font:$bodyfont; color:
$textcolor; background: #323232 url
(' http://mayoup555.co.cc/
template/bg.jpg') repeat-x top
left; }
4. Ganti text yang dicetak tebal
dengan lokasi gambar background
yang kamu buat.
5. Cari kode seperti ini :
#center {background: #ffffff url
(' http://mayoup555.co.cc/
template/main.jpg') repeat-y top
center;}
6. Ganti text yang dicetak tebal
dengan lokasi gambar main kamu.
7. Cari kode seperti ini:
#header { margin: 0; height:196px;
width:898; color: $pagetitlecolor;
background: url(' http://
mayoup555.co.cc/template/
head.jpg ') no-repeat top center; }
8. Ganti text yang dicetak tebal
dengan gambar header.
9. Cari kode seperti ini:
#footer { margin: 0; width: 898px;
height:80px; padding: 0px;
background: url(' http://
mayoup555.co.cc/template/
foot.jpg ') repeat-y top center; }
10. Ganti text yang dicetak tebal
dengan gambara foter.
11. Masih ada beberapa hal yang
harus kamu perhatikan. coba cari
kode-kode berikut:
#outer-wrapper { width: 898px;
margin: 0px auto 0; text-align:
justify; }
kode width: 898px menunjukkan
lebar dari blog kamu, kamu bisa
mengubahnya sesuai keinginanmu,
tapi harus disesuaikan dengan lebar
desain gambar yang kamu buat.
#main { float: left; width: 445px;
margin: 5px; padding: 0px 0px 0px
10px; line-height: 1.5em; word-wrap:
break-word; /* fix for long text
breaking sidebar float in IE */
overflow: hidden; }
kode width: 445px; adalah lebar
daerah main yang berisi posting,
kamu bisa merubahnya.
#sidebar { float: right; width: 153px;
padding-right: 50px; font-size: 83%;
color: $sidebartextcolor; line-height:
1.4em; word-wrap: break-word;
overflow: hidden; }
#ads-wrapper {float: left; width:
195px; padding-left: 10px; word-
wrap: break-word; overflow:
hidden; }
kode width: 153px; adalah lebar
sidebar bagian kanan. Dan kode
width: 195px; adalah lebar sidebar
bagian kiri. Terus kode padding-
right: 50px; jarak antara tulisan
atau isi sidebar sebelah kanan
dengan garis batas kanan. Dan kode
padding-left: 10px; adalah jarak
antara isi sidebar kiri dengan garis
batas kiri.
#header { margin: 0; height:196px;
width:898; color: $pagetitlecolor;
background: url('http://
mayoup555.co.cc/template/
head.jpg') no-repeat top center; }
kode height:196px; width:898;
adalah ukuran tinggi dan lebar
bagian header, kamu bisa
menyesuaikannya dengan ukuran
header kamu.
#footer { margin: 0; width: 898px;
height:80px; padding: 0px;
background: url('http://
mayoup555.co.cc/template/
foot.jpg') no-repeat top center; }
kode width: 898px; height:80px;
adalah ukuran lebar dan tinggi
bagian footer.
12. Nah kalo udah selesai coba di
preview template kamu, sudah
sesuai kah? atau hancur?
13. Kalo sudah di Save.
:f akhirnya selesai juga aku buat
artikel tentang pembuatan template,
capek ya? tapi ingat sekali lagi ini
adalah metode membuat template
yang mudah dan sederhana, jadi
sebenrnya isi dari template lebih
rumit lagi, munkin kapan-kapan
akan kita bahas detail dari bagian-
bagina template tersebut.

Comments :

0 comments to “Cara membuat template”

Post a Comment

 

Copyright © 2009 by nazwa-555

Template by Blogger Templates | Powered by Blogger