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 :
FriendShip BloGWahh.. senangnya.. banyak yang isiin shoutbox, maklum deh aku masih newbie banget dalam hal nge blog, yang berkunjung para blogger pap ... - Membuat bannerMembuat banner sebenarnya gampang-gampang susah,coba aku share dikit sesuai pengalaman aku buat banner kemaren.. ^^banner dengan excha ...
- Melebarkan kolom postingCaranya :1. cari kode seperti ini/* Outer-Wrapper----------------------------------------------- */#outer-wrapper {width: 660px;margin ...
- Menampilkan ikon YMAda 2 jenis :CODE :<a href="ymsgr:sendIM?IDKAMU"> <img src="http://opi.yahoo.com/online?u=IDKAMU&m=g&t=1& ...
Belajar Membuat Blog Dengan BlogspotTerlintas dipikiranku untuk membuat sesuatu yang beda untuk mengaplikasikan beberapa tulisanku, maka mulailah aku belajar membuat blog ...
Tidak ada komentar:
Posting Komentar