HOMEPAGE
THE AUTHOR
FREEBIES
TUTORIALS
DESIGN PROCESS
PORTFOLIO

Freebies Classic Template (part I)

Assalamualaikum bloggers ;)

Today, aten baru siapkan satu freebies classic template. Act, benda ni ada yang request haritu.
So, harini baru siap. Hampir 10jam mengadap laptop sebab nak buat freebies ni,
Sebenarnya, header yang ambil masa lama. Penat sangat tahuu.. -_______-

Tapi, untuk visitor, follower aten, aten buatkan jugak :)

Jum tengok gambarnya dulu. Lepastu baru aten bagi link untuk live preview dan coding blog tu :)

 Preview header :D

Preview footer :D

Now, you can see live preview here. Click the link ; http://freebiesblogpreview.blogspot.com/

Coding blog :-


<html>
<link href='http://fonts.googleapis.com/css?family=Peggyfont' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Unica+One' rel='stylesheet' type='text/css'>

<link rel="shortcut icon" href="http://media.tumblr.com/tumblr_lkqypfp4j51qi6qow.gif" />

<base target='_blank'/>
<script type='text/javascript'>
document.ondragstart = function () { return false; }; </script>
<title>Unprivate Diary ;</title>

<style type="text/css">
#navbar-iframe {
display: none;
}
body {
background:url(http://i908.photobucket.com/albums/ac289/TintaAini/Background/Kayukayan23.png);
background-attachment:fixed;
font-family: short stack;
letter-spacing:1px;
cursor: url(http://4.bp.blogspot.com/-uHXh3wNQ4l0/UK25GaY0h_I/AAAAAAAAEl0/fN78zrlVofg/s1600/bloggerians.png), progress;
}
a:link,a:visited{
color: #cca9a9;
text-decoration:none;
cursor: url(http://4.bp.blogspot.com/-uHXh3wNQ4l0/UK25GaY0h_I/AAAAAAAAEl0/fN78zrlVofg/s1600/bloggerians.png), progress;
}
a:hover{
color:#333333;
text-decoration:none;
-webkit-transition: 0.4s;
cursor: url(http://4.bp.blogspot.com/-uHXh3wNQ4l0/UK25GaY0h_I/AAAAAAAAEl0/fN78zrlVofg/s1600/bloggerians.png), progress;
}
.posttitle {
padding:3px;
line-height: 1px;
margin:5px;
font-family:peggyfont;
font-size:19px;
text-align:center;
color:black;
background:url(http://4.bp.blogspot.com/-qR1_1qX8BSw/T_LR1Q3NDVI/AAAAAAAACr4/8skGurLfDGA/s1600/pinl.gif);

}
.sec-title {
text-align: left;
border-radius:5px;
border:1px dotted pink;
 background: url(http://3.bp.blogspot.com/-NSGeqUssatw/T4kt-JfUHHI/AAAAAAAADE4/lbETjpR86JI/s1600/stripe.png);
padding:2px;
}
.titleside {
padding:3px;
line-height: 1px;
margin:5px;
font-family:peggyfont;
font-size:19px;
text-align:center;
color:black;
background:url(http://4.bp.blogspot.com/-qR1_1qX8BSw/T_LR1Q3NDVI/AAAAAAAACr4/8skGurLfDGA/s1600/pinl.gif);
width:270px;
}
a.frens{
font: 12px unica one;
display:inline-block;
text-align:center;
border-radius:100px;
background:#ececec;
width:95px;
color:black;
border:1px dashed #bdbdbd;
padding:4px;
margin:2px;
text-decoration: none;
}
a.frens:hover{
display:inline-block;
text-align:center;
padding:4px;
margin:2px;
color:black;
text-decoration: none;
cursor:vertical-text;
-webkit-transition-duration:0.5s;
background:url(http://4.bp.blogspot.com/-qR1_1qX8BSw/T_LR1Q3NDVI/AAAAAAAACr4/8skGurLfDGA/s1600/pinl.gif);
letter-spacing:4px;
}
blockquote {
background:url(http://3.bp.blogspot.com/-RM7Bq5SAKb8/TyQPiebYdXI/AAAAAAAACz4/bBdcgeHjhTM/s320/patung.png);
background-position:bottom right;
background-repeat:no-repeat;
padding:4px;
border:1px dashed #cca9a9;
font:10px georgia;
font-style:italic;
}
blockquote:hover {
background-position:right;
-webkit-transition: 1s;
}
::-webkit-scrollbar {
width:8px;
height: 7px;
}
::-webkit-scrollbar-track-piece  {
background-color:#cca9a9;
border: 3px solid #ffffff;
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-color:#cca9a9;
border: 1px solid #ffffff;
border-radius: 50px;
}
::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment  {
height:8px;
width:6px;
display:block;
background: #cca9a9;
border-radius:10px;
}
::selection {
background: #cca9a9;
color:white;
}
.header {
opacity:1.0;
}
u {
text-decoration:none;
border-bottom:2px solid #cca9a9;
border-radius:5px;
background:transparent;
color:#333333;
padding:1px;
}
u:hover {
-webkit-transition-duration: 0.5s;
color:white;
background:#cca9a9;
padding:1px;
border-radius:5px;
}
b {
color:#cca9a9;
}
b:hover {
color:#333333;
-webkit-transition-duration: 0.5s;
}
i {
color:#cca9a9;
}
i:hover {
color:#333333;
-webkit-transition-duration: 0.5s;
}
img{
opacity:1.0;
cursor: url(http://4.bp.blogspot.com/-uHXh3wNQ4l0/UK25GaY0h_I/AAAAAAAAEl0/fN78zrlVofg/s1600/bloggerians.png), progress;
}
img:hover{
opacity:1.0;
background: url(http://a.deviantart.net/avatars/s/p/sparklesplz.gif?1);
cursor: url(http://4.bp.blogspot.com/-uHXh3wNQ4l0/UK25GaY0h_I/AAAAAAAAEl0/fN78zrlVofg/s1600/bloggerians.png), progress;
}
a.bte {
color: #cca9a9;
font-family:unica one;
font-size:10pt;
float:right;
}
.contentt {
padding:3px;
line-height: 1px;
margin:5px;
font-family:peggyfont;
font-size:19px;
text-align:center;
color:black;
background:url(http://4.bp.blogspot.com/-qR1_1qX8BSw/T_LR1Q3NDVI/AAAAAAAACr4/8skGurLfDGA/s1600/pinl.gif);
}
.navi{
padding: 3px;
display: inline-block;
text-transform: uppercase;
font: 8.5px trebuchet ms;
letter-spacing: 2px;
width: 130px;
text-align:center;
margin:2px ;
border-left:10px solid #bdbdbd;
border-right:1px solid #bdbdbd;
border-bottom:1px solid #bdbdbd;
border-top:1px solid #bdbdbd;
background:#faafbe;
box-shadow:inset 0px 0px 0px #bdbdbd;
}
.navi:hover{
color:white;
box-shadow:inset 135px 0px 0px #bdbdbd;
border-left:1px solid #faafbe;
border-right:10px solid #faafbe;
border-bottom:1px solid #faafbe;
border-top:1px solid #faafbe;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;

}

</style>

</head>
<body oncontextmenu='return false;'>
<center><div class="header"><img style="border:none;padding:0px; margin-right:0px;border-radius:0px; margin-bottom:-5px;opacity:1.0;" src="http://4.bp.blogspot.com/-Xtq0RFzTzXQ/UK3sGzdgcrI/AAAAAAAAEnc/1smFE1KyEm8/s1600/mejag.png"></div></center>
<table style="font-size: 10px; color: #333333;line-height: 15px; border-left:2px solid #cca9a9; border-right:2px solid #cca9a9;background-color:white;" width="837" align="center" border="0" cellspacing="2">

<tbody><tr>
<center><div style="width:825px; padding:4px;background:white;border-left:2px solid #cca9a9; border-right:2px solid #cca9a9;">
<a class="navi" onClick="document.getElementById('fh').innerHTML=document.getElementById('entry').innerHTML" title="">Home</a>

<a class="navi" onClick="document.getElementById('fh').innerHTML=document.getElementById('about').innerHTML" title="">Owner</a>

<a class="navi"  onClick="document.getElementById('fh').innerHTML=document.getElementById('freebies').innerHTML" title="">Freebies</a>

<a class="navi" onClick="document.getElementById('fh').innerHTML=document.getElementById('tutorial').innerHTML" title="">Tutorials</a>

<a class="navi" onClick="document.getElementById('fh').innerHTML=document.getElementById('links').innerHTML" title="">Websites</a>
</center>

<td valign="top" style="line-height:13px; font-size:10px; padding:5px;width:270px; background:transparent;">

<div class="titleside">Disclaimer Board</div>
<p></P>
<center>
<img style="background:url(http://i.imgur.com/OSKTA.png); padding:4px; width:260px;" src="http://data.whicdn.com/images/43921314/tumblr_m6nszh14CQ1rtb8xmo2_500_large.gif"/>
<p></p>
Welcome to my hideous blog. Do not forget to leave your footsprint at my chatterbox below there. Be my followers, if you don't mind. Come here everyday ^^
<p></p>
<div style="color:red; font-size:12px;">CHANGE THIS SECTION WITH YOUR OWN.</span></center>
<p></p>

<div class="titleside">Chatter Box</div>
<P></P>
<center>
Must put your name & url blog. Exchanges link opened, Tutorial request accepted & Be nice
<P></P>
<div style="color:red; font-size:12px;">PUT YOUR CBOX CODE HERE. <BR>
WITDH BAWAH 270PX.</span></div>
</center>
<P></P>

<div class="titleside">My Loyal Followers</div>
<p></P>
<center>
Letak code kotak followers anda disini. Pastikan width kotak followers anda bawah 270px. Terima kasih :D
<P></P>
<div style="color:red; font-size:12px;">CHANGE THIS WITH YOUR OWN.<BR>
WITDH KOTAK FOLLOWERS BAWAH 270PX.</span></div>
</center>
<p></p>

<div class="titleside">Blog Sponsors</div>
<P></P>
<center>Skin design by <a href="http://duniaimpianfatin.blogspot.com">FHazwani</a><br>
Tool used Gimp & Pixlr Editor<br>
Best view only in Google Chrome
<p></p>
<div style="color:red; font-size:12px;">DONT EVER REMOVE THE OWNER SKIN DESIGN.</span></div></center>
<td>

<td valign="top" style="width:567px; padding:5px;">
<div id="fh">
<blogger><div class="posttitle"> <BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
<P></P>
<div class="sec-title">
<img src="http://4.bp.blogspot.com/-cXRF2mvZQi4/T85Qh3GdJ_I/AAAAAAAAEqI/fUmP6cBKn3w/s1600/datac.gif"/> Entry updated on <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> <br>  <img src="http://3.bp.blogspot.com/-wWfwkQO2f74/T85QfGyB4WI/AAAAAAAAEqA/A_tIvNJ5PzA/s1600/comendo.gif"/> Entry got <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> comments</a></BlogItemCommentsEnabled> | <a href="javascript:scroll(0,0)">Fly to top :3</a></div><P></P>
<$BlogItemBody$><p></p>
<div style="float:left;text-align:center;padding:4px;width:100px; background:#cca9a9;"> <a href=<$NewerPosts$>><span style="color:white;">« Newer Post</span></a></div> <div style="float:right;padding:4px;width:100px;background:#cca9a9;text-align:center; "><a href=<$OlderPosts$>><span style="color:white;">Older Post »</span></a></div>
</blogger><P></P>
</td></div></tr></tbody>

<div id="entry" style="display:none;">
<blogger><div class="posttitle"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
<P></P>
<div class="sec-title">
<img src="http://4.bp.blogspot.com/-cXRF2mvZQi4/T85Qh3GdJ_I/AAAAAAAAEqI/fUmP6cBKn3w/s1600/datac.gif"/> Entry updated on <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> <br>  <img src="http://3.bp.blogspot.com/-wWfwkQO2f74/T85QfGyB4WI/AAAAAAAAEqA/A_tIvNJ5PzA/s1600/comendo.gif"/> Entry got <a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>><$BlogItemCommentCount$> comments</a></BlogItemCommentsEnabled> | <a href="javascript:scroll(0,0)">Fly to top :3</a></div><P></P>
<$BlogItemBody$><p></p>
<div style="float:left;text-align:center;padding:4px;width:100px; background:#cca9a9;"> <a href=<$NewerPosts$>><span style="color:white;">« Newer Post</span></a></div> <div style="float:right;padding:4px;width:100px;background:#cca9a9;text-align:center; "><a href=<$OlderPosts$>><span style="color:white;">Older Post »</span></a></div>
</blogger>

<div id="about" style="display: none;">
<div class="contentt">About The Webmaster</div>
<P></P>
<img style="clear: left;float:left; margin-bottom: 1em; margin-right: 1em;height:190px;" src="http://media.tumblr.com/tumblr_m25e0hr7ac1qfamg6.png"/>
<b>Name :</b> Fatin Hazwani Bt Abdul Mutalib<br>
<b>Known as :</b>Fatin, Aten or Hazwani<br>
<b>Age :</b> Fifteen Years Old<br>
<b>Date Of Birthday :</b> 05 March 1997<br>
<b>Current Home :</b> Negeri Sembilan, Senawang<br>
<b>School at :</b> Smk Seri Pagi, Senawang<br>
<b>Favourite color :</b> Pink, Putih, Biru<br>
<b>Hobbies :</b> Singing, Dancing, Blogwalking & Edit Blog<br>
<b>Ambitition :</b> Singer, Dancer & Doctor<br>
<b>Sweet Memories :</b> Got 5A in UPSR, Got 3A in trial PMR, Got a new handphone Galaxy Young, Got a new laptop & Get 8A in PMR (coming soon)
<p></p>
<div style="color:red; font-size:12px;">CHANGE THIS SECTION WITH YOUR OWN.</span></div>
<P></P>
<a class="bte" onClick="document.getElementById('fh').innerHTML=document.getElementById('entry').innerHTML" title="">« Back To Entry.</a>
</div>

<div id="links" style="display: none;">
<div class="contentt">I Like To Find A New Friends</div>
<P></P>
<u>RULES FOR EXCHANGE LINKS :-</u><br>
<P></p>
<img src="http://i798.photobucket.com/albums/yy265/chumaniac/pix/bulletkann1.gif"/> Bagitahu kat chatterbox yang awak nak exchanges link. <br>
<img src="http://i798.photobucket.com/albums/yy265/chumaniac/pix/bulletkann1.gif"/> Letak nama saya <u>Fatin Hazwani</u> atau <u>Fhazwani</u>. <br>
<img src="http://i798.photobucket.com/albums/yy265/chumaniac/pix/bulletkann1.gif"/> Saya akan letak link awak lepas awak letak link saya. <br>
<img src="http://i798.photobucket.com/albums/yy265/chumaniac/pix/bulletkann1.gif"/> Jika awak <u>delete</u> link saya, automatik link awak pun saya delete.
<p></p>
<div style="color:red; font-size:12px;">GANTIKAN FATIN HAZWANI/FHAZWANI KEPADA NAMA AWAK.</span></div>
<P></P>
<center>
<a href="http://duniaimpianfatin.blogspot.com" class="frens">Fhazwani</a>
<a href="http://blogger.com/" class="frens">Next?</a>
<a href="http://blogger.com/" class="frens">Next?</a>
<a href="http://blogger.com/" class="frens">Next?</a>
<a href="http://blogger.com/" class="frens">Next?</a>
<a href="http://blogger.com/" class="frens">Next?</a>
<a href="http://blogger.com/" class="frens">Next?</a>

<P></P>

</center>
<P></P>
<a class="bte" onClick="document.getElementById('fh').innerHTML=document.getElementById('entry').innerHTML" title="">« Back To Entry.</a>
</div>

<div id="freebies" style="display: none;">
<div class="contentt">I Make Some Freebies For You</div>
<P></P>
<center><img style="background:url(http://i.imgur.com/OSKTA.png); padding:4px; width:450px;"src="http://4.bp.blogspot.com/-9_brFutjtFc/UK4pbdnqMHI/AAAAAAAAEns/cV1dMMjHepk/s1600/cats.jpg"/>
</center>
<P></p>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies : <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies :  <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies :  <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies :  <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies :  <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies :  <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<P></p>
<a class="bte" onClick="document.getElementById('fh').innerHTML=document.getElementById('entry').innerHTML" title="">« Back To Entry.</a>
</div>

<div id="tutorial" style="display: none;">
<div class="contentt">I Make Some Tutorials For You</div>
<P></P>
<center><img style="background:url(http://i.imgur.com/OSKTA.png); padding:4px; width:450px;"src="http://4.bp.blogspot.com/-EBnHCAwyynw/UK4qL2o8FaI/AAAAAAAAEn0/nANpDSkcPFs/s1600/cats.jpg"/>
</center>
<P></p>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies : <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies :  <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies :  <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies :  <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies :  <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/heart_rosinha.gif"/> Freebies :  <a href="http://duniaimpianfatin.blogspot.com">Coming Soon....</a> <br/>
<P></P>
<a class="bte" onClick="document.getElementById('fh').innerHTML=document.getElementById('entry').innerHTML" title="">« Back To Entry.</a>
</div>

</td></table></body>
<center><img style="border:none;padding:0px;margin-right:0px;border-radius:0px; margin-top:-4px;opacity:1.0;" src="http://2.bp.blogspot.com/-h7EoivvBzk0/UK3YZRh1n2I/AAAAAAAAEm0/h4EQycDFOB0/s1600/freebiesfooter.png"></center>
</head>

Thats the code. Just copied and paste at your blog.
Sesiapa yang nak guna, tinggalkan komen yaa :D
And, kalau taknak guna pun tinggalkan lah komen juga ya ^^

Don't remove the credit at BLOG SPONSOR.
if you don't like the words at the header, you can delete the words. Just use the picture only. Must credit me if you change the words.
No re-freebies/re-post...

53 comments:

  1. kalau guna aten punya basecodes boleh idok ._. Hee, saja tanya :3

    ReplyDelete
  2. Boleh kalau saya amibl skins nie then saya ada nak tukar Style..mintak kebenaran tkt tuan punya marah :)

    -hover navigation
    -Header

    Mohon benarkan sebap saya berminat giler dengan skin nie :)itu je..sumpah saya tak akan remove credit

    ReplyDelete
  3. @rahayu ; boleh, tapi jangan remove credit tuu. okay?

    ReplyDelete
  4. akak nk guna nie ya...^^mnx kbnran..

    ReplyDelete
  5. Syaa nak minta izin ambil template ni yaa :D Comey lahhh . Geram ni :D

    ReplyDelete
  6. Minta nak guna template nih bole ? Comel sangad lorhh .

    ReplyDelete
  7. Akak , ajarkan sye mcm mne nk buat header meja tuh please :)

    ReplyDelete
  8. aten akak buat freebies nya nanti :)

    ReplyDelete
  9. Akak Aten , Aida ambek sikit2 code dye tapi tak guna pon template :) Sorry , and akak ada templete yang tak ada navi bar tak ? semua ada kat tepi . Anyway , thanks a lot :D

    ReplyDelete
  10. okay , but must credit it to me as based code. nanti akak buatkan template lain.

    ReplyDelete
  11. adik! comel sangat template yg adik buat ni. Akak pakai tau? jangan risau, kredit akak tak remove. :)

    ReplyDelete
  12. cantik..nk guna nie ya...^^mnx kbnran..

    ReplyDelete
  13. aten! aen guna yaaa (= awesome betul wooo :0 bhe

    ReplyDelete
  14. hehe, nak tanya lagi header tu guna font apa tolong balas. www.aingraphic.my

    ReplyDelete
  15. Use this skin :) Tapi tak delete credit kayy :D

    ReplyDelete
  16. gunalah, but dont remove the credit please

    ReplyDelete
  17. assalamualaikum. awk kita nak guna tau. comelll sangat sangat

    ReplyDelete
  18. Hai kak aten ! saya guna yaa ? xD

    ReplyDelete
  19. izinkn sye guna skin ni yew :)

    ReplyDelete
  20. Assalamualaikum, terima kasih! Najwa minx izin utk guna! :D

    ReplyDelete
  21. saya simpan boleh ? tak gune lagi heheh... Comel la.. =DD

    ReplyDelete
  22. hye fatin..kita amik tau skin nie sbb comel sgt tp kita ade tukar beberapa link tp tak remove credits :)

    ReplyDelete
  23. saya guna ye kak fatin,, terlampau cantik ar,,,haha
    tq

    ReplyDelete
  24. Saya guna ya kak fatin :) tapi kan kak , saya dh copy & paste tapi tak boleh la kak . macam mana ya ?

    ReplyDelete
    Replies
    1. dah tukar kepada clasic template ke belum? kena tukar baru jadi :)

      Delete
  25. salam ziarah
    fatin

    blh x sya guna nie
    so cute

    ReplyDelete

Terima kasih atas komen yang diberikan. Jangan lupa datang lagi untuk cerita yang terbaru. Salam sayang dari owner blog

 
Thankyou for visiting | Template made by Fatin Hazwani.