Bahagian ini untuk tab.Korang boleh buat tab ikut tutorial ini di Hajaaminho.Lepas tu just letak code tab kat HTML Gadget okey.

Thursday, January 12, 2012

Kod Untuk Picture Window

Yang ini sama sahaja.Tapi aku buat untuk orang yang malas nak download template tu kan.Copy Paste je la.Preview sama je macam blog aku nih.Nak buat header bersambung,dan picture window nya tidak transparent lagi.





<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:version='2' class='v2' 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>
<style>body {cursor:url(http://ego-box.com/cursors/20.ani), url(http://i214.photobucket.com/albums/cc105/24168/egobox/vf/yours/cursors/20.gif), auto;} </style>
<script type='text/javascript'>
if(document.location.protocol=='http:'){
var Tynt=Tynt||[];Tynt.push('dNn3Bsljmr4l2madbi-bnq');Tynt.i={"st":true,"ap":"Read more:"};
(function(){var s=document.createElement('script');s.async="async";s.type="text/javascript";s.src='http://tcr.tynt.com/ti.js';var h=document.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})();
}
</script>

<!--RAINBOW-LINKS-STARTS-->
<script src='http://files.bloggerbuzz.net/uploads/4/1/9/0/4190919/rainbowlink.js'/>
<!--RAINBOW-LINKS-STOPS-@-HELP-http://www.bloggerbuzz.net-->
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
<b:if cond='data:blog.isMobile'>
<meta content='width=device-widthh,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/>
</b:if>
<b:include data='blog' name='all-head-content'/>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>

<b:skin><![CDATA[/*-----------------------------------------------

Blogger Template Style
Name: Picture Window
Designer: Josh Peterson
URL: http://www.noaesthetic.com/
----------------------------------------------- */

/* Variable definitions
====================
<Variable name="keycolor" description="Main Color" type="color" default="#1a222a" value="#c75048"/>
<Variable name="body.background" description="Body Background" type="background"
color="$(body.background.color)" default="#111111 url(http://themes.googleusercontent.com/image?id=1OACCYOE0-eoTRTfsBuX1NMN9nz599ufI1Jh0CggPFA_sK80AGkIr8pLtYRpNUKPmwtEa) repeat-x fixed top center" value="$(color) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWzxY1uPMufYUJtheV-3kKZEWP5ADEGd2TTvzUxBkTQOjezANmXA13kL6GBJ6OAwduTqTpo1O8fyiuLlBsu2Cp68YgYtXA1w1VFigm2KJu-Fwfv3UPJmXWCGyJqkkcqgjXBW82hqRnjC0Y/s0/76.gif) repeat fixed top left"/>

<Group description="Page Text" selector=".content-inner">
<Variable name="body.font" description="Font" type="font"
default="normal normal 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 13px Verdana, Geneva, sans-serif"/>
<Variable name="body.text.color" description="Text Color" type="color" default="#333333" value="#000000"/>
</Group>

<Group description="Backgrounds" selector=".body-fauxcolumns-outer">
<Variable name="body.background.color" description="Outer Background" type="color" default="#296695" value="#ba3333"/>
<Variable name="header.background.color" description="Header Background" type="color" default="transparent" value="transparent"/>
<Variable name="post.background.color" description="Post Background" type="color" default="#ffffff" value="#ffffff"/>
</Group>

<Group description="Links" selector=".main-outer">
<Variable name="link.color" description="Link Color" type="color" default="#336699" value="#0000ff"/>
<Variable name="link.visited.color" description="Visited Color" type="color" default="#6699cc" value="#0000ff"/>
<Variable name="link.hover.color" description="Hover Color" type="color" default="#33aaff" value="#3d85c6"/>
</Group>

<Group description="Blog Title" selector=".header">
<Variable name="header.font" description="Title Font" type="font"
default="normal normal 36px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 42px Nobile"/>
<Variable name="header.text.color" description="Text Color" type="color" default="#ffffff" value="#ffffff"/>
</Group>

<Group description="Tabs Text" selector=".tabs-outer .PageList">
<Variable name="tabs.font" description="Font" type="font"
default="normal normal 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 15px Verdana, Geneva, sans-serif;"/>
<Variable name="tabs.text.color" description="Text Color" type="color" default="#ffffff" value="#ffffff"/>
<Variable name="tabs.selected.text.color" description="Selected Color" type="color" default="$(link.color)" value="#000000"/>
</Group>


<Group description="Post" selector=".post blockquote .post">
<Variable name="post.title.font" description="Title Font" type="font"
default="normal normal 18px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 16px Verdana, Geneva, sans-serif"/>
<Variable name="post.footer.text.color" description="Footer Text Color" type="color" default="#999999" value="#000000"/>
<Variable name="post.border.color" description="Border Color" type="color" default="#dddddd" value="transparent"/>
</Group>

<Group description="Gadgets" selector=".sidebar .widget">
<Variable name="widget.title.font" description="Title Font" type="font"
default="bold normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal bold 14px Mountains of Christmas"/>
<Variable name="widget.title.text.color" description="Title Color" type="color" default="#888888" value="#000000"/>
</Group>

<Group description="Footer" selector=".footer-outer">
<Variable name="footer.text.color" description="Text Color" type="color" default="#cccccc" value="#d2d2d2"/>
<Variable name="footer.widget.title.text.color" description="Gadget Title Color" type="color" default="#aaaaaa" value="#000000"/>
</Group>

<Group description="Footer Links" selector=".footer-outer">
<Variable name="footer.link.color" description="Link Color" type="color" default="#99ccee" value="#3d85c6"/>
<Variable name="footer.link.visited.color" description="Visited Color" type="color" default="#77aaee" value="#0000ff"/>
<Variable name="footer.link.hover.color" description="Hover Color" type="color" default="#33aaff" value="#3d85c6"/>
</Group>

<Variable name="content.margin" description="Content Margin Top" type="length" default="20px" value="20px"/>
<Variable name="content.padding" description="Content Padding" type="length" default="0" value="0"/>
<Variable name="content.background" description="Content Background" type="background"
default="transparent none repeat scroll top left" value="transparent none repeat scroll top left"/>
<Variable name="content.border.radius" description="Content Border Radius" type="length" default="0" value="0"/>
<Variable name="content.shadow.spread" description="Content Shadow Spread" type="length" default="0" value="0"/>

<Variable name="header.padding" description="Header Padding" type="length" default="0" value="0"/>
<Variable name="header.background.gradient" description="Header Gradient" type="url"
default="none" value="none"/>
<Variable name="header.border.radius" description="Header Border Radius" type="length" default="0" value="0"/>

<Variable name="main.border.radius.top" description="Main Border Radius" type="length" default="20px" value="20px"/>
<Variable name="footer.border.radius.top" description="Footer Border Radius Top" type="length" default="0" value="0"/>
<Variable name="footer.border.radius.bottom" description="Footer Border Radius Bottom" type="length" default="20px" value="20px"/>
<Variable name="region.shadow.spread" description="Main and Footer Shadow Spread" type="length" default="3px" value="3px"/>
<Variable name="region.shadow.offset" description="Main and Footer Shadow Offset" type="length" default="1px" value="1px"/>

<Variable name="footer.background" description="Footer Background" type="background"
default="transparent url(http://www.blogblog.com/1kt/transparent/black50.png) repeat scroll top center" value="transparent url(http://www.blogblog.com/1kt/transparent/black50.png) repeat scroll top center"/>

<Variable name="tab.border.radius" description="Tab Border Radius" type="length" default="10px" value="10px"/>
<Variable name="tab.first.border.radius" description="First Tab Border Radius" type="length" default="10px" value="10px"/>
<Variable name="tabs.border.radius" description="Tabs Border Radius" type="length" default="0" value="0"/>

<Variable name="tabs.spacing" description="Tab Spacing" type="length" default=".25em" value=".25em"/>
<Variable name="tabs.margin.bottom" description="Tab Margin Bottom" type="length" default="0" value="0"/>
<Variable name="tabs.margin.sides" description="Tab Margin Sides" type="length" default="20px" value="20px"/>

<Variable name="main.background" description="Main Background" type="color"
default="#ffffff" value="#ffffff"/>
<Variable name="main.padding.sides" description="Main Padding Sides" type="length" default="20px" value="20px"/>

<Variable name="post.margin.sides" description="Post Margin Sides" type="length" default="-20px" value="-20px"/>
<Variable name="post.border.radius" description="Post Border Radius" type="length" default="5px" value="5px"/>
<Variable name="widget.title.text.transform" description="Widget Title Text Transform" type="string" default="uppercase" value="uppercase"/>

<Variable name="startSide" description="Side where text starts in blog language" type="automatic" default="left" value="left"/>
<Variable name="endSide" description="Side where text ends in blog language" type="automatic" default="right" value="right"/>
*/

/* Content
----------------------------------------------- */
body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
}

html body .region-inner {
min-width: 0;
max-width: 100%;
width: auto;
}

.content-outer {
font-size: 90%;
}

a:link {
text-decoration:none;
color: $(link.color);
}

a:visited {
text-decoration:none;
color: $(link.visited.color);
}

a:hover {
text-decoration:underline;
color: $(link.hover.color);
}

.content-outer {
background: $(content.background);

-moz-border-radius: $(content.border.radius);
-webkit-border-radius: $(content.border.radius);
-goog-ms-border-radius: $(content.border.radius);
border-radius: $(content.border.radius);

-moz-box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);
-webkit-box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);
-goog-ms-box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);
box-shadow: 0 0 $(content.shadow.spread) rgba(0, 0, 0, .15);

margin: $(content.margin) auto;
}

