Freebies Code denim - Pinkish's Blog



Assalamualaikum
alhamdulillah siap akhirnya template ini..seperti dijanjikan..edit blog dah closed..ramai yang tanya kenapa? mengapa? ceh..tak apa korang jangan bimbang..template kali ini cute mesti ngam di hati blogger pink hehe..korang boleh ambil dengan syarat do credit to me - please respect my own work..thanks..

gambar keseluruhan blog
contoh post-title,comment box,post-blockquote dan date header


contoh footer dan sidebar

code pinkish's blog

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
  <head>
    <b:include data='blog' name='all-head-content'/>
    <title><data:blog.pageTitle/></title>
    <b:skin><![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name:     Denim
Designer: Sharina Elyana
Url : www.opzzpinky.com
Date:     06 March 2013
-----------------------------------------------
*/

#navbar-iframe {
display: none !important;
}
/* Variable definitions
   ====================
 <Variable name="bgColor" description="Page Background Color"
           type="color" default="#efefef" value="#efefef">
 <Variable name="textColor" description="Text Color"
           type="color" default="#333333" value="#333333">
 <Variable name="linkColor" description="Link Color"
           type="color" default="#336699" value="#336699">

 <Variable name="headerBgColor" description="Page Header Background Color"
           type="color" default="transparent" value="transparent">
 <Variable name="headerTextColor" description="Page Header Text Color"
           type="color" default="transparent" value="transparent">
 <Variable name="headerCornersColor" description="Page Header Corners Color"
           type="color" default="transparent" value="transparent">

 <Variable name="mainBgColor" description="Main Background Color"
           type="color" default="#ffffff" value="#ffffff">
 <Variable name="borderColor" description="Border Color"
           type="color" default="#cccccc" value="#cccccc">
 <Variable name="dateHeaderColor" description="Date Header Color"
           type="color" default="#999999" value="#999999">

 <Variable name="sidebarTitleBgColor" description="Sidebar Title Background Color"
           type="color" default="#ffd595" value="#ffd595">
 <Variable name="sidebarTitleTextColor" description="Sidebar Title Text Color"
           type="color" default="#333333" value="#333333">

 <Variable name="bodyFont" description="Text Font"
           type="font" default="normal normal 100% Verdana, Arial, Sans-serif;" value="normal normal 100% Verdana, Arial, Sans-serif;">
 <Variable name="headerFont" description="Page Header Font"
           type="font" default="normal normal 210% Verdana, Arial, Sans-serif;" value="normal normal 210% Verdana, Arial, Sans-serif;">

   <Variable name="startSide" description="Start side in blog language"
             type="automatic" default="left" value="left">
   <Variable name="endSide" description="End side in blog language"
             type="automatic" default="right" value="right">
*/

body {
text-align: center;
background: url(http://0.tqn.com/d/graphicssoft/1/0/w/2/5/Pastel-Wash-Pattern01.png);
color: black;
font-size:12px;
font-family: 'Elsie Swash Caps', cursive;
letter-spacing: 1px;
}

a:link {
color: #FAAFBE;
text-decoration:none;
}

a:visited {
color: #000000;
text-decoration:none;
}
a img {
  border-width: 0;
}

#outer-wrapper {
  font: $bodyFont;
}

/* Header
----------------------------------------------- */
#header-wrapper {
  margin:0;
  padding: 0;
  text-align: $startSide;
}

#header {
  width: 1000px;
height : 400px;
  margin: 0 auto;
background: url(http://i.imgur.com/ci80TG8.png);
  color: $headerTextColor;
  padding: 0;
  font: $headerFont;
}

h1.title {
  padding-top: 38px;
  margin: 0 14px .1em;
  line-height: 1.2em;
  font-size: 100%;
}

h1.title a, h1.title a:visited {
  color: $headerTextColor;
  text-decoration: none;
}

#header .description {
  display: block;
  margin: 0 14px;
  padding: 0 0 40px;
  line-height: 1.4em;
  font-size: 50%;
}
                                                       
/* Content
----------------------------------------------- */

.clear {
  clear: both;
}

#content-wrapper {
width: 960px;
margin:0 auto;
padding:20px;
text-align:left;
font: normal normal 99% Verdana, sans-serif;
background:url(http://i.imgur.com/XQeftzQ.png);
}

