07 August 2011

Tutorial : Template Mine Version

Jom buat template macam aku. Memandangkan aku pakai Minima Template, korang pun kenalah bertukar ke Minima Template. Nak bertukar ke Minima Template? [ KLIK SINI ]. Tutorial ni pun, menjadi pada template lain, tapi kod dia lain sikit lah.

How To Use
1. Dasboard - Template - Edit HTML
2. Tekan Ctrl + f  dan search kod  #outer-wrapper {

Kod dia akan jadi macam kat bawah ni.

#outer-wrapper {
width: 780px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

#main-wrapper {
width: 500px;
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 */
}

#sidebar-wrapper {
width: 240px;
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 */}




3. Copy code dibawah dan gantikan code di atas dengan code dibawah.


.clear {  
clear: both;}
#content-wrapper {
width: 1000px;
margin:0 auto; padding:10px;  
text-align:$startSide; 
background-color: #FFFFFF
border:2px solid #FA58AC
-moz-box-shadow: 0 0 10px #FA58AC
-webkit-box-shadow: 0 0 30px #FA58AC
-moz-border-radius: 15px;-webkit-border-radius: 15px;font: $bodyfont;} 
#main-wrapper { width: 520px;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 */} 
#sidebar-wrapper {width: 240px; 
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 */}


  • PURPLE- semakin besar nombor, semakin besar/ semakin lebar
  • GREEN -start-sidebar belah kanan, end-sidebar belah kiri
  • RED - tukar colour 
Teruskan dengan tutorial yang seterusnya okay! Good luck.

You may leave your comment :)

12 comments:

  1. ringan tak kalau pkai ni? hehehe...

    ReplyDelete
  2. kak , nape width dy besar sgt ? humm :(

    ReplyDelete
  3. @sweetlittlePUMPKIN boleh tukar width die jadi kecik . sekecik mne pon boleh .

    ReplyDelete
  4. ima new blogger..nak tnye..template tu cmne eak?soe nyibokk hee..

    ReplyDelete
  5. @Aja template tu macammane design blog . . design blog kan ade macam2 . .

    ReplyDelete
  6. npe still ade line dots kt setiap bwh post n3 n gadget?

    kamu punya xde pon.

    ReplyDelete
  7. @..cik gugu.. adesss . yang tu . transparent kan la . . kat design- template designer-border . . pilih transparent . .

    ReplyDelete
  8. mcm mana nk letak url blog dkt minama template ehh.. sori menganggu

    ReplyDelete
  9. akak kenape background kaler putih je? try tengok
    http://itsmylifejouney.blogspot.com/

    ReplyDelete