.content-inner {
padding: $(content.padding);
}

/* Header
----------------------------------------------- */
.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll top center;
_background-image: none;

color: $(header.text.color);

-moz-border-radius: $(header.border.radius);
-webkit-border-radius: $(header.border.radius);
-goog-ms-border-radius: $(header.border.radius);
border-radius: $(header.border.radius);
}

.Header img, .Header #header-inner {
-moz-border-radius: $(header.border.radius);
-webkit-border-radius: $(header.border.radius);
-goog-ms-border-radius: $(header.border.radius);
border-radius: $(header.border.radius);
}

.header-inner .Header .titlewrapper,
.header-inner .Header .descriptionwrapper {
padding-left: $(header.padding);
padding-right: $(header.padding);

}

.Header h1 {
font: $(header.font);
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
}

.Header h1 a {
color: $(header.text.color);
}

.Header .description {
font-size: 130%;
}


/* Headings
----------------------------------------------- */
h2 {

font: $(widget.title.font);
text-transform: $(widget.title.text.transform);
color: $(widget.title.text.color);
background:url("http://i696.photobucket.com/albums/vv323/naz89_blog/back07.gif");
border: solid 2px #33CCFF ;
/* the border will curve into a 'D' */
-moz-border-radius: 40px 10px;
border-radius: 40px 10px;
margin:5px 5px;
padding:10px;
}
u {

text-decoration:underline; border-bottom: 2px double #66FFFF;}

/* Main
----------------------------------------------- */
.main-outer {
border: 2px solid #FFFFFF;
-moz-border-radius-bottomleft: 30px;
-moz-border-radius-bottomright: 30px;
background: $(main.background);

}

.main-inner {
padding: 15px $(main.padding.sides) 20px;
}

.main-inner .column-center-inner {
padding: 0 0;
}

.main-inner .column-left-inner {
padding-left: 0;
}

.main-inner .column-right-inner {
padding-right: 0;
}

/* Tabs
----------------------------------------------- */
.tabs-outer {
border: 2px solid #FFFFFF;
background: $(main.background);
padding-top: 20px;
padding-bottom: 10px;
}

/* Posts
----------------------------------------------- */
h3.post-title {
background: #99CCFF;
border: dashed #000000 2px;
/* the border will curve into a 'D' */
padding: 5px 5px;
margin: 0 $(post.margin.sides) 10px;

}

.comments h4 {
margin: 1em 0 0;
font: $(post.title.font);

}

.post-outer {
background-color: $(post.background.color);


padding: 15px 20px;
margin: 0 $(post.margin.sides) 20px;
}

.post-body {
line-height: 1.4;
font-size: 110%;
position: relative;
}
.post blockquote {
background:url("http://i696.photobucket.com/albums/vv323/naz89_blog/back07.gif");
border-left: solid 10px #33CCFF;

{
margin:0;
padding:0;
}

.post-header {
margin: 0 0 1.5em;

color: $(post.footer.text.color);
line-height: 1.6;
}

.post-footer {
margin: .5em 0 0;

color: $(post.footer.text.color);
line-height: 1.6;
}

#blog-pager {
font-size: 140%
}

#comments .comment-author {
padding-top: 1.5em;

border-top: dashed 1px #ccc;
border-top: dashed 1px rgba(128, 128, 128, .5);

background-position: 0 1.5em;
}