#main-wrapper {
width: 600px;
margin-left: 20px;
float: left;
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: 300px;
margin-right: 15px;
float: right;
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 */
}

#footer-wrapper {
width: 960px;
background: url(http://i.imgur.com/1mDF48M.png) no-repeat;
margin:0 auto;
padding:20px;
text-align:left;
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 */
}


/* Headings
----------------------------------------------- */
h2, h3 {
  margin: 0;
}

/* Posts
----------------------------------------------- */
.date-header {
text-align:center;
text-shadow: 2px 2px 3px #00000;
font: 12px verdana;
color: #000000;
border-top: 1px solid  #FAAFBE;
border-left: 1px solid  #FAAFBE;
border-right: 1px solid  #FAAFBE;
border-bottom: 1px solid  #FAAFBE;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
padding :5px;
margin-top: 10px;
background-color: #fbb9d0;
}
.post-footer {
text-align:center;
background: url(http://4.bp.blogspot.com/-qvcmkDxRU8A/UC8n2ASKpFI/AAAAAAAABT8/RaDi-XthLrg/s320/for%2Bsidebar.png);
border-bottom: double 5px #FAAFBE;
border-top: double 5px #FAAFBE;
margin: 0 0 0em 0;
padding :15px;
font-size:12px;
color: #f86f8e;
text-shadow: 1px 1px 1px #000000;
line-height:0.1em;
}

.post {
margin:0px 0px 0px 0px;
padding:1.0em 0px;
border-right: double 5px #FAAFBE;
border-left: double 5px #FAAFBE;
}

.post h3 {
text-align:center;
background: url(http://4.bp.blogspot.com/-qvcmkDxRU8A/UC8n2ASKpFI/AAAAAAAABT8/RaDi-XthLrg/s320/for%2Bsidebar.png);
border-bottom: double 4px #FAAFBE;
border-top: double 5px #FAAFBE;
margin: -0.4em 0 .5em;
font-size:16px;
padding :20px;
color: #f86f8e;
text-shadow: 1px 1px 1px #000000;
line-height:0.1em;
}

.post h3 a, .post h3 a:visited, .post h3 strong {
color: #f86f8e;
text-shadow: 0px 1px px #000000;
display:block;
font-weight:bold;
text-decoration:none;
}
.post h3 strong,.post h3 a:hover {
color:#ebb2c7;
}
.post-body {
text-align:right;
padding:35px;
line-height:1.3em;
margin:0px 0 0.75em;
}
.post-body blockquote {
line-height:1.3em;
}

.post blockquote {
 margin: 1.6em 0 .5em;
text-align: center;
 padding: 4px 5px;
background-color: pink;
color: black;
font-size:14px;
font-family: 'Elsie Swash Caps', cursive;
letter-spacing: 1px;
border-top-left-radius: 25px 25px;
border-top-right-radius: 25px 25px;
border-bottom-left-radius: 25px 25px;
border-bottom-right-radius: 25px 25px;
}

.post blockquote:hover {
color: black;
border:1px dashed #FAAFBE;
border-right:5pt double #FAAFBE;
-moz-box-shadow: 0 0 10px #FAAFBE;
-webkit-box-shadow: 0 0 18px #FAAFBE;
}

/* Comments
----------------------------------------------- */
#comments-block{
margin:0;
padding:0;
}
#comments-block .comment-author{
background:#FAAFBE !important;
-moz-border-radius-topleft: 0px;
-moz-border-radius-topright: 10px;
padding:5px;
font-size:15px;
font-weight:bold;
border:1px solid #FAAFBE;
}
#comments-block .comment-body{
margin:0 0 .60em;
padding: 5px 5px 5px 5px;
background: url(http://0.tqn.com/d/graphicssoft/1/0/w/2/5/Pastel-Wash-Pattern01.png);
repeat top left;
-moz-border-radius: 20px 20px / 20px 20px;
border-radius: 5px 5px / 5px 5px;
font-size: 16px;
border-left: 1px dashed #FAAFBE;
border-right: 1px dashed #FAAFBE;
margin-top: -5px; /*position*/
}
#comments-block .comment-footer{
margin:0;
font-size: 13px;
font-weight: normal;
margin-bottom: 20px;
border-left: 1px dashed #FAAFBE;
border-right: 1px dashed #FAAFBE;
border-bottom: 1px dashed #FAAFBE;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
margin-top: -12px; /*position*/
padding: 5px;
}
#comments-block .deleted-comment{
font-style:italic;
color:gray;
}
#comments-block .comment-author a{
color:#ffffff !important;
}
#comments-block .comment-footer a, .comment-body a{
color:#000000 !important;
}

