Saturday, 1 December 2012

CARA GUNA DENIM TEMPLATE

so tanpa berlengah jom kita membuat denim. tutorial dari → http://mia-udax.blogspot.com/ jom jom mula ye.

 1. DASHBOARD → TEMPLATE 

 2. EDIT HTML

 3. KLIK PROCEED

 4. DELETE SEMUA KOD KAT EDIT HTML

 5. COPY KOD TEMPLATE YANG KORUNK NAK KAT KOTAK EDIT HTML YANG KORUNK DELETE TADI

 6. PREVIEW kalau jadi SAVE

 CONTOH CODE HTML YANG KORUNK PERLU ADA

<?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>
    <meta expr:content='data:blog.metaDescription' name='description'/>
    <b:skin><![CDATA[/*
-----------------------------------------------
! DON'T REMOVE THIS !
Blogger Template Style
Name:     Aien story
Designer: Nur Ain Qistina bt. Mahmud Rasid
URL:      http://aienstory-aien.blogspot.com
Date:     03 december 1997
! DON'T REMOVE THIS !
-----------------------------------------------
*/
#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="#336699" value="transparent">
 <Variable name="headerTextColor" description="Page Header Text Color"
           type="color" default="#ffffff" value="#ffffff">
 <Variable name="headerCornersColor" description="Page Header Corners Color"
           type="color" default="#528bc5" 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="#ffffff">
 <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% Century Gothic, Arial, Sans-serif;" value="normal normal 100% Century Gothic, Arial, Sans-serif;">
 <Variable name="headerFont" description="Page Header Font"
           type="font" default="normal normal 210% Century Gothic, Arial, Sans-serif;" value="normal normal 210% Century Gothic, 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 {
background:$bgcolor;
Background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQgfvsHLCch1Lcq_SvggapqmfCyWuLDMIEP1MmGBI3GlgC3VssOhzZGqoyoOvivvhJDESDCyb9xCOt1WqaNIIL2-0CX6LD4VyyCYjcMoXRnJn9EdJbGudoH9wNgTjicNw-FuhlmL3hyfI/s320/xdsz.jpg);
background-repeat: repeat;
background-position:Center center;
background-attachment:Fixed;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
cursor: url(http://www.drikoti.net/Goodies/Cursor/News/Gifs/01.gif
), auto;
}
::-moz-selection{
background: transparent;
color: #ABD7FF;
}
::selection {
background: transparent;
color: #ABD7FF;
}
::-webkit-scrollbar {
height:12px;
width: 10px;
background: #FFFFFF;
}
::-webkit-scrollbar-thumb {
background-color: #ABD7FF;
-moz-border-radius: 10px;
border-radius: 10px;
}
u {
text-decoration: none;
border-bottom: 2px solid #ABD7FF;
}
a:link {
color: #ABD7FF;
text-decoration:none;
}
a:visited {
color: #ABD7FF;
text-decoration:none;
}
a:hover {
text-shadow: 1px 1px 3px #CCCCCC;
color: #000000;
cursor: crosshair;
}
a img {
  border-width: 0;
}
#outer-wrapper {
  font: $bodyFont;
}
/* Header
----------------------------------------------- */
#header-wrapper {
  margin:0;
  padding: 0;
  background-color: $headerCornersColor;
  text-align: $startSide;
}
#header {
  width: 760px;
  margin: 0 auto;
  background-color: $headerBgColor;
  border: 1px solid $headerBgColor;
  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%;
}
.Header img {
  margin-$startSide: auto;
  margin-$endSide: auto;
}
                                                       
/* Content
----------------------------------------------- */
.clear {
  clear: both;
}