#comments .comment-author:first-child {
padding-top: 0;

border-top: none;
}

.avatar-image-container {
margin: .2em 0 0;
}

/* Widgets
----------------------------------------------- */
.widget ul, .widget #ArchiveList ul.flat {
padding: 0;
list-style: none;

}

.widget ul li, .widget #ArchiveList ul.flat li {
margin:0;
padding:0 0 2px 12px;
margin-bottom:3px;
line-height:1.4em;
border-top: solid 2px #ccc;
border-top: solid 2px rgba(128, 128, 128, .5);
}

.widget ul li:first-child, .widget #ArchiveList ul.flat li:first-child {
border-top: none;
}

.widget .post-body ul {
list-style: disc;
}

.widget .post-body ul li {
border: none;

}

/* Footer
----------------------------------------------- */
.footer-outer {
color:$(footer.text.color);
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhi9YSm_GjiRMQ462UK_pj7pePAMDfdYwFtSj46FyBG0ni35NyS9vB4_16ikII0YWNt3vzcw6oiV6DxRrx7dl0NYV0FhhgTN1kXI8PjkC_t3eD9TJYQ1FWEUtaZUbbnQQPD5nYeb34whIM/s1600/mata-lalat-footer.png") no repeat;
-moz-border-radius: $(footer.border.radius.top) $(footer.border.radius.top) $(footer.border.radius.bottom) $(footer.border.radius.bottom);
-webkit-border-top-left-radius: $(footer.border.radius.top);
-webkit-border-top-right-radius: $(footer.border.radius.top);
-webkit-border-bottom-left-radius: $(footer.border.radius.bottom);
-webkit-border-bottom-right-radius: $(footer.border.radius.bottom);
-goog-ms-border-radius: $(footer.border.radius.top) $(footer.border.radius.top) $(footer.border.radius.bottom) $(footer.border.radius.bottom);
border-radius: $(footer.border.radius.top) $(footer.border.radius.top) $(footer.border.radius.bottom) $(footer.border.radius.bottom);

-moz-box-shadow: 0 $(region.shadow.offset) $(region.shadow.spread) rgba(0, 0, 0, .15);
-webkit-box-shadow: 0 $(region.shadow.offset) $(region.shadow.spread) rgba(0, 0, 0, .15);
-goog-ms-box-shadow: 0 $(region.shadow.offset) $(region.shadow.spread) rgba(0, 0, 0, .15);
box-shadow: 0 $(region.shadow.offset) $(region.shadow.spread) rgba(0, 0, 0, .15);
}