/* Sidebar Content
----------------------------------------------- */
.sidebar h2 {
font-size:16px;
color: #f86f8e;
text-shadow: 1px 1px 1px #000000;
line-height:0.1em;
text-align:center;
padding:40px 30px 40px 30px;
margin-bottom:4px;
font-weight:bold;
background:url("http://i.imgur.com/jAjwlY7.png");
background-repeat:no-repeat;
background-position:center top;}
.sidebar .widget-content{
margin-bottom:-30px;
margin-top:-40px;
padding: 5px 5px 5px 15px;
text-align:left;
color:#444444;
background: url("")repeat-y center;
background-position:center top;
}
.sidebar .widget{
margin-bottom:10px;
margin-top:10px;
padding:0 0 47px 0;
background:url("");
background-repeat:no-repeat;background-position:center bottom;}
body#layout #crosscol-wrapper{ margin-top: 0px; padding-top: 0px}
/* Profile
----------------------------------------------- */
.profile-img {
  float: $startSide;
  margin-top: 0;
  margin-$endSide: 5px;
  margin-bottom: 5px;
  margin-$startSide: 0;
  padding: 4px;
border: 2px solid#F5A9BC;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-bottom-left-radius:14px;
-webkit-border-bottom-right-radius:14px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-webkit-border-top-left-radius:20px;
-webkit-border-top-right-radius:20px;
}

.profile-data {
  margin:0;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-weight: bold;
  line-height: 1.6em;
  font-size: 78%;
}

.profile-datablock {
  margin:.5em 0 .5em;
}

.profile-textblock {
  margin: 0.5em 0;
  line-height: 1.6em;
}

                                                       
/* Footer
 ----------------------------------------------- */

#footer {
}

#footer .widget {
  text-align: $startSide;
}

::-webkit-scrollbar {
height:10px;
width: 8px;
background: #ffffff;
}
::-webkit-scrollbar-thumb {
background-color: #FE2EC8;
border: 1px solid #F781F3;
border-left: 7px solid #F5A9BC;
border-right: 7px solid #F5A9BC;
border-radius:7px;
}

.sidebar ul li {background:url("http://i805.photobucket.com/albums/yy331/momoirobox/clickable%20smilies/060gif.gif") no-repeat 2px .25em;
margin:0;padding:0 0 3px 10px;
margin-bottom:2px;
text-indent:20px;line-height:1.3em;}
]]></b:skin>
  </head>

  <body>
  <b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'>
<b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar'/>
</b:section>

  <div id='outer-wrapper'><div id='wrap2'>

    <!-- skip links for text browsers -->
    <span id='skiplinks' style='display:none;'>
      <a href='#main'>skip to main </a> |
      <a href='#sidebar'>skip to sidebar</a>
    </span>

    <div id='header-wrapper'>
      <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='! ♥ Sha Join Bah ♥  ! (Header)' type='Header'/>
</b:section>
    </div>

    <div id='content-wrapper'>

      <div id='crosscol-wrapper' style='text-align:center'>
        <b:section class='crosscol' id='crosscol'/>
      </div>

      <div id='main-wrapper'>
        <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
      </div>

      <div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Profile1' locked='false' title='DeOwner' type='Profile'/>
<b:widget id='Followers1' locked='false' title='Friends' type='Followers'/>
<b:widget id='BlogArchive1' locked='false' title='Past and Present' type='BlogArchive'/>
</b:section>
      </div>

      <!-- spacer for skins that want sidebar and main to be the same height-->
      <div class='clear'>&#160;</div>

    </div> <!-- end content-wrapper -->

    <div id='footer-wrapper'>
      <b:section class='footer' id='footer'/>
    </div>

  </div></div> <!-- end outer-wrapper -->
  <b:include data='blog' name='google-analytics'/>

