Tutorial : Border Bergambar Keliling Blog ( Denim)

Border Bergambar Keliling Blog



Step A : Background Blog
Cth Background



1. Pergi ke Template -> Edit HTML

2. Cari code #content-wrapper {



#content-wrapper {

font-size: 14.5px;

width: 1050px;
margin: 0 auto;
padding: 0 0 15px;
text-align: left;


3. Paste code background: url ( IMAGE URL ) repeat-y; *rujuk code dibawah*



#content-wrapper {

font-size: 14.5px;

width: 1050px;
margin: 0 auto;
padding: 0 0 15px;
text-align: left;
background: url( IMAGE URL ) repeat-y;
 }

4. Preview & Save :)
Step B : Rapatkan Header Blog Dengan Body


Cth Header
1. Pergi ke Template -> Edit HTML
2. Cari code #header-wrapper {
3. Paste code ini dibawah #header-wrapper {


background:url( IMAGE URL) no-repeat ; center;


contoh :



#header-wrapper {
background:url( IMAGE URL) no-repeat ; center;
  margin-left:55px;
  padding: 0;
  background-color: $headerCornersColor;
  text-align: $startSide;
}

4. Cari code #header { , lebih kurang macam code dibawah :

#header {
  height:520px;
  width: 1050px;
  margin: 0 auto;
  background-color: $headerBgColor;
  border: 1px solid $headerBgColor;
  color: $headerTextColor;
  padding: 0;
  font: $headerFont;
}
Ganti tulisan berwarna purple tu mengikut kesesuaian blog uolss.

5. Preview & Save :)
Step C : Footer Blog


Cth Footer


1. Pergi ke Template -> Edit HTML
2. Cari code #footer {
3. Korang akan jumpa code lebih kurang mcm dibawah :

#footer {
width:900px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;
}
4. Kemudian gantikan dengan code dibawah :


#footer {
clear: both;
text-align: center;
color: #191919;
background: url( IMAGE URL) no-repeat;
background-position: center;
height: 180px;
}
5. Preview & Save :)


p/s : Kalau tak jadi comment kat bawah k.



2 ulasan

  1. owh camni.. serious tak tahu.. boleh refer sini lah camtu :D thankss

    BalasPadam
  2. eeee comelnye blog die! gerammmm hehehe

    BalasPadam

The owner of this blog reserves the right to edit or delete any comments submitted to this blog without notice due to;
1. Comments deemed to be spam or questionable spam
2. Comments including profanity
3. Comments containing language or concepts that could be deemed offensive
4. Comments that attack a person individually (including agency)