.footer-inner {
padding: 10px $(main.padding.sides) 20px;
}

.footer-outer a {
color: $(footer.link.color);
}

.footer-outer a:visited {
color: $(footer.link.visited.color);
}

.footer-outer a:hover {
color: $(footer.link.hover.color);
}

.footer-outer .widget h2 {
color: $(footer.widget.title.text.color);
padding-top: 0px;
font-size: 85%;
line-height: 1.5em;
text-align: center;
}
}

#comments h4 {
margin: 1em 3em;
font-weight: bold;
line-height: 1.4em;
color: #ffffff;
}
#comments-block{
margin:0;
padding:0;
}
#comments-block .comment-author{
background:#33ccff !important;

-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;


padding:5px;

font-size:13px;

font-weight:bold;

border:1px solid #33ccff;
}
#comments-block .comment-body{
margin: 0;

font-size: 13px;

border-left: 1px solid #33ccff;
border-right: 1px solid #33ccff;
margin-top: -5px; /*position*/

padding: 5px;
}
#comments-block .comment-footer{
margin:0;

font-size: 13px;

font-weight: normal;

margin-bottom: 20px;

border-left: 1px solid #33ccff;
border-right: 1px solid #33ccff;
border-bottom: 1px solid #33ccff;

-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:#33ccff !important;
}
.post img{opacity:1;filter:alpha(opacity=1); this.style.opacity=6}
.post img:hover{opacity:.5;filter:alpha(opacity=100); this.style.opacity=1}
.region-inner {margin-top:0;}
.content-outer {margin-top:0;}
]]></b:skin>
<b:template-skin>
<b:variable default='930px' name='content.width' type='length' value='1000px'/>
<b:variable default='0' name='main.column.left.width' type='length' value='300px'/>
<b:variable default='360px' name='main.column.right.width' type='length' value='0px'/>