<script type='text/javascript'>
    window.setTimeout(function() {
        document.body.className = document.body.className.replace(&#39;loading&#39;, &#39;&#39;);
      }, 10);
  </script>

<center>&#9829; Copyright &#169; 2013 &#9829;</center>
</body>
</html>


cara nak masukkan ke dalam blog
sebelum mula, korang dinasihatkan untuk backup template asal..takut ada kesalahan atau xberkenan nanti blog jadi buruk jangan salahkan sha ya hihi..

  • Dashboard > Template > Edit HTML > Tick
  • Copy code Denim
  • dan paste pada ruangan template
  • dah siap edit korang klik button save dan keep widget tengok gambar di bawah



Kod ini termasuklah home/newer/older design, header free dan footer :)
#kod yang sebelum ini telah dipadam..hope template ini dapat membantu korang dalam mencantikkan blog..cer komen sikit :)

49 Comments

Assalamualaikum..terima kasih sebab singgah, komen yang baik2 ja tau !! nanti sha singgah blog korang..In Sha Allah :)

  1. wahhh cantiknyaa , Ninaa nak ambik boleh ?

    ReplyDelete
  2. takut salah tu yang mals nak buat ni...

    sha takpe...rajin ..leh edit kalau salah

    ReplyDelete
  3. This comment has been removed by a blog administrator.

    ReplyDelete
  4. acece..dah rajin buat freebies..=) keep it up sha!!

    ReplyDelete
  5. dah cuba guna template ni....cute tapi xtaula betul ke tak...thanks utk freebies...

    ReplyDelete
  6. akak nak tanya kenapa template tu tak keluar copyright by sharina elyana kat bawah...ke akak salah copy?

    ReplyDelete
  7. This comment has been removed by a blog administrator.

    ReplyDelete
  8. ana ambil ye,thanks for this code.. :)

    ReplyDelete
  9. waahhh hebat2.. sye amik yerr.. nti sye credit kat awkk.. ^^

    ReplyDelete
  10. cantik nye kak sha :D suke tengok .

    ReplyDelete
  11. sya amek jgakkk...cutee gilerr...tq

    ReplyDelete
  12. assalamualaikum,ana guna template ni untuk blog http://bermulakisahbulanmei.blogspot.com/.

    terima kasih untuk template ini ya.

    ReplyDelete
  13. cantik ! anis amik untuk second blog . boleh tak ajar anis macam mana nak buat header macam tu ?

    ReplyDelete
  14. thanks, untk template yang kiut ni. sy amik taw ~~ ^__^

    ReplyDelete
  15. mohon kebenaran untuk ambil.. =)

    ReplyDelete
  16. assalam...
    ika guna header nie utk blog ika...
    jemput singgah...still kosong sbb bru buad...

    http://pwincessnknisha.blogspot.com/

    ReplyDelete
  17. wahhh cantiknyaa , yana
    nak ambik boleh ?

    ReplyDelete
  18. Terima Kasih yer ;) btw..cutee sgt

    ReplyDelete
  19. This comment has been removed by a blog administrator.

    ReplyDelete
  20. Im using this. thank you so much :))

    ReplyDelete
  21. This comment has been removed by a blog administrator.

    ReplyDelete
  22. salam sis, sy nk mhon amik code template ni ye..thanks for this code. :)

    ReplyDelete
  23. slm sis, sy nk mhon amik code ni ye..btw thanks ye. :)

    ReplyDelete
  24. cute..saya guna yee..

    ReplyDelete
  25. cute..saya guna yee..

    ReplyDelete
  26. Huaa !! Nak boleh tak? Comalnya.Thanks

    ReplyDelete
  27. gorgeous :) saya amik ye :) thanks :)

    ReplyDelete
  28. assalamualaikum...minat saya dgn header ni...sy minta izin ambil ya.thanks

    ReplyDelete
  29. assalamualaikun...berkenaan pulok sy..minta izin ambil ya.

    ReplyDelete

Post a Comment

Assalamualaikum..terima kasih sebab singgah, komen yang baik2 ja tau !! nanti sha singgah blog korang..In Sha Allah :)

Previous Post Next Post