Opzzpinky | Lifestyle Blogger: template pink

Freebies Code denim - Pinkish's Blog

sHaRiNa eLyaNa March 10, 2013 49 Comments

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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgksKTNYE2x6Z6fMbkn2i1MstUttfN-aEeWle39hRH7JOiNTY-3xEosbv23m7oHUa0SN0MRVIscRcPNJeyCPmBYeK8Ije5i8pVI0dVgMZre8_pYuzfCUGef8wuS0SKDf6XTKFFvGLZqK2I/s320/for+sidebar.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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgksKTNYE2x6Z6fMbkn2i1MstUttfN-aEeWle39hRH7JOiNTY-3xEosbv23m7oHUa0SN0MRVIscRcPNJeyCPmBYeK8Ije5i8pVI0dVgMZre8_pYuzfCUGef8wuS0SKDf6XTKFFvGLZqK2I/s320/for+sidebar.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'>


<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>


<div class='clear'> </div>

</div> 

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

</div></div> 
<b:include data='blog' name='google-analytics'/>

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

<center>♥ Copyright © 2013 ♥</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 :)