<![CDATA[
body {
min-width: $(content.width);
}

.content-outer, .content-fauxcolumn-outer, .region-inner {
min-width: $(content.width);
max-width: $(content.width);
_width: $(content.width);
}

.main-inner .columns {
padding-left: $(main.column.left.width);
padding-right: $(main.column.right.width);
}

.main-inner .fauxcolumn-center-outer {
left: $(main.column.left.width);
right: $(main.column.right.width);
/* IE6 does not respect left and right together */
_width: expression(this.parentNode.offsetWidth -
parseInt("$(main.column.left.width)") -
parseInt("$(main.column.right.width)") + 'px');
}

.main-inner .fauxcolumn-left-outer {
width: $(main.column.left.width);

}

.main-inner .fauxcolumn-right-outer {
width: $(main.column.right.width);

}

.main-inner .column-left-outer {
width: $(main.column.left.width);
right: 100%;
margin-left: -$(main.column.left.width);
}

.main-inner .column-right-outer {
width: $(main.column.right.width);
margin-right: -$(main.column.right.width);
}

#layout {
min-width: 0;
}

#layout .content-outer {
min-width: 0;
width: 800px;
}

#layout .region-inner {
min-width: 0;
width: auto;
}
]]>
</b:template-skin>

</head>
<script src='http://sites.google.com/site/copycatgroup/Home/jsfile/rainbowtext.js'/>
<body expr:class='"loading" + data:blog.mobileClass'>
<div class='body-fauxcolumns'>
<div class='fauxcolumn-outer body-fauxcolumn-outer'>
<div class='cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
<div class='fauxborder-left'>
<div class='fauxborder-right'/>
<div class='fauxcolumn-inner'>
</div>
</div>
<div class='cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>
</div>

<div class='content'>
<div class='content-fauxcolumns'>
<div class='fauxcolumn-outer content-fauxcolumn-outer'>
<div class='cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
<div class='fauxborder-left'>
<div class='fauxborder-right'/>
<div class='fauxcolumn-inner'>
</div>
</div>
<div class='cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>
</div>

<div class='content-outer'>
<div class='content-cap-top cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
<div class='fauxborder-left content-fauxborder-left'>
<div class='fauxborder-right content-fauxborder-right'/>
<div class='content-inner'>

<header>
<div class='header-outer'>
<div class='header-cap-top cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
<div class='fauxborder-left header-fauxborder-left'>
<div class='fauxborder-right header-fauxborder-right'/>
<div class='region-inner header-inner'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='false' title='Template Percuma Untuk Korang - Mari Download! (Header)' type='Header'/>
</b:section>
</div>
</div>
<div class='header-cap-bottom cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>
</header>

<div class='tabs-outer'>
<div class='tabs-cap-top cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
<div class='fauxborder-left tabs-fauxborder-left'>
<div class='fauxborder-right tabs-fauxborder-right'/>
<div class='region-inner tabs-inner'>
<b:section class='tabs' id='crosscol' maxwidgets='1' showaddelement='yes'>
<b:widget id='HTML9' locked='false' title='' type='HTML'/>
</b:section>
<b:section class='tabs' id='crosscol-overflow' showaddelement='yes'/>
</div>
</div>
<div class='tabs-cap-bottom cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>

<div class='main-outer'>
<div class='main-cap-top cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>

<div class='fauxborder-left main-fauxborder-left'>
<div class='fauxborder-right main-fauxborder-right'/>
<div class='region-inner main-inner'>

<div class='columns fauxcolumns'>

<div class='fauxcolumn-outer fauxcolumn-center-outer'>
<div class='cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
<div class='fauxborder-left'>
<div class='fauxborder-right'/>
<div class='fauxcolumn-inner'>
</div>
</div>
<div class='cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>

