Beberapa hal penting dalam membuat template blog :
1. BACKground
Ini adalah aspek yang cukup penting dalam hal ngedit template secara keseluruhan , background itu layouts dari blog kamu ( di balik kolom postingan dan sidebar, serta header dan footer )
buat ngedit background blog KODe scrtipnya :
body {
background:$bgcolor;
margin:0;
color:$textcolor;
font: x-small "Trebuchet MS", Trebuchet, Verdana, Sans-serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
background-image:url(http://img501.imageshack.us/img501/3962/smilecom2bm1.jpg);
background-attachment: fixed;
background-position:bottom left;
background-repeat:no-repeat;
border-color: #854c6c;
border-width:0px ;
border-style: solid;
bagian pink bisa kamu rubah dengan link kamu, gunakan photoshop atau sejenisnya lalu dapetkan urlnya dgn menggunakan imageshack atau photobucket
2. KOLOM
HAl ini juga ngak kalah pentingnya dengan background, kolom disini maksnya adalah tempat postingan dan sidebar, boleh menggunakan 1 kolom hingga 4 kolom.
buat kolom posting :
#main-wrapper {
width: 485px;
float: left;
padding: 5px;
border:2px solid $bordercolor;
background-color:#000000;
tulisan merah buat ukuran kolom kamu , kuning buat border kalau kamu mau menghilangkan blog masukkan angka 0 , Pink adalah warna buat kolom kamu.
kalau lkamu ingin warna kolom kamu terlihat samar , seperti ini:
tambah kan kode :
filter:alpha(opacity=90); -moz-opacity:0.90; opacity:0.90; -khtml-opacity:0.90;
HASIL nya:
#main-wrapper {
width: 485px;
float: left;
padding: 5px;
border:2px solid $bordercolor;
background-color:#000000;
filter:alpha(opacity=90); -moz-opacity:0.90; opacity:0.90; -khtml-opacity:0.90 ;
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 */
}
SIDebaR...
kodenya :
#sidebar-wrapper {
width: 235px;
float: right;
padding: 5px;
border:2px solid $bordercolor;
background-color:#000000;
filter:alpha(opacity=90); -moz-opacity:0.90; opacity:0.90; -khtml-opacity:0.90;
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 */
}
Semua penerapannya sama dengan kolom posting tadi :)
Related Articles :
Belajar Membuat Blog Dengan BlogspotTerlintas dipikiranku untuk membuat sesuatu yang beda untuk mengaplikasikan beberapa tulisanku, maka mulailah aku belajar membuat blog ... 
Buat Cursor BlogBuat kamu yang suka kutak-katik blog,ini aku share sedikit cara masukin cursor pribadi diblog, caranya gini :** Buka Layouts lalu pil ... - Ganti background blogYuhuu i'm back dengan new topic neh.. seperti yang udah aku janjiin kemaren bakal ShaRe gimana caranya buat loyouts Blog, bagi kamu ya ...
- Melebarkan kolom postingCaranya :1. cari kode seperti ini/* Outer-Wrapper----------------------------------------------- */#outer-wrapper {width: 660px;margin ...
- Membuat bannerMembuat banner sebenarnya gampang-gampang susah,coba aku share dikit sesuai pengalaman aku buat banner kemaren.. ^^banner dengan excha ...
Tidak ada komentar:
Posting Komentar