#content-wrapper {
  border-top: 3px solid #ABD7FF;
  border-left: 3px solid #ABD7FF;
  border-right: 3px solid #ABD7FF;
  border-bottom: 3px solid #ABD7FF;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  width: 760px;
  margin: 0 auto;
  padding: 0 0 15px;
  text-align: $startSide;
  background-color: $mainBgColor;
}
#main-wrapper {
  margin-$startSide: 14px;
  width: 464px;
  float: $startSide;
  background-color: $mainBgColor;
  display: inline;       /* fix for doubling margin in IE */
  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 {
  margin-$endSide: 14px;
  width: 240px;
  float: $endSide;
  background-color: $mainBgColor;
  display: inline;       /* fix for doubling margin in IE */
  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 {
  margin: 1.5em 0 0;
  font-weight: normal;
  color: $dateHeaderColor;
  font-size: 100%;
}
.post {
  margin: 0 0 1.5em;
  padding-bottom: 1.5em;
}
.post-title {
  margin: 1.6em 0 .5em;
  padding: 4px 5px;
  text-align:right;
  font-family:La Chata, Century Gothic;
  font-size: 135%;
  line-height: 1.1em;
  background-color: #FFFEFF;
  border-top: 1px solid #FF7C7C;
  border-bottom: 2px solid #ABD7FF;
  padding: 3px;
}
.post-title a, .post-title a:visited, .post-title strong {
  text-decoration: none;
  color: $textColor;
  font-weight: bold;
}
.post div {
  margin: 0 0 .75em;
  line-height: 1.3em;
}
.post-footer {
  margin: -.25em 0 0;
  color: $textColor;
  font-size: 87%;
}
.post-footer .span {
  margin-$endSide: .3em;
}
.post img, table.tr-caption-container {
  padding: 4px;
  border: 1px solid $borderColor;
}
.tr-caption-container img {
  border: none;
  padding: 0;
}
.post blockquote {
border:2px solid #ABD7FF;
border-radius:7px;
color: #DFF7FF;
padding: 5px;
-webkit-transition:1s;
}
.post blockquote:hover {
border:2px solid #DFF7FF;
border-radius:10px;
color: #ABD7FF;
padding: 5px;
-webkit-transition:1s;
}
.post blockquote p {
margin: .75em 0;
}
/* Comments
----------------------------------------------- */
#comments h4 {
  margin: 1em 0;
  color: $dateHeaderColor;
}
#comments h4 strong {
  font-size: 110%;
}
#comments-block {
  margin: 1em 0 1.5em;
  line-height: 1.3em;
}
#comments-block dt {
  margin: .5em 0;
}
#comments-block dd {
  margin: .25em 0 0;
}
#comments-block dd.comment-footer {
  margin: -.25em 0 2em;
  line-height: 1.4em;
  font-size: 78%;
}
#comments-block dd p {
  margin: 0 0 .75em;
}
.deleted-comment {
  font-style:italic;
  color:gray;
}
.feed-links {
  clear: both;
  line-height: 2.5em;
}
#blog-pager-newer-link {
  float: $startSide;
 }
#blog-pager-older-link {
  float: $endSide;
 }
#blog-pager {
  text-align: center;
 }
/* Sidebar Content
----------------------------------------------- */
.sidebar h2 {
  text-align:right;
  font-family:La Chata, Century Gothic;
  font-size: 135%;
  background-color: #FFFEFF;
  border-top: 1px solid #FF7C7C;
  border-bottom: 2px solid #ABD7FF;
  margin: 2.0em 0 .5em;
  padding: 4px 5px;
  font-size: 100%;
  color: $sidebarTitleTextColor;
}
                                                         
.sidebar ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.sidebar li {
  margin: 0;
  padding-top: 0;
  padding-$endSide: 0;
  padding-bottom: .5em;
  padding-$startSide: 15px;
  text-indent: -15px;
  line-height: 1.5em;
}
.sidebar {
  color: $textColor;
  line-height:1.3em;
}
.sidebar .widget {
  margin-bottom: 1em;
}
.sidebar .widget-content {
  margin: 0 5px;
}
/* Profile
----------------------------------------------- */
.profile-img {
  float: $startSide;
  margin-top: 0;
  margin-$endSide: 5px;
  margin-bottom: 5px;
  margin-$startSide: 0;
  padding: 4px;
  border: 1px solid $borderColor;
}
.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 {
  clear: both;
  text-align: center;
  color: $textColor;
}
#footer .widget {
  margin:.5em;
  padding-top: 20px;
  font-size: 85%;
  line-height: 1.5em;
  text-align: $startSide;
}
]]></b:skin>
  </head>
  <body>
  <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='Aien Story (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='HTML1' locked='false' title='Talk here' type='HTML'/>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' 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>
<center>Template Edited By <a href='http://aienstory-aien.blogspot.com'>Aien Story</a> &#9829; All Rights Reserved &#169; 18 Feb 2012</center>
  </div></div> <!-- end outer-wrapper -->
  <b:include data='blog' name='google-analytics'/>
</body>
</html>
             
   
saya ambik daripada orang yang sama pada link di atas tadi. terima kasih.
Posted by at
Labels:

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)