<div class='fauxcolumn-outer fauxcolumn-left-outer'>
<div class='cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
<div class='fauxborder-left'>
<div class='fauxborder-right'/>
<div class='fauxcolumn-inner'>
</div>
</div>
<div class='cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>

<div class='fauxcolumn-outer fauxcolumn-right-outer'>
<div class='cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
<div class='fauxborder-left'>
<div class='fauxborder-right'/>
<div class='fauxcolumn-inner'>
</div>
</div>
<div class='cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>

<!-- corrects IE6 width calculation -->
<div class='columns-inner'>

<div class='column-center-outer'>
<div class='column-center-inner'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='false' title='Blog Posts' type='Blog'/>
</b:section>
</div>
</div>

<div class='column-left-outer'>
<div class='column-left-inner'>
<aside>
<macro:include id='main-column-left-sections' name='sections'>
<macro:param default='0' name='num' value='1'/>
<macro:param default='sidebar-left' name='idPrefix'/>
<macro:param default='sidebar' name='class'/>
<macro:param default='true' name='includeBottom'/>
</macro:include>
</aside>
</div>
</div>

<div class='column-right-outer'>
<div class='column-right-inner'>
<aside>
<macro:include id='main-column-right-sections' name='sections'>
<macro:param default='2' name='num' value='0'/>
<macro:param default='sidebar-right' name='idPrefix'/>
<macro:param default='sidebar' name='class'/>
<macro:param default='true' name='includeBottom'/>
</macro:include>
</aside>
</div>
</div>

</div>

<div style='clear: both'/>
<!-- columns -->
</div>

<!-- main -->
</div>
</div>
<div class='main-cap-bottom cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>

<footer>
<div class='footer-outer'>
<div class='footer-cap-top cap-top'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
<div class='fauxborder-left footer-fauxborder-left'>
<div class='fauxborder-right footer-fauxborder-right'/>
<div class='region-inner footer-inner'>
<macro:include id='footer-sections' name='sections'>
<macro:param default='2' name='num' value='1'/>
<macro:param default='footer' name='idPrefix'/>
<macro:param default='foot' name='class'/>
<macro:param default='false' name='includeBottom'/>
</macro:include>
<!-- outside of the include in order to lock Attribution widget -->
<b:section class='foot' id='footer-3' showaddelement='no'/>
</div>
</div>
<div class='footer-cap-bottom cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>
</footer>

<!-- content -->
</div>
</div>
<div class='content-cap-bottom cap-bottom'>
<div class='cap-left'/>
<div class='cap-right'/>
</div>
</div>
</div>

<script type='text/javascript'>
window.setTimeout(function() {
document.body.className = document.body.className.replace('loading', '');
}, 10);
</script>
<a href='#' style='position: fixed; right: 5px; bottom: 5px;' title='Back to Top'><img height='48' src='http://i696.photobucket.com/albums/vv323/naz89_blog/1295538838_arrow-up.png' width='48'/></a>
</body>

<macro:includable id='sections' var='col'>
<macro:if cond='data:col.num == 0'>
<macro:else/>
<b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-1"' preferred='yes' showaddelement='yes'/>

<macro:if cond='data:col.num >= 2'>
<table border='0' cellpadding='0' cellspacing='0' mexpr:class='"section-columns columns-" + data:col.num'>
<tbody>
<tr>
<td class='first columns-cell'>
<b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-2-1"'/>
</td>

<td class='columns-cell'>
<b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-2-2"'/>
</td>

<macro:if cond='data:col.num >= 3'>
<td class='columns-cell'>
<b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-2-3"'/>
</td>
</macro:if>

<macro:if cond='data:col.num >= 4'>
<td class='columns-cell'>
<b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-2-4"'/>
</td>
</macro:if>
</tr>
</tbody>
</table>

<macro:if cond='data:col.includeBottom'>
<b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + "-3"' showaddelement='no'/>
</macro:if>
</macro:if>
</macro:if>
</macro:includable>

<b:section-contents id='sidebar-left-1'>
<b:widget id='Followers1' locked='false' title='Followers' type='Followers'/>
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
<b:widget id='BlogList1' locked='false' title='Koleksi Blog' type='BlogList'/>
</b:section-contents><b:section-contents id='footer-1'/></html>