template google plus fan dan template islami

Diposting oleh anyail
di bawah ini adalah kode template google plus fan:



<?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>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<data:blog.title/>
<b:else/>
<data:blog.pageName/> | <data:blog.title/>
</b:if>
</title>
    <b:skin><![CDATA[/*

Blogger Template Style
Base: Mأ­nima
Name: Google plus fan
Date: Agosto 2011
Adaptaciأ³n y Diseأ±o por: compartidأ­simo
URL:http://compartidisimo.blogspot.com

 */

/* Variable definitions
   ====================
 <Variable name="menuTextColor" description="Color Menu texto"
type="color" default="#ffffff" value="#f6f1ec">
<Variable name="menuTextFont" description=" Menu Tipo de fuente"
type="font"default="normal normal 77% Verdana, sans-serif" value="normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif">
<Variable name="descriptioncolor" description="Blog Description Color"
             type="color" default="#777" value="#3f3f3e">
   <Variable name="textcolor" description="Text Color"
             type="color" default="#333" value="#7f7e7d">
   <Variable name="linkcolor" description="Link Color"
             type="color" default="#58a" value="#0074de">
   <Variable name="titlecolor" description="Post Title Color"
             type="color" default="#999" value="#4a4949">
   <Variable name="pagetitlecolor" description="Blog Title Color"
             type="color" default="#ccc" value="#221e1d">
    <Variable name="sidebarcolor" description="Sidebar Title Color"
             type="color" default="#999" value="#cc0000">
   <Variable name="sidebartextcolor" description="Sidebar Text Color"
             type="color" default="#666" value="#7f7e7d">
   <Variable name="visitedlinkcolor" description="Visited Link Color"
             type="color" default="#999" value="#6fa9de">
   <Variable name="bodyfont" description="Text Font"
             type="font" default="normal normal 100% Georgia, Serif" value="normal normal 15px Arial, Tahoma, Helvetica, FreeSans, sans-serif">
   <Variable name="pagetitlefont" description="Blog Title Font"
             type="font"
             default="normal bold 200% 'Trebuchet MS',Trebuchet,Verdana,Sans-serif" value="normal bold 24px Cousine">
   <Variable name="descriptionfont" description="Blog Description Font"
             type="font"
             default="normal normal 78% 'Trebuchet MS', Trebuchet, Verdana, Sans-serif" value="normal normal 78% 'Trebuchet MS', Trebuchet, Verdana, Sans-serif">
   <Variable name="postfooterfont" description="Post Footer Font"
             type="font"
             default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif">
   <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">

*/
#navbar-iframe {
height: 0px;
visibility: hidden;
display: none;
}

* {
margin: 0;
padding: 0;
}

body {
margin:0;
padding: 0;
background: #ffffff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg16Dhq0Ftpf0ApkYzbdoXOwBiToVqhhmjVpkzrt6o23lpdU4UOF41mC0OpRINZMIuFqQo4ct7Qi0s4stVdQBKgClAdST5HfyhJ7eZbP4CqUqLHqk8l6oCwHY8Ik1Tz7vnyWg4IeyZId5DR/s0/grad-g.jpg) repeat-x top left;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: left;
  }
a:link {
color:$linkcolor;
text-decoration:none;
  }
a:visited {
color:$visitedlinkcolor;
text-decoration:none;
  }

a:hover {
  color:$hovercolor;
  text-decoration:none;
}

/* Headings */

h1, h2, h3, h4, h5, h6 {
margin: 0 0 4px 0;
text-transform: none;
color:$titlecolor;
font-weight: normal;
}
h1 {font-size: 24px;}
h2 {font-size: 22px;}
h3 {font-size: 20px;}
h4 {font-size: 18px;}
h5 {font-size: 16px;}
h6 {font-size: 14px;}

 
/* Header o cabecera */

#header-wrapper {
margin:0 auto;
padding:0;
width: 970px;
height:140px;
position:relative;
}

#header {
margin: 0;
float: left;
text-align:left;
color:$pagetitlecolor;
padding:0;
width: 440px;
height: 100px;
}
#header-2{
margin: 40px 30px 0 0;
float: right;
color:$pagetitlecolor;
padding:0;
width: 440px;
height: 100px;
}
#header h1 {
position: relative;
top: 40px;
left: 10px;
margin: 0;
padding: 0;
font: $pagetitlefont;
color:$pagetitlecolor;
text-transform: none;
display: block;
line-height:1.2em;
clear:both;
}

#header a {
color:$pagetitlecolor;
text-decoration:none;
  }

#header h1:hover {
color:$pagetitlecolor;
cursor: pointer;
  }

#header .description {
position: relative;
top: 37px;
left:0;
padding:0 0 15px 20px;
text-transform:none;
letter-spacing:.2em;
line-height: 14px;
font: $descriptionfont;
color: $descriptioncolor;
 }

#header img {
  margin-$startSide: auto;
  margin-$endSide: auto;
}

a img {
  border-width:0;
  }

/* Outer-Wrapper o envoltura*/

.clear {
clear: both;
}

#outer-wrapper {
position: relative;
width:980px;
margin:0 auto;
min-height: 100%;
padding: 0 0 50px;
text-align:left;
font: $bodyfont;
}

#content-wrapper {
margin:0 auto 0;
padding:0;
background:none;
width: 980px;
text-align: $startSide;
clear:both;
}
 
#main {
width: 550px;
margin: 0;
padding: 0;
float: left;
overflow: hidden;
display:inline;
}

#sidebar-wrapper {
margin: 0;
padding:0 5px 0 0;
width: 200px;
float: right;
line-height:1.2em;
overflow: hidden;
display:inline;
}

#sidebar-wrapper2 {
margin: 10px 0 0 0;
padding: 0;
width: 200px;
float: left;
overflow: hidden;
display: inline;
}

.comment-link {
margin-$startSide:.6em;
}

.top {
height: 4px;
width: 100%;
background-color: #efe709;
position: absolute;
top:0;
left:0;
border: none;
}
span.rojo, span.azul, span.verde, span.amarillo, span.rojo2, span.azul2, span.verde2, span.amarillo2 {
padding: 0;
margin: 0;
height: 4px;
float: left;
display: block;
overflow: hidden;/*importante en IE6*/
}

span.rojo {
width: 15%;
background-color: #c11b0f;
}
span.azul {
width: 10%;
background-color: #3967e4;
}
span.verde {
width: 15%;
background-color: #72b446;
}
span.amarillo {
width: 10%;
background-color: #efe709;
}
span.rojo2 {
width: 15%;
background-color: #c11b0f;
}
span.azul2 {
width: 10%;
background-color: #3967e4;
}
span.verde2 {
width: 15%;
background-color: #72b446;
}

/* Menu top */

#crosscol-wrapper {
margin:0 auto;
padding:0;
width: 980px;
clear: both;
height: 50px;
position: relative;
}
#PageList1 h2{
display:none;
}

.menu-top{
width:700px;
padding: 0;
margin: 0;
float: left;
clear:both;
 }

.menu-top ul{
margin:0;
list-style:none;
padding:0px;
}

.menu-top li{
float:left;
margin:0;
padding:0;
}


.menu-top li a{
float:left;
display: inline-block;
text-align:center;
margin: 0;
padding:22px 6px 2px;
height: 39px;
text-decoration:none;
white-space: nowrap;
}

.menu-top a, .menu-top a:active, .menu-top a:visited {
font: $menuTextFont;
color: $menuTextColor;
}
.menu-top li a:hover {
color: #777777;
cursor: pointer;
}

.menu-top li.selected{
margin:0;
padding:0;
font-weight:bold;
color:#3b3939;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKYHLl_FKNytnHWrbOgS6OIN_5MLS4zIoIc6iezxWX20QNdQs8JZiYWbi-KSrvjGRStrZxtuVDtf8eV6kkKXq5jpuA_9rZQaVJWA-1D2MIgyEBZJpbA-yW_Y2H-_3Bcg8qYtobbZ95wlJ1/s0/ttrian.gif) no-repeat bottom center;
}

/* Contenedor Buscador */

#search-conte{
width: 250px;
height: 40px;
position: absolute;
top: 19px;
right: 5px;
left: auto;
margin: 0 auto;
padding: 0 10px 0;
}

.search-c h2 {
display: none;}

input.gsc-search-button {
font-size: 100%;
color:#120501;
margin: 0;
padding: 0 6px;
height: 25px;
}

input.gsc-search-button:hover{
cursor:pointer;
}

input.gsc-input {
width: 80%;
color: #09303b;
font-size: 100%;
background: #ffffff;
margin: 0;
padding: 0;
height: 21px;
line-height: 200%;
-webkit-border-radius:  10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

.gsc-branding-text, .gsc-branding-img-noclear {
display:none;
}


/* Posts o estilos de las entradas */
.post {
margin: 0;
padding: 7px 5px 4px 8px;
border-left: 1px dashed #e0e0de;
border-right: 1px dashed #e0e0de;
}
.post h3 {
margin:0 0 3px 0;
padding: 0 0 3px 0;
font-weight: normal;
line-height: 1.4em;
color:$titlecolor;
background:none;
}

.post h3 a, .post h3 a:visited, .post h3 strong {
text-decoration:none;
color:$titlecolor;
font-weight:normal;
}

.post h3 strong, .post h3 a:hover {
  color: #3967e4;
}

.post-body {
  margin:0 0 .75em;
  line-height:1.3em;
}

.post-body ul li {
list-style-type: circle;
list-style-position: inside;
}

.post-footer {
margin:10px 8px 4px 0px;
color:$sidebarcolor;
text-transform:none;
letter-spacing:.1em;
line-height: 19px;
font: $postfooterfont;
padding:10px 4px;
border-bottom : 1px dashed #e0e0de;
}

.post img, table.tr-caption-container {
border: 0;
}


.tr-caption-container img {
  border: none;
  padding: 0;
}
.post blockquote {
 margin: 1em 15px;
padding:8px 5px 8px 5px;
border:1px #cccccc solid;
overflow:auto;
}

.post blockquote p {
  margin: .75em 0;
}


/* Comments o comentarios */

#comments {
margin: 10px;
pading: 8px;
}

#comments h4 {
margin: 5px;
line-height:1.0em;
color:#09303b;
font-size:120%;
}
#comments-block {
margin:10px;
line-height:1.0em;
background:none;
color:#20150a;
padding: 5px;
}

#comments-block .comment-body {
margin:0;
background:none;
color:inherit;
padding:10px 8px 5px 8px;
line-height:1.1em;
font-size:13px;
}
.comment-author {
background: none;
border: none;
margin:5px 0 0 10px;
padding:2px 0 2px 3px;
font-weight:bold;
color:#180a01;
font-size:15px;
width:100%;
}
.comment-footer {
margin:0;
margin:0 0 10px 0;
font-size:10px;
}
#comments-block .comment-footer  a{
color:#231606;
line-height:1.1em;
}

#comments-block .comment-body p {
margin:0;
padding: 4px;
font-size:14px;
line-height:1.1em;
overflow: auto;
}
#comments-block a{
color:#2a0a0a;
text-decoration:none
}
#comments-block a:hover{
color:#ee9d3f;
}
#comments-block a:visited{
color:#2a0a0a;
}

.deleted-comment {
font-style:italic;
color:gray;
}
.avatar-image-container {
float: left;
margin:-3px 0 0 3px;
background: #ffffff;
padding:4px;
border: 1px solid #e9e8ee;
}
.avatar-image-container.avatar-stock {
background: none;}

#comment-editor{
margin:0;
padding: 0;
}

.comment-form{
padding:10px;
margin: 12px 0;
}

#blog-pager-newer-link {
float: right;
margin-right:70px;

}

#blog-pager-older-link {
float: left;
margin-left:70px;
 }

#blog-pager {
text-align: center;
margin: 10px;
padding: 0;
 }

.feed-links {
clear: both;
line-height: 2.5em;
}

.feed-links {
display:none;
}

/* Sidebar  */
.sidebar, .sidebar1 {
margin: -10px 0 0 0;
padding: 0;
line-height:1.2em;
color: $sidebartextcolor;
word-wrap: break-word;  
overflow: hidden;    

}

.sidebar ul, .sidebar1 ul {
margin:0;
padding:0;
}

.sidebar ul li, .sidebar1 ul li {
padding:3px 0 6px 4px;
line-height:100%;
}

.sidebar li, .sidebar1 li {
margin:0;
padding: 0 0 6px 0;
text-indent:0px;
 }

.sidebar .widget, .sidebar1 .widget {
margin:0 10px 3px 5px;
padding: 4px;
}

.sidebar h2, .sidebar1 h2 {
font-weight:normal;
color:$sidebarcolor;
letter-spacing: 0em;
padding:6px 4px 0 0;
font-size: 17px;
line-height: 16px;
}

.sidebar img {
background: #cccccc;
padding: 4px;
}
main .widget{
font-weight:bold;
}

/*ESTILOS DE LOS ENLACES DE LAS ETIQUETAS*/

#Label1 ul{
margin:0;
padding:0 0 10px 0;
}
#Label1 ul li{
margin: 0;
padding:2px 0 5px 0;
list-style-type: circle;
list-style-position: inside;
color: #c11b0f;
font-size: 18px;
line-height: 15px;
}
#Label1 li{
margin: 0;
padding: 0;
}
#Label1 li a{
padding:0;
margin:0;
text-decoration: none;
font-size: 14px;
}
#Label1 ul li:hover {
list-style-type: disc;
color: inhrit;
}
#Label1 li a:hover {
color:#cc0000;
font-weight: normal;
}

/* Profile o perfil */
.profile-img {
float: $startSide;
margin-top: 0;
margin-$endSide: 5px;
margin-bottom: 5px;
margin-$startSide: 0;
padding: 0px;
border: 4px solid $bordercolor;
}

.profile-data {
margin:0;
text-transform:none;
letter-spacing:.1em;
font: $postfooterfont;
color: $sidebarcolor;
font-weight: bold;
line-height: 1.6em;
}

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

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

.profile-link {
font: $postfooterfont;
text-transform: none;
letter-spacing: .1em;
}

.status-msg-wrap{
display:none;
}


/* Footer o pie */

#footer-wrapper{
position: relative;
width:100%;
margin:80px auto 0;
padding: 0;
}

#after-footer {
width: 980px;
margin: 0 auto;
padding:0;
}
#columnaf1, #columnaf2, #columnaf3{
background: none;
margin: 0;
padding: 0;
text-align: left;
font-size: 100%;
overflow: hidden;
border: none;
}
#columnaf1 .widget, #columnaf2 .widget, #columnaf3 .widget{
padding: 0 3px 0 0;
margin: 0;
}

.columna1 ul li, .columna2 ul li, .columna3 ul li{
background:none;
padding:0;
margin: 0;
list-style-type: circle;
text-align:left;
}

#columnaf1 {
margin:10px 0 0 0;
padding:0;
float:left;
padding:0;
width:220px;
}

#columnaf2 {
margin:10px 0 0 20px;
padding:0;
float:left;
padding:0;
width:220px
}

#columnaf3 {
margin:10px 0 0 30px;
padding:0;
float:left;
width:440px
}


#columnaf1, #columnaf2 {
border-right: 1px dashed #cccccc;
}

.columna1 h2, .columna2 h2, .columna3 h2 {
margin: 0 0 4px 0;
padding: 0;
font-size: 110%;
color:$sidebarcolor;
text-align: left;
font-weight: normal;
letter-spacing: 0.1em;
}


#end2 {
position: relative;
top: 0;
left: 0;
bottom: 0;
width:100%;
height:42px;
clear:both;
margin:0 auto;
background: #0c0c0c;
}

/*Sombras en el texto*/
#header h1, #header .description, input.gsc-search-button, .comment-author, a.readmore {
text-shadow: 1px 1px 0px #ffffff;
}

h2.date-header {
display: none;
}
/* Etiquetas post-footer */
.etiquetas {
padding:2px 3px;
margin: 6px 0;
background-color: #eeedfd;
border: 1px dashed #e8e7f8;
white-space: nowrap;
line-height: 28px;
}
.etiquetas:hover {
border: 1px solid #c8e2d5;
}

/*leer mas hover*/

a.readmore:hover {
color: #72b446;
}

/* Botones entradas */
ul#botones-entradas{
margin: 0;
padding: 4px 0;
width: 100%;
height: 25px;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
ul#botones-entradas li {
float: left;
padding: 0;
margin: 3px 3px 5px 0;
list-style: none;
}

]]></b:skin>

<!-- ESTILOS Y SCRIPT RESUMEN DE ENTRADAS -->
<style type='text/css'>
.contemini {
position:relative;
overflow:hidden;
width:200px;
height:120px;
margin:0 10px 0 0;
border: 1px solid #e0e0de;
clear: both;
float: left;
}
.miniaturas {
width:200px;
height:180px;
background: no-repeat scroll 10% 40% #ffffff;
}
</style>


<script type='text/javascript'>
//<![CDATA[

function createSummaryAndThumb(pID,enlacetitulo){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = sumario_noimg;

if(img.length>=1) {
imgtag = '<div class="contemini"><a href="' + enlacetitulo + '"><div class="miniaturas" style="background-image:url(' + img[0].src + ')"></a></div></div>';
summ = sumario_img;
}

var summary = removeHtmlTag(div.innerHTML,summ,imgtag,enlacetitulo);
div.innerHTML = summary;
}

function removeHtmlTag(strx,chop,imagen,enlace){
var original=strx;
if(strx.indexOf("<")!=-1) {
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
if(strx.length<=chop) {
return original;
}
else {
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
var devolver = imagen + '<div>' + strx + '... <a class="readmore" href="' + enlace+ '">Seguir leyendo آ»</a></div>';
return devolver;
}
}
sumario_noimg = 180;
sumario_img = 180;
//]]>
</script>

  </head>

  <body>
<div class='top'><span class='rojo'/><span class='azul'/><span class='verde'/><span class='amarillo'/><span class='rojo2'/><span class='azul2'/><span class='verde2'/></div><div id='crosscol-wrapper'><b:section class='menu-top' id='menu-top' showaddelement='no'>
<b:widget id='PageList1' locked='true' title='Pأ،ginas' type='PageList'>
<b:includable id='main'>
  <b:if cond='data:title'><h2><data:title/></h2></b:if>
  <div class='widget-content'>
    <b:if cond='data:mobile'>
      <select expr:id='data:widget.instanceId + &quot;_select&quot;'>
        <b:loop values='data:links' var='link'>
          <b:if cond='data:link.isCurrentPage'>
            <option expr:value='data:link.href' selected='selected'><data:link.title/></option>
          <b:else/>
            <option expr:value='data:link.href'><data:link.title/></option>
          </b:if>
        </b:loop>
      </select>
      <span class='pagelist-arrow'>&amp;#9660;</span>

    <b:else/>
      <ul>
        <b:loop values='data:links' var='link'>
          <b:if cond='data:link.isCurrentPage'>
            <li class='selected'><a expr:href='data:link.href'><data:link.title/></a></li>
          <b:else/>
            <li><a expr:href='data:link.href'><data:link.title/></a></li>
          </b:if>
        </b:loop>
      </ul>
    </b:if>
    <b:include name='quickedit'/>
  </div>
</b:includable>
</b:widget>
</b:section><div id='search-conte'><b:section class='search-c' id='search-c' showaddelement='no'>
<b:widget id='CustomSearch1' locked='true' title='Buscar' type='CustomSearch'>
<b:includable id='main'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != &quot;&quot;'>
      <h2 class='title'><data:title/></h2>
    </b:if>

    <div class='widget-content'>
      <div expr:id='data:widget.instanceId + &quot;_form&quot;'>
        <span class='cse-status'><data:loadingMsg/></span>
      </div>
    </div>

    <!-- override gsearch.css -->
    <style type='text/css'>
      #uds-searchControl .gs-result .gs-title,
      #uds-searchControl .gs-result .gs-title *,
      #uds-searchControl .gsc-results .gsc-trailing-more-results,
      #uds-searchControl .gsc-results .gsc-trailing-more-results * {
        color:<data:linkColor/>;
      }

      #uds-searchControl .gs-result .gs-title a:visited,
      #uds-searchControl .gs-result .gs-title a:visited * {
        color:<data:visitedLinkColor/>;
      }

      #uds-searchControl .gs-relativePublishedDate,
      #uds-searchControl .gs-publishedDate {
        color: <data:dateColor/>;
      }

      #uds-searchControl .gs-result a.gs-visibleUrl,
      #uds-searchControl .gs-result .gs-visibleUrl {
        color: <data:urlColor/>;
      }

      #uds-searchControl .gsc-results {
        border-color: <data:borderColor/>;
        background-color: <data:backgroundColor/>;
      }

      #uds-searchControl .gsc-tabhActive {
        border-color: <data:borderColor/>;
        border-top-color: <data:activeBorderColor/>;
        background-color: <data:backgroundColor/>;
        color: <data:textColor/>;
      }

      #uds-searchControl .gsc-tabhInactive {
        border-color: <data:borderColor/>;
        background-color: transparent;
        color: <data:linkColor/>;
      }

      #uds-searchClearResults {
        border-color: <data:borderColor/>;
      }

      #uds-searchClearResults:hover {
        border-color: <data:activeBorderColor/>;
      }

      #uds-searchControl .gsc-cursor-page {
        color: <data:linkColor/>;
      }

      #uds-searchControl .gsc-cursor-current-page {
        color: <data:textColor/>;
      }
    </style>

    <b:include name='quickedit'/>
  </b:includable>
</b:widget>
</b:section></div></div>
  <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='Google Plus fan (Header)' type='Header'>
<b:includable id='title'>
  <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <data:title/>
  <b:else/>
    <a expr:href='data:blog.homepageUrl'><data:title/></a>
  </b:if>
</b:includable>
<b:includable id='description'>
  <div class='descriptionwrapper'>
    <p class='description'><span><data:description/></span></p>
  </div>
</b:includable>
<b:includable id='main'>

  <b:if cond='data:useImage'>
    <b:if cond='data:imagePlacement == &quot;BEHIND&quot;'>
      <!--
      Show image as background to text. You can't really calculate the width
      reliably in JS because margins are not taken into account by any of
      clientWidth, offsetWidth or scrollWidth, so we don't force a minimum
      width if the user is using shrink to fit.
      This results in a margin-width's worth of pixels being cropped. If the
      user is not using shrink to fit then we expand the header.
      -->
      <div expr:style='&quot;background-image: url(\&quot;&quot; + data:sourceUrl + &quot;\&quot;); &quot;                      + &quot;background-position: &quot;                      + data:backgroundPositionStyleStr + &quot;; &quot;                      + data:widthStyleStr                      + &quot;min-height: &quot; + data:height + &quot;px;&quot;                      + &quot;_height: &quot; + data:height + &quot;px;&quot;                      + &quot;background-repeat: no-repeat; &quot;' id='header-inner'>
        <div class='titlewrapper' style='background: transparent'>
          <h1 class='title' style='background: transparent; border-width: 0px'>
            <b:include name='title'/>
          </h1>
        </div>
        <b:include name='description'/>
      </div>
    <b:else/>
      <!--Show the image only-->
      <div id='header-inner'>
        <a expr:href='data:blog.homepageUrl' style='display: block'>
          <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
        </a>
        <!--Show the description-->
        <b:if cond='data:imagePlacement == &quot;BEFORE_DESCRIPTION&quot;'>
          <b:include name='description'/>
        </b:if>
      </div>
    </b:if>
  <b:else/>
    <!--No header image -->
    <div id='header-inner'>
      <div class='titlewrapper'>
        <h1 class='title'>
          <b:include name='title'/>
        </h1>
      </div>
      <b:include name='description'/>
    </div>
  </b:if>
</b:includable>
</b:widget>
</b:section>
<b:section class='header-2' id='header-2' maxwidgets='1' showaddelement='yes'/>

</div>

</div>
 <div id='content-wrapper'>
<div id='main-wrapper'>
<div id='sidebar-wrapper2'>
<b:section class='sidebar' id='sidebar1' showaddelement='yes'>
<b:widget id='HTML4' locked='false' title='Blogger templates' type='HTML'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
</b:widget>
<b:widget id='Label1' locked='false' title='Tags' type='Label'>
<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
    <b:if cond='data:display == &quot;list&quot;'>
      <ul>
      <b:loop values='data:labels' var='label'>
        <li>
          <b:if cond='data:blog.url == data:label.url'>
            <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
          <b:else/>
            <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
          </b:if>
          <b:if cond='data:showFreqNumbers'>
            <span dir='ltr'>(<data:label.count/>)</span>
          </b:if>
        </li>
      </b:loop>
      </ul>
    <b:else/>
      <b:loop values='data:labels' var='label'>
        <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
          <b:if cond='data:blog.url == data:label.url'>
            <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
          <b:else/>
            <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
          </b:if>
          <b:if cond='data:showFreqNumbers'>
            <span class='label-count' dir='ltr'>(<data:label.count/>)</span>
          </b:if>
        </span>
      </b:loop>
    </b:if>
    <b:include name='quickedit'/>
  </div>
</b:includable>
</b:widget>
</b:section>
</div>

        <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>
<b:includable id='nextprev'>
  <div class='blog-pager' id='blog-pager'>
    <b:if cond='data:newerPageUrl'>
      <span id='blog-pager-newer-link'>
      <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
      </span>
    </b:if>

    <b:if cond='data:olderPageUrl'>
      <span id='blog-pager-older-link'>
      <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
      </span>
    </b:if>

    <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>

  </div>
  <div class='clear'/>
</b:includable>
<b:includable id='shareButtons' var='post'>
  <a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + &quot;&amp;target=email&quot;' expr:title='data:top.emailThisMsg' target='_blank'>
    <span class='share-button-link-text'><data:top.emailThisMsg/></span></a>
  <a class='goog-inline-block share-button sb-blog' expr:href='data:post.sharePostUrl + &quot;&amp;target=blog&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=270,width=475\&quot;); return false;&quot;' expr:title='data:top.blogThisMsg' target='_blank'>
    <span class='share-button-link-text'><data:top.blogThisMsg/></span></a>
  <a class='goog-inline-block share-button sb-twitter' expr:href='data:post.sharePostUrl + &quot;&amp;target=twitter&quot;' expr:title='data:top.shareToTwitterMsg' target='_blank'>
    <span class='share-button-link-text'><data:top.shareToTwitterMsg/></span></a>
  <a class='goog-inline-block share-button sb-facebook' expr:href='data:post.sharePostUrl + &quot;&amp;target=facebook&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' expr:title='data:top.shareToFacebookMsg' target='_blank'>
    <span class='share-button-link-text'><data:top.shareToFacebookMsg/></span></a>
  <a class='goog-inline-block share-button sb-buzz' expr:href='data:post.sharePostUrl + &quot;&amp;target=buzz&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=415,width=690\&quot;); return false;&quot;' expr:title='data:top.shareToBuzzMsg' target='_blank'>
    <span class='share-button-link-text'><data:top.shareToBuzzMsg/></span></a>
  <b:if cond='data:top.showDummy'>
    <div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
  </b:if>
</b:includable>
<b:includable id='threaded_comment_js' var='post'>
  <script defer='defer' expr:src='data:post.commentSrc' type='text/javascript'/>

  <script type='text/javascript'>
    (function() {
      var items = <data:post.commentJso/>;
      var msgs = <data:post.commentMsgs/>;
      var postId = &#39;<data:post.id/>&#39;;
      var feed = &#39;<data:post.commentFeed/>&#39;;
      var authorName = &#39;<data:post.author/>&#39;;
      var authorUrl = &#39;<data:post.authorUrl/>&#39;;
      var blogId = &#39;<data:top.id/>&#39;;
      var baseUri = &#39;<data:post.commentBase/>&#39;;

// <![CDATA[
      feed += '?alt=json&v=2&orderby=published&reverse=false&max-results=50';
      var cursor = null;
      if (items && items.length > 0) {
        cursor = parseInt(items[items.length - 1].timestamp) + 1;
      }

      var bodyFromEntry = function(entry) {
        if (entry.gd$extendedProperty) {
          for (var k in entry.gd$extendedProperty) {
            if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
              return '<span class="deleted-comment">' + entry.content.$t + '</span>';
            }
          }
        }
        return entry.content.$t;
      }

      var parse = function(data) {
        cursor = null;
        var comments = [];
        if (data && data.feed && data.feed.entry) {
          for (var i = 0, entry; entry = data.feed.entry[i]; i++) {
            var comment = {};
            // comment ID, parsed out of the original id format
            var id = /blog-(\d+).post-(\d+)/.exec(entry.id.$t);
            comment.id = id ? id[2] : null;
            comment.body = bodyFromEntry(entry);
            comment.timestamp = Date.parse(entry.published.$t) + '';
            if (entry.author && entry.author.constructor === Array) {
              var auth = entry.author[0];
              if (auth) {
                comment.author = {
                  name: (auth.name ? auth.name.$t : undefined),
                  profileUrl: (auth.uri ? auth.uri.$t : undefined),
                  avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined)
                };
              }
            }
            if (entry.link) {
              if (entry.link[2]) {
                comment.link = comment.permalink = entry.link[2].href;
              }
              if (entry.link[3]) {
                var pid = /.*comments\/default\/(\d+)\?.*/.exec(entry.link[3].href);
                if (pid && pid[1]) {
                  comment.parentId = pid[1];
                }
              }
            }
            comment.deleteclass = 'item-control blog-admin';
            if (entry.gd$extendedProperty) {
              for (var k in entry.gd$extendedProperty) {
                console.log(entry.gd$extendedProperty[k].name + ' - ' + entry.gd$extendedProperty[k].value);
                if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') {
                  comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value;
                }
              }
            }
            comments.push(comment);
          }
        }
        return comments;
      };

      var paginator = function(callback) {
        if (hasMore()) {
          var url = feed;
          if (cursor) {
            url += '&published-min=' + new Date(cursor).toISOString();
          }
          window.bloggercomments = function(data) {
            var parsed = parse(data);
            cursor = parsed.length < 50 ? null
                : parseInt(parsed[parsed.length - 1].timestamp) + 1
            callback(parsed);
            window.bloggercomments = null;
          }
          url += '&callback=bloggercomments';
          var script = document.createElement('script');
          script.type = 'text/javascript';
          script.src = url;
          document.getElementsByTagName('head')[0].appendChild(script);
        }
      };
      var hasMore = function() {
        return !!cursor;
      };
      var getMeta = function(key, comment) {
        if ('iswriter' == key) {
          var matches = !!comment.author
              && comment.author.name == authorName
              && comment.author.profileUrl == authorUrl;
          return matches ? 'true' : '';
        } else if ('deletelink' == key) {
          return baseUri + '/delete-comment.g?blogID=' + blogId + '&postID=' + comment.id;
        } else if ('deleteclass' == key) {
          return comment.deleteclass;
        }
        return '';
      };

      var replybox = null;
      var replyUrlParts = null;
      var replyParent = undefined;

      var onReply = function(commentId, domId) {
        if (replybox == null) {
          // lazily cache replybox, and adjust to suit this style:
          replybox = document.getElementById('comment-editor');
          if (replybox != null) {
            replybox.height = '250px';
            replybox.style.display = 'block';
            replyUrlParts = replybox.src.split('#');
          }
        }
        if (replybox && (commentId !== replyParent)) {
          document.getElementById(domId).insertBefore(replybox, null);
          replybox.src = replyUrlParts[0]
              + (commentId ? '&parentID=' + commentId : '')
              + '#' + replyUrlParts[1];
          replyParent = commentId;
        }
      };

      var tok = 'comment-form_';
      var hash = window.location.hash || '';
      var startThread = hash.indexOf(tok) == 1 ? hash.substring(tok.length + 1) : undefined;

      // Configure commenting API:
      var configJso = {
        'maxDepth': 2
      };
      var provider = {
        'id': postId,
        'data': items,
        'loadNext': paginator,
        'hasMore': hasMore,
        'getMeta': getMeta,
        'onReply': onReply,
        'rendered': true,
        'initReplyThread': startThread,
        'config': configJso,
        'messages': msgs
      };

      var render = function() {
        if (window.goog && window.goog.comments) {
          var holder = document.getElementById('comment-holder');
          window.goog.comments.render(holder, provider);
        }
      };

      // render now, or queue to render when library loads:
      if (window.goog && window.goog.comments) {
        render();
      } else {
        window.goog = window.goog || {};
        window.goog.comments = window.goog.comments || {};
        window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
        window.goog.comments.loadQueue.push(render);
      }
    })();
// ]]>
  </script>
</b:includable>
<b:includable id='backlinks' var='post'>
  <a name='links'/><h4><data:post.backlinksLabel/></h4>
  <b:if cond='data:post.numBacklinks != 0'>
    <dl class='comments-block' id='comments-block'>
      <b:loop values='data:post.backlinks' var='backlink'>
        <div class='collapsed-backlink backlink-control'>
          <dt class='comment-title'>
            <span class='backlink-toggle-zippy'>&#160;</span>
            <a expr:href='data:backlink.url' rel='nofollow'><data:backlink.title/></a>
            <b:include data='backlink' name='backlinkDeleteIcon'/>
          </dt>
          <dd class='comment-body collapseable'>
            <data:backlink.snippet/>
          </dd>
          <dd class='comment-footer collapseable'>
            <span class='comment-author'><data:post.authorLabel/> <data:backlink.author/></span>
            <span class='comment-timestamp'><data:post.timestampLabel/> <data:backlink.timestamp/></span>
          </dd>
        </div>
      </b:loop>
    </dl>
  </b:if>
  <p class='comment-footer'>
    <a class='comment-link' expr:href='data:post.createLinkUrl' expr:id='data:widget.instanceId + &quot;_backlinks-create-link&quot;' target='_blank'><data:post.createLinkLabel/></a>
  </p>
</b:includable>
<b:includable id='mobile-main' var='top'>
    <!-- posts -->
    <div class='blog-posts hfeed'>

      <b:include data='top' name='status-message'/>

      <b:if cond='data:blog.pageType == &quot;index&quot;'>
        <b:loop values='data:posts' var='post'>
          <b:include data='post' name='mobile-index-post'/>
        </b:loop>
      <b:else/>
        <b:loop values='data:posts' var='post'>
          <b:include data='post' name='mobile-post'/>
        </b:loop>
      </b:if>
    </div>

   <b:include name='mobile-nextprev'/>
</b:includable>
<b:includable id='post' var='post'>
  <div class='post hentry uncustomized-post-template'>
    <a expr:name='data:post.id'/>
    <b:if cond='data:post.title'>
        <h3 class='post-title entry-title'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h3>
    </b:if>

    <div class='post-header'>
    <div class='post-header-line-1'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<ul id='botones-entradas'>
<li><a class='twitter-share-button' data-count='horizontal' data-lang='es' href='http://twitter.com/YOUR_USERNAME'>Tweetear</a></li>
<li><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?locale=es_ES&amp;href=&quot; + data:post.url+ &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp;height=21&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:100px; height:21px'/></li>
<li><g:plusone size='medium'/></li>
 </ul>
  </b:if>
</div>
</div>

<div class='post-body entry-content'><b:if cond='data:blog.pageType == &quot;item&quot;'>
<p><data:post.body/></p>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<p><data:post.body/></p>
<b:else/>
<div expr:id='&quot;summary-&quot; + data:post.id'><p><data:post.body/></p></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary-<data:post.id/>&quot;,&quot;<data:post.url/>&quot;);</script>
</b:if>
</b:if>

      <div style='clear: both;'/> <!-- clear for photos floats -->
    </div>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='autor'><span class='post-author vcard' style=''>
        <b:if cond='data:top.showAuthor'>
          <data:top.authorLabel/>
          <span class='fn'><data:post.author/></span>
        </b:if>
      </span>
 <span class='post-timestamp' style=''>
        <b:if cond='data:top.showTimestamp'>
          <data:top.timestampLabel/>
        <b:if cond='data:post.url'>
          <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
        </b:if>
        </b:if>
      </span>
</div>

<b:if cond='data:blog.pageType == &quot;item&quot;'><div class='autor-line-1'>
<span class='post-labels'>
        <b:if cond='data:post.labels'>
          <data:postLabelsLabel/>
          <b:loop values='data:post.labels' var='label'>
            <a expr:href='data:label.url' rel='tag'><span class='etiquetas'><data:label.name/></span></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
          </b:loop>
        </b:if>
      </span>
   </div>
</b:if>
         

  </b:if>

   <div class='post-footer'>
    <div class='post-footer-line post-footer-line-1'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<span class='post-timestamp' style=''>
        <b:if cond='data:top.showTimestamp'>        
        <b:if cond='data:post.url'>
          <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
        </b:if>
        </b:if>
      </span>
</b:if>
        <span class='post-comment-link'>
        <b:if cond='data:blog.pageType != &quot;item&quot;'>
          <b:if cond='data:post.allowComments'>
            <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
          </b:if>
        </b:if>
      </span>
   
      <span class='reaction-buttons'>
        <b:if cond='data:top.showReactions'>
          <table border='0' cellpadding='0' cellspacing='0' width='100%'><tr>
            <td class='reactions-label-cell' nowrap='nowrap' valign='top' width='1%'>
              <span class='reactions-label'>
              <data:top.reactionsLabel/></span>&#160;</td>
            <td><iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/></td>
           </tr></table>
        </b:if>
      </span>

      <span class='star-ratings'>
        <b:if cond='data:top.showStars'>
           <div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:height='42' g:type='RatingPanel' g:width='280'/>
        </b:if>
      </span>
     
      <!-- backlinks -->
       <span class='post-backlinks post-comment-link'>
         <b:if cond='data:blog.pageType != &quot;item&quot;'>
           <b:if cond='data:post.showBacklinks'>
             <a class='comment-link' expr:href='data:post.url + &quot;#links&quot;'><data:top.backlinkLabel/></a>
           </b:if>
         </b:if>
       </span>
     <span class='post-icons'>
        <!-- email post links -->
        <b:if cond='data:post.emailPostUrl'>
          <span class='item-action'>
          <a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
              <img alt='' class='icon-action' height='13' src='http://www.blogger.com/img/icon18_email.gif' width='18'/>
          </a>
          </span>
        </b:if>
        <!-- quickedit pencil -->
        <b:include data='post' name='postQuickEdit'/>
      </span>
      </div>
      <div class='post-footer-line post-footer-line-2'>

          </div>
      <div class='post-footer-line post-footer-line-3'>
      <span class='post-location'>
        <b:if cond='data:top.showLocation'>
          <b:if cond='data:post.location'>
            <data:postLocationLabel/>
            <a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
          </b:if>
        </b:if>
      </span>
      </div>
    </div>
  </div>
</b:includable>
<b:includable id='status-message'>
  <b:if cond='data:navMessage'>
  <div class='status-msg-wrap'>
    <div class='status-msg-body'>
      <data:navMessage/>
    </div>
    <div class='status-msg-border'>
      <div class='status-msg-bg'>
        <div class='status-msg-hidden'><data:navMessage/></div>
      </div>
    </div>
  </div>
  <div style='clear: both;'/>
  </b:if>
</b:includable>
<b:includable id='comment-form' var='post'>
  <div class='comment-form'>
    <a name='comment-form'/>
    <h4 id='comment-post-message'>&#191;Te animas a decir algo?</h4>
    <p><data:blogCommentMessage/></p>
    <data:blogTeamBlogMessage/>
    <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
    <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='300' id='comment-editor' name='comment-editor' width='120%'/>
    <data:post.friendConnectJs/>
    <data:post.cmtfpIframe/>
    <script type='text/javascript'>
      BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
    </script>
  </div>
<div style='clear:both'/>
</b:includable>
<b:includable id='threaded_comments' var='post'>
  <b:include name='threaded_comment_css'/>

  <div class='comments' id='comments'>
    <a name='comments'/>
    <h4>
      <b:if cond='data:post.numComments == 1'>
        1 <data:commentLabel/>:
      <b:else/>
        <data:post.numComments/> <data:commentLabelPlural/>:
      </b:if>
    </h4>

    <div class='comments-content'>
      <b:if cond='data:post.embedCommentForm'>
        <b:include data='post' name='threaded_comment_js'/>
      </b:if>
      <div id='comment-holder'>
         <data:post.commentHtml/>
      </div>
    </div>

    <p class='comment-footer'>
      <b:if cond='data:post.allowNewComments'>
        <b:include data='post' name='threaded-comment-form'/>
      <b:else/>
        <data:post.noNewCommentsText/>
      </b:if>
    </p>

    <b:if cond='data:showCmtPopup'>
      <div id='comment-popup'>
        <iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
        </iframe>
      </div>
    </b:if>

    <div id='backlinks-container'>
    <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
       <b:if cond='data:post.showBacklinks'>
         <b:include data='post' name='backlinks'/>
       </b:if>
    </div>
    </div>
  </div>
</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'>
  <span expr:class='&quot;item-control &quot; + data:backlink.adminClass'>
    <a expr:href='data:backlink.deleteUrl' expr:title='data:top.deleteBacklinkMsg'>
      <img src='//www.blogger.com/img/icon_delete13.gif'/>
    </a>
  </span>
</b:includable>
<b:includable id='mobile-nextprev'>
  <div class='blog-pager' id='blog-pager'>
    <b:if cond='data:newerPageUrl'>
      <div class='mobile-link-button' id='blog-pager-newer-link'>
      <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
      </div>
    </b:if>

    <b:if cond='data:olderPageUrl'>
      <div class='mobile-link-button' id='blog-pager-older-link'>
      <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
      </div>
    </b:if>

    <div class='mobile-link-button' id='blog-pager-home-link'>
    <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
    </div>

    <div class='mobile-desktop-link'>
      <a class='home-link' expr:href='data:desktopLinkUrl'><data:desktopLinkMsg/></a>
    </div>

  </div>
  <div class='clear'/>
</b:includable>
<b:includable id='mobile-post' var='post'>
  <div class='date-outer'>
    <b:if cond='data:post.dateHeader'>
      <h2 class='date-header'><span><data:post.dateHeader/></span></h2>
    </b:if>
    <div class='date-posts'>
      <div class='post-outer'>

        <div class='post hentry uncustomized-post-template'>
          <a expr:name='data:post.id'/>
          <b:if cond='data:post.title'>
            <h3 class='post-title entry-title'>
              <b:if cond='data:post.link'>
                <a expr:href='data:post.link'><data:post.title/></a>
              <b:else/>
                <b:if cond='data:post.url'>
                  <b:if cond='data:blog.url != data:post.url'>
                    <a expr:href='data:post.url'><data:post.title/></a>
                  <b:else/>
                    <data:post.title/>
                  </b:if>
                <b:else/>
                  <data:post.title/>
                </b:if>
              </b:if>
            </h3>
          </b:if>

          <div class='post-header'>
            <div class='post-header-line-1'/>
          </div>

          <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id'>
            <data:post.body/>
            <div style='clear: both;'/> <!-- clear for photos floats -->
          </div>

          <div class='post-footer'>
            <div class='post-footer-line post-footer-line-1'>
              <span class='post-author vcard'>
                <b:if cond='data:top.showAuthor'>
                  <data:top.authorLabel/>
                  <span class='fn'><data:post.author/></span>
                </b:if>
              </span>

              <span class='post-timestamp'>
                <b:if cond='data:top.showTimestamp'>
                  <data:top.timestampLabel/>
                  <b:if cond='data:post.url'>
                    <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
                  </b:if>
                </b:if>
              </span>

              <span class='post-comment-link'>
                <b:if cond='data:blog.pageType != &quot;item&quot;'>
                  <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
                    <b:if cond='data:post.allowComments'>
                      <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
                    </b:if>
                  </b:if>
                </b:if>
              </span>
           

<!-- Feature added by BTemplates.com -->
<b:if cond='data:post.sharePostUrl'>
<div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div>
</b:if>

</div>

            <div class='post-footer-line post-footer-line-2'>
              <b:if cond='data:top.showMobileShare'>
                <div class='mobile-link-button goog-inline-block' id='mobile-share-button'>
                  <a href='javascript:void();'><data:shareMsg/></a>
                </div>
              </b:if>
              <b:if cond='data:top.showDummy'>
                <div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
              </b:if>
            </div>

          </div>
        </div>

        <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
          <b:include data='post' name='comments'/>
        </b:if>
        <b:if cond='data:blog.pageType == &quot;item&quot;'>
          <b:include data='post' name='comments'/>
        </b:if>
      </div>
    </div>
  </div>
</b:includable>
<b:includable id='postQuickEdit' var='post'>
  <b:if cond='data:post.editUrl'>
    <span expr:class='&quot;item-control &quot; + data:post.adminClass'>
      <a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
        <img alt='' class='icon-action' height='18' src='//www.blogger.com/img/icon18_edit_allbkg.gif' width='18'/>
      </a>
    </span>
  </b:if>
</b:includable>
<b:includable id='main' var='top'>
  <!-- posts -->
  <div class='blog-posts hfeed'>
    <b:include data='top' name='status-message'/>
    <data:defaultAdStart/>
    <b:loop values='data:posts' var='post'>
     <b:if cond='data:post.isDateStart'>
          <b:if cond='data:post.isFirstPost == &quot;false&quot;'>
            &lt;/div&gt;&lt;/div&gt;
          </b:if>
        </b:if>
        <b:if cond='data:post.isDateStart'>
          &lt;div class=&quot;date-outer&quot;&gt;
        </b:if>
        <b:if cond='data:post.dateHeader'>
      <h2 class='date-header'><data:post.dateHeader/></h2>
      </b:if>
      <b:if cond='data:post.isDateStart'>
        &lt;div class=&quot;date-posts&quot;&gt;
      </b:if>
      <div class='post-outer'>
      <b:include data='post' name='post'/>
      <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
        <b:include data='post' name='comments'/>
      </b:if>
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
        <b:include data='post' name='comments'/>
      </b:if>
      </div>
      <b:if cond='data:post.includeAd'>
        <b:if cond='data:post.isFirstPost'>
          <data:defaultAdEnd/>
        <b:else/>
          <data:adEnd/>
        </b:if>
        <div class='inline-ad'>
          <data:adCode/>
        </div>
        <data:adStart/>
      </b:if>
      <b:if cond='data:post.trackLatency'>
        <data:post.latencyJs/>
      </b:if>
    </b:loop>
    <b:if cond='data:numPosts != 0'>
      &lt;/div&gt;&lt;/div&gt;
    </b:if>
    <data:adEnd/>
  </div>

  <!-- navigation -->
  <b:include name='nextprev'/>

  <!-- feed links -->
  <b:include name='feedLinks'/>

  <b:if cond='data:top.showStars'>
    <script src='//www.google.com/jsapi' type='text/javascript'/>
    <script type='text/javascript'>
      google.load(&quot;annotations&quot;, &quot;1&quot;, {&quot;locale&quot;: &quot;<data:top.languageCode/>&quot;});
      function initialize() {
        google.annotations.setApplicationId(<data:top.blogspotReviews/>);
        google.annotations.createAll();
        google.annotations.fetch();
      }
      google.setOnLoadCallback(initialize);
    </script>
  </b:if>
</b:includable>
<b:includable id='commentDeleteIcon' var='comment'>
  <span expr:class='&quot;item-control &quot; + data:comment.adminClass'>
    <b:if cond='data:showCmtPopup'>
      <div class='goog-toggle-button'>
        <div class='goog-inline-block comment-action-icon'/>
      </div>
    <b:else/>
      <a class='comment-delete' expr:href='data:comment.deleteUrl' expr:title='data:top.deleteCommentMsg'>
        <img src='//www.blogger.com/img/icon_delete13.gif'/>
      </a>
    </b:if>
  </span>
</b:includable>
<b:includable id='feedLinks'>
  <b:if cond='data:blog.pageType != &quot;item&quot;'> <!-- Blog feed links -->
    <b:if cond='data:feedLinks'>
      <div class='blog-feeds'>
        <b:include data='feedLinks' name='feedLinksBody'/>
      </div>
    </b:if>

    <b:else/> <!--Post feed links -->
    <div class='post-feeds'>
      <b:loop values='data:posts' var='post'>
        <b:if cond='data:post.allowComments'>
          <b:if cond='data:post.feedLinks'>
            <b:include data='post.feedLinks' name='feedLinksBody'/>
          </b:if>
        </b:if>
      </b:loop>
    </div>
  </b:if>
</b:includable>
<b:includable id='threaded-comment-form' var='post'>
  <div class='comment-form'>
    <a name='comment-form'/>
    <b:if cond='data:mobile'>
      <p><data:blogCommentMessage/></p>
      <data:blogTeamBlogMessage/>
      <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
      <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
    <b:else/>
      <p><data:blogCommentMessage/></p>
      <data:blogTeamBlogMessage/>
      <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
      <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
    </b:if>
    <data:post.friendConnectJs/>
    <data:post.cmtfpIframe/>
    <script type='text/javascript'>
      BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
    </script>
  </div>
</b:includable>
<b:includable id='threaded_comment_css'>
  <style>
.comments {
  clear: both;
  margin-top: 10px;
  margin-bottom: 0px;
  line-height: 1em;
}
.comments .comments-content {
  font-size: 13px;
  margin-bottom: 16px;
}
.comments .comment .comment-actions a {
  padding-top: 5px;
  padding-right: 5px;
}
.comments .comment .comment-actions a:hover {
  text-decoration: underline;
}
.comments .comments-content .comment-thread ol {
  list-style-type: none;
  padding: 0;
  text-align: left;
}
.comments .comments-content .inline-thread {
  padding: 0.5em 1em;
}
.comments .comments-content .comment-thread {
  margin: 8px 0px;
}
.comments .comments-content .comment-thread:empty {
  display: none;
}
.comments .comments-content .comment-replies {
  margin-top: 1em;
  margin-left: 36px;
}
.comments .comments-content .comment {
  margin-bottom:16px;
  padding-bottom:8px;
}
.comments .comments-content .comment:first-child {
  padding-top:16px;
}
.comments .comments-content .comment:last-child {
  border-bottom:0;
  padding-bottom:0;
}
.comments .comments-content .comment-body {
  position:relative;
}
.comments .comments-content .user {
  font-style:normal;
  font-weight:bold;
}
.comments .comments-content .icon.blog-author {
  width: 18px;
  height: 18px;
  display: inline-block;
  margin: 0 0 -4px 6px;
}
.comments .comments-content .datetime {
  margin-left:6px;
}
.comments .comments-content .comment-header,
.comments .comments-content .comment-content {
  margin:0 0 8px;
}
.comments .comments-content .comment-content {
  text-align:justify;
}
.comments .comments-content .owner-actions {
  position:absolute;
  right:0;
  top:0;
}
.comments .comments-replybox {
  border: none;
  height: 250px;
  width: 100%;
}
.comments .comment-replybox-single {
  margin-top: 5px;
  margin-left: 48px;
}
.comments .comment-replybox-thread {
  margin-top: 5px;
}
.comments .comments-content .loadmore a {
  display: block;
  padding: 10px 16px;
  text-align: center;
}
.comments .thread-toggle {
  cursor: pointer;
  display: inline-block;
}
.comments .continue {
  cursor: pointer;
}
.comments .continue a {
  display: block;
  padding: 0.5em;
  font-weight: bold;
}
.comments .comments-content .loadmore {
  cursor: pointer;
  max-height: 3em;
  margin-top: 3em;
}
.comments .comments-content .loadmore.loaded {
  max-height: 0px;
  opacity: 0;
  overflow: hidden;
}
.comments .thread-chrome.thread-collapsed {
  display: none;
}
.comments .thread-toggle {
  display: inline-block;
}
.comments .thread-toggle .thread-arrow {
  display: inline-block;
  height: 6px;
  width: 7px;
  overflow: visible;
  margin: 0.3em;
  padding-right: 4px;
}
.comments .thread-expanded .thread-arrow {
  background: url(&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC&quot;) no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow {
  background: url(&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAABJRU5ErkJggg==&quot;) no-repeat scroll 0 0 transparent;
}
.comments .avatar-image-container {
  float: left;
  width: 36px;
  max-height: 36px;
  overflow: hidden;
}
.comments .avatar-image-container img {
  width: 36px;
}
.comments .comment-block {
  margin-left: 48px;
  position: relative;
}

/* Responsive styles. */
@media screen and (max-device-width: 480px) {
  .comments .comments-content .comment-replies {
    margin-left: 0;
  }
}
  </style>
</b:includable>
<b:includable id='mobile-index-post' var='post'>
  <div class='mobile-date-outer date-outer'>
    <b:if cond='data:post.dateHeader'>
      <div class='date-header'>
        <span><data:post.dateHeader/></span>
      </div>
    </b:if>
    <div class='mobile-post-outer'>
      <a expr:href='data:post.url'>
        <h3 class='mobile-index-title entry-title'>
          <data:post.title/>
        </h3>
        <div class='mobile-index-arrow'>&amp;rsaquo;</div>
        <div class='mobile-index-contents'>
          <b:if cond='data:post.thumbnailUrl'>
            <div class='mobile-index-thumbnail'>
              <div class='Image'>
                <img expr:src='data:post.thumbnailUrl'/>
              </div>
            </div>
          </b:if>
          <div class='post-body'>
            <b:if cond='data:post.snippet'><data:post.snippet/></b:if>
          </div>
        </div>
        <div style='clear: both;'/>
      </a>
      <div class='mobile-index-comment'>
        <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
          <b:if cond='data:post.allowComments'>
            <b:if cond='data:post.numComments != 0'>
              <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
            </b:if>
          </b:if>
        </b:if>
      </div>
    </div>
    <b:if cond='data:post.trackLatency'>
      <data:post.latencyJs/>
    </b:if>
  </div>
</b:includable>
<b:includable id='feedLinksBody' var='links'>
  <div class='feed-links'>
  <data:feedLinksMsg/>
  <b:loop values='data:links' var='f'>
     <a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
  </b:loop>
  </div>
</b:includable>
<b:includable id='comments' var='post'>
  <div class='comments' id='comments'>
    <a name='comments'/>
    <b:if cond='data:post.allowComments'>
      <h4>
        <b:if cond='data:post.numComments == 1'>
          1 <data:commentLabel/>:
        <b:else/>
          <data:post.numComments/> <data:commentLabelPlural/>:
        </b:if>
      </h4>
      <b:if cond='data:post.commentPagingRequired'>
        <span class='paging-control-container'>
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'><data:post.oldestLinkText/></a>
          &#160;
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'><data:post.olderLinkText/></a>
          &#160;
          <data:post.commentRangeText/>
          &#160;
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'><data:post.newerLinkText/></a>
          &#160;
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'><data:post.newestLinkText/></a>
        </span>
      </b:if>
      <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
        <b:loop values='data:post.comments' var='comment'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <b:if cond='data:comment.favicon'>
              <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
            </b:if>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:blog.enabledCommentProfileImages'>
              <data:comment.authorAvatarImage/>
            </b:if>
            <b:if cond='data:comment.authorUrl'>
              <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
            <b:else/>
              <data:comment.author/>
            </b:if>

        </dt>

          <dd class='comment-body'>
            <b:if cond='data:comment.isDeleted'>
              <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
              <p><data:comment.body/></p>
            </b:if>
          </dd>

          <dd class='comment-footer'>
            <span class='comment-timestamp'>
              <a expr:href='data:comment.url' title='comment permalink'>
                <data:comment.timestamp/>
              </a>
              <b:include data='comment' name='commentDeleteIcon'/>
            </span>
          </dd>
        </b:loop>
      </dl>

      <b:if cond='data:post.commentPagingRequired'>
        <span class='paging-control-container'>
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'>
            <data:post.oldestLinkText/>
          </a>
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'>
            <data:post.olderLinkText/>
          </a>
          &#160;
          <data:post.commentRangeText/>
          &#160;
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'>
            <data:post.newerLinkText/>
          </a>
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'>
            <data:post.newestLinkText/>
          </a>
        </span>
      </b:if>
      <p class='comment-footer'>
        <b:if cond='data:post.embedCommentForm'>
          <b:if cond='data:post.allowNewComments'>
            <b:include data='post' name='comment-form'/>
          <b:else/>
            <data:post.noNewCommentsText/>
          </b:if>
        <b:else/>
          <b:if cond='data:post.allowComments'>
            <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
          </b:if>
        </b:if>

      </p>
    </b:if>
<div id='backlinks-container'>
    <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
       <b:if cond='data:post.showBacklinks'>
         <b:include data='post' name='backlinks'/>
       </b:if>
    </div>
    </div>
  </div>
</b:includable>
</b:widget>
</b:section>
</div>
      <div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML3' locked='false' title='Blogger news' type='HTML'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>
</div>

      <!-- spacer for skins that want sidebar and main to be the same height-->
      <div class='clear'>&#160;</div>
<div id='footer-wrapper'><div id='after-footer'>
     <div id='columnaf1'>
      <b:section class='columna1' id='columna1'>
<b:widget id='BlogArchive1' locked='false' title='Blog archive' type='BlogArchive'>
<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div class='widget-content'>
  <div id='ArchiveList'>
  <div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
    <b:if cond='data:style == &quot;HIERARCHY&quot;'>
     <b:include data='data' name='interval'/>
    </b:if>
    <b:if cond='data:style == &quot;FLAT&quot;'>
      <b:include data='data' name='flat'/>
    </b:if>
    <b:if cond='data:style == &quot;MENU&quot;'>
      <b:include data='data' name='menu'/>
    </b:if>
  </div>
  </div>
  <b:include name='quickedit'/>
  </div>
</b:includable>
<b:includable id='flat' var='data'>
  <ul class='flat'>
    <b:loop values='data:data' var='i'>
      <li class='archivedate'>
        <a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
      </li>
    </b:loop>
  </ul>
</b:includable>
<b:includable id='menu' var='data'>
  <select expr:id='data:widget.instanceId + &quot;_ArchiveMenu&quot;'>
    <option value=''><data:title/></option>
    <b:loop values='data:data' var='i'>
      <option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
    </b:loop>
  </select>
</b:includable>
<b:includable id='interval' var='intervalData'>
  <b:loop values='data:intervalData' var='i'>
      <ul class='hierarchy'>
        <li expr:class='&quot;archivedate &quot; + data:i.expclass'>
          <b:include data='i' name='toggle'/>
          <a class='post-count-link' expr:href='data:i.url'><data:i.name/></a>
            <span class='post-count' dir='ltr'>(<data:i.post-count/>)</span>
          <b:if cond='data:i.data'>
            <b:include data='i.data' name='interval'/>
          </b:if>
          <b:if cond='data:i.posts'>
            <b:include data='i.posts' name='posts'/>
          </b:if>
        </li>
      </ul>
  </b:loop>
</b:includable>
<b:includable id='toggle' var='interval'>
  <b:if cond='data:interval.toggleId'>
  <b:if cond='data:interval.expclass == &quot;expanded&quot;'>
    <a class='toggle' href='javascript:void(0)'>
      <span class='zippy toggle-open'>&#9660;&#160;</span>
    </a>
  <b:else/>
    <a class='toggle' href='javascript:void(0)'>
      <span class='zippy'>
        <b:if cond='data:blog.languageDirection == &quot;rtl&quot;'>
          &#9668;&#160;
        <b:else/>
          &#9658;&#160;
        </b:if>
      </span>
    </a>
  </b:if>
 </b:if>
</b:includable>
<b:includable id='posts' var='posts'>
  <ul class='posts'>
    <b:loop values='data:posts' var='i'>
      <li><a expr:href='data:i.url'><data:i.title/></a></li>
    </b:loop>
  </ul>
</b:includable>
</b:widget>
</b:section>
</div>
<div id='columnaf2'><b:section class='columna2' id='columna2'>
<b:widget id='HTML2' locked='false' title='Blogroll' type='HTML'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>
</div>
<div id='columnaf3'><b:section class='columna3' id='columna3'>
<b:widget id='HTML1' locked='false' title='About' type='HTML'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>
</div>
  </div>
</div>




    </div> <!-- end content-wrapper -->
 <div style='clear:both'/>
</div>
 
<!--  ATENTION DISTRIBUTORS AND USERS: YOU ARE ALLOWED TO DISTRIBUTE THIS TEMPLATE, BUT YOU CAN'T ADD ANY LINK ON THE FOOTER.PLEASE, DO NOT REMOVE THE FOOTER CREDIT LINK. ATENCION DISTRIBUIDORES Y USUARIOS: ESTA PLANTILLA SE PUEDE REDISTRIBUIR, PERO, NO SE PUEDE AGREGAR UN LINK EN EL FOOTER, FAVOR DE NO REMOVER LOS CREDITOS.
  -->
<div id='end2'><div class='top'><span class='rojo'/><span class='azul'/><span class='verde'/><span class='amarillo'/><span class='rojo2'/><span class='azul2'/><span class='verde2'/></div><span style='position:absolute; float:left; font-size:120%; margin:14px 0 0 0; padding: 0px 0 0 10px; top: 0; left: 20%;'><a class='credito' expr:href='data:blog.homepageUrl'><data:blog.title/></a> | Copyright &#169; 2011 Diseأ±ado por:
<a class='credito' href='http://compartidisimo.blogspot.com/' target='_blank'>compartidisimo</a> | Con la tecnologأ­a de:
<a class='credito' href='http://www.blogger.com/' target='_blank'>Blogger</a></span>
</div>
<!-- Place this tag in your head or just before your close body tag -->
<script src='https://apis.google.com/js/plusone.js' type='text/javascript'>
  {lang: &#39;es&#39;}
</script>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/>


</body>
</html>





dibawah ini adalah kode dari template islami



<?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 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 from Layout For All
Name:     Islamic2
Designer: Abdul Munir
URL :     http://layout4all.blogspot.com
Date:     2007
---------------------------------------------*/


#navbar-iframe {
height : 0;
visibility : hidden;
display : none;
}
body {
background : #fff url(http://99computerfiles.googlepages.com/islamic-05.jpg) repeat-y top center;
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 12px;
padding : 0;
margin : auto 0;
color : #191919;
}
html {
padding : 0;
margin : 0;
}
a:link {
text-decoration : none;
color : #0066cc;
border : 0;
}
a:active {
text-decoration : underline;
color : #00a0e3;
border : 0;
}
a:visited {
text-decoration : none;
color : #00a0e3;
border : 0;
}
a:hover {
text-decoration : underline;
color : #002e3f;
border : 0;
}
a:focus {
outline : none;
}
h1, h2, h3, h4 {
font-family : "Trebuchet MS";
}
img {
padding : 0;
margin : 0;
border : none;
text-align : center;
}
#outer-wrapper  {
width : 1000px;
margin : 0 auto;
padding : 0;
}
#header {
background : url(http://99computerfiles.googlepages.com/islamic-01.jpg) no-repeat;
width : 1000px;
padding : 0px;
margin: auto 0px;
height : 208px;
}
.titlewrapper {
padding-top: 20px;
padding-left: 40px;
}
h1.title {
width : 550px;
color: #494b4a;
text-transform : uppercase;
}
.descriptionwrapper {
margin-left: 30px;
width: 560px;
}
p.description {
padding: 0px;
color: #333;
line-height: 1.4em;
}
.Menu {
width : 1000px;
position : relative;
float : left;
background : url(http://99computerfiles.googlepages.com/islamic-02.jpg) repeat-x;
height : 50px;
}
.Menu ul {
list-style : none;
margin : 0;
padding : 0 0 0 10px;
}
.Menu li {
padding : 0;
margin : 0;
display : inline;
font-size : 16px;
font-weight : bold;
font-family : "arial";
}
.Menu a {
padding : 10px 0 0 3px;
margin-right : 2px;
float : left;
}
.Menu a span {
padding : 6px 9px 6px 6px;
display : block;
float : right;
}
.Menu a span {
float : none;
color : #000;
}
.Menu a:hover span {
color : #f60;
}

#content-wrapper {
background : #fff url(http://99computerfiles.googlepages.com/islamic-03.jpg) repeat-y;
width : 1000px;
float : left;
position : relative;
padding : 0;
}
#main {
width : 50%;
float : left;
padding : 10px;
margin-left : 10px;
}
.blog-posts {
padding: 0px;
}
.post {
padding : 0px 0px 30px 0 ;
margin : 0px 0px 18px 0;
background: url(http://layoutforall.googlepages.com/taj-05.jpg) no-repeat bottom center;
}
.date-header {
font-size: 10px;
text-align: right;
color: #7160b8;
padding: 0px;
display: none; /* -- delete this if you display date -- */
}
.post-title {
font-size : 20px;
line-height : 20px;
letter-spacing : -1px;
font-weight : normal;
padding-bottom: 5px;
margin-bottom : 10px;
border-bottom: 1px dotted #333;
}
.post-title a {
color : #333;
text-decoration : none;
}
.post-title a:visited {
color : #f60;
text-decoration : none;
}
.post-title a:hover {
color : #cc6600;
text-decoration : none;
}
.post-author {
padding : 1px 0;
margin : 0;
font-size : 10px;
color : #8a98a2;
font-weight : bold;
}
.post-body {
padding : 0 0 5px 0;
font-size : 12px;
line-height : 1.6em;
}
.post-body p {
font-size : 12px;
line-height : 17px;
}
.post-body ul {
padding : 10px 0;
margin : 0;
}
.post-body ul li {
padding : 2px 0 2px 15px;
list-style-type : none;
background : url(http://img253.imageshack.us/img253/3825/postcontentliicohf8.png) no-repeat left top;
font-size : 11px;
line-height : 15px;
color : #4c4c4c;
}
.post-body blockquote {
padding : 2px 10px;
background : #e9f8ff;
margin : 0;
color : #336699;
}
.post-body blockquote p {
font-size : 11px;
padding : 5px 0;
margin : 5px 0;
line-height : 15px;
}
.post-body blockquote li {
padding : 2px 0 2px 15px;
list-style-type : none;
background : url(http://img410.imageshack.us/img410/634/postcontentblockliicobo1.png) no-repeat left top;
font-size : 11px;
line-height : 15px;
color : #336699;
}
.post-body blockquote a {
color : #0080ca;
}
.post-body blockquote a:visited {
color : #0080ca;
}
.post-body blockquote a:hover {
color : #003399;
}
.post-body a {
text-decoration : underline;
}
.post-footer {
padding: 5px;
color : #336699;
font-size : 10px;
font-weight : bold;
border: 1px solid #ccc;
}
.post-footer a {
text-decoration : underline;
}
.post-labels {
padding : 5px 0 5px 18px;
background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKCyRSt94zqmZxPD-f2-XpNry9HBlHDD68I0eMGfTj-iUBfhXr_JABsxuGLs1XAlrjDi2CrGomI7bVDbcBXjigTfLtvIcHriQ9D6nmhXdXK-QWun51-xtet1XD_YrTkt9b-j1Sn1gRghMB/s1600/PostCateg.png) no-repeat left center;
}
.comment-link {
padding : 5px 0 5px 18px;
background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjD3B06Yv0DRa45MNHGvllCF-2BAeU61MftGSoWyn4bRbRmljvsRLitjdbVkIPcF1uWdY3YAOP4KLBCCbC2iHw-3iEgqlzEN5WhaAaXx2uo5pCr9cYT1fIH-5UA6zv1TQP9FVNwiu9sE5zm/s1600/PostCom.png) no-repeat left center;
}
#blog-pager {
font-size : 11px;
}
#blog-pager-newer-link {
float : left;
}
#blog-pager-older-link {
float : right;
padding-right : 5px;
}
#blog-pager {
text-align : center;
}
#sidebarkiri, #sidebarkanan {
width : 21%;
padding : 10px;
}
#sidebarkiri {
float : left;
}
#sidebarkanan {
float : right;
margin-top : 10px;
}
.feeds {
margin-bottom : 10px;
position : relative;
padding : 10px 15px;
border : 1px solid #99f;
}
.feedsTop {
position : absolute;
left : 0;
top : 0;
width : 230px;
height : 8px;
}
.feeds ul {
margin : 0;
padding : 0;
}
.feeds li {
background : url(http://img165.imageshack.us/img165/3494/feediconimhn5.png) no-repeat left center;
margin : 0;
padding : 3px 0 3px 20px;
list-style-type : none;
font-size : 12px;
color : #0097ca;
}
.feeds li a {
color : #fff;
font-size : 12px;
}
.sidebar {
color : #333;
line-height : 1.5em;
font-size : 12px;
}
.sidebar h2 {
font-size : 12px;
margin-bottom : 12px;
padding : 0 3px 3px 3px;
text-align : left;
text-transform : uppercase;
color : #333;
font-weight : bold;
border-bottom : 1px solid #333;
}
.sidebar ul {
list-style : none;
margin : 0 0 0;
padding : 0 0 0;
}
.sidebar li {
margin : 0;
padding-top : 0;
padding-left : 0;
padding-bottom : 0.25em;
padding-left : 25px;
line-height : 1.5em;
}
.sidebar li a {
padding : 0;
text-decoration : none;
}
.sidebar ul li {
list-style : none;
margin : 5px 0 0 0;
padding : 0 0 3px 0;
border-bottom : 1px dashed #ccc;
}
.profile-img {
float : left;
margin-top : 0;
margin-right : 5px;
margin-bottom : 5px;
margin-left : 0;
padding : 4px;
border : 1px solid #ccc;
}
.profile-data {
margin : 0;
text-transform : uppercase;
letter-spacing : 0.1em;
font-weight : bold;
line-height : 1.6em;
}
.profile-datablock {
margin : 0.5em 0 0.5em;
}
.profile-textblock {
margin : 0.5em 0;
line-height : 1.6em;
}
.profile-link {
text-transform : lowercase;
letter-spacing : 0.1em;
}
#footer-wrapper {
width : 1000px;
position : relative;
color : #fff;
clear : left;
padding : 0;
}
#footer-wrapper a {
color : #92b8cd;
text-decoration : none;
}
#footer-wrapper .links {
font-size : 10px;
color : #92b8cd;
padding : 0;
margin : 0;
}
#comments h4 {
font-size : 14px;
font-weight : bold;
margin : 0 0 5px 0;
padding : 5px 0;
color : #000;
}
.comment-author {
margin : 0;
padding : 0;
font-size : 11px;
line-height : 11px;
letter-spacing : -1px;
color : #333;
font-weight : bold;
display : block;
}
.comment-body {
margin : 5px 0 0 0;
padding : 0;
font-size : 11px;
line-height : 15px;
background : #fff url(images/ComListContent.gif) no-repeat left top;
display : block;
}
dd.comment-footer {
color : #a19a80;
padding : 0;
margin : 0;
font-size : 10px;
}
dd.comment-footer a {
color : #a19a80;
text-decoration : none;
}
dd.comment-footer a:visited {
text-decoration : none;
}
#munir {
background : url(http://99computerfiles.googlepages.com/islamic-04.jpg) repeat-x ;
height : 20px;
font-size : 10px;
padding-top : 10px;
text-align: center;
}
#munir a {
color : #f60;
}
]]></b:skin>
</head>

  <body>
  <div id='outer-wrapper'><div id='wrap2'>
    <span id='skiplinks' style='display:none;'>
      <a href='#main'>main </a> |
      <a href='#sidebar'>sidebar</a>
    </span>

<!-- bagian header -->
    <div id='header-wrapper'>

      <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Mantap Mentong Kabulampet... (Header)' type='Header'>
<b:includable id='main'>

  <b:if cond='data:useImage'>
    <b:if cond='data:imagePlacement == &quot;REPLACE&quot;'>
      <!--Show just the image, no text-->
      <div id='header-inner'>
        <a expr:href='data:blog.homepageUrl' style='display: block'>
          <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
        </a>
      </div>
    <b:else/>
      <!--
      Show image as background to text. You can't really calculate the width
      reliably in JS because margins are not taken into account by any of
      clientWidth, offsetWidth or scrollWidth, so we don't force a minimum
      width if the user is using shrink to fit.
      This results in a margin-width's worth of pixels being cropped. If the
      user is not using shrink to fit then we expand the header.
      -->
      <div expr:style='&quot;background-image: url(\&quot;&quot; + data:sourceUrl + &quot;\&quot;); &quot;                      + &quot;background-position: &quot;                      + data:backgroundPositionStyleStr + &quot;; &quot;                      + data:widthStyleStr                      + &quot;min-height: &quot; + data:height + &quot;px;&quot;                      + &quot;_height: &quot; + data:height + &quot;px;&quot;                      + &quot;background-repeat: no-repeat; &quot;' id='header-inner'>
        <div class='titlewrapper' style='background: transparent'>
          <h1 class='title' style='background: transparent; border-width: 0px'>
            <b:include name='title'/>
          </h1>
        </div>
        <b:include name='description'/>
      </div>
    </b:if>
  <b:else/>
    <!--No header image -->
    <div id='header-inner'>
      <div class='titlewrapper'>
        <h1 class='title'>
          <b:include name='title'/>
        </h1>
      </div>
      <b:include name='description'/>
    </div>
  </b:if>
</b:includable>
<b:includable id='title'>
  <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <data:title/>
  <b:else/>
    <a expr:href='data:blog.homepageUrl'><data:title/></a>
  </b:if>
</b:includable>
<b:includable id='description'>
  <div class='descriptionwrapper'>
    <p class='description'><span><data:description/></span></p>
  </div>
</b:includable>
</b:widget>
</b:section>
    </div>
<div id='header2'/>
<div id='header3'/>
<!-- bagian menu -->
<div class='Menu'>

<ul>
<li><a class='on' href='#'><span>Home</span></a></li>
<li class='page_item'><a href='#' title='Photos'><span>Photos</span></a></li>
<li class='page_item'><a href='#' title='Video'><span>Video</span></a></li>
<li class='page_item'><a href='#' title='Music'><span>Music</span></a></li>
<li class='page_item'><a href='#' title='Calender'><span>Calender</span></a></li>
<li class='page_item'><a href='#' title='Links'><span>Links</span></a></li>
<li class='page_item'><a href='#' title='Contact'><span>Contact</span></a></li>
<li class='page_item'><a href='http://layout4all.blogspot.com/' title='Template/layout'><span>Designer</span></a></li>
</ul>
</div>
<!-- bagian content -->
    <div id='content-wrapper'>

        <b:section class='sidebar' id='sidebarkiri' preferred='yes'>
<b:widget id='LinkList1' locked='false' title='Links' type='LinkList'>
<b:includable id='main'>

<b:if cond='data:title'><h2><data:title/></h2></b:if>
 <div class='widget-content'>
   <ul>
     <b:loop values='data:links' var='link'>
       <li><a expr:href='data:link.target'><data:link.name/></a></li>
     </b:loop>
   </ul>
   <b:include name='quickedit'/>
 </div>
</b:includable>
</b:widget>
<b:widget id='Feed1' locked='false' title='Layout for all' type='Feed'>
<b:includable id='main'>
    <h2><data:title/></h2>
    <div class='widget-content'>
    <ul expr:id='data:widget.instanceId + &quot;_feedItemListDisplay&quot;'>
      <b:loop values='data:feedData.items' var='i'>
        <li>
          <span class='item-title'>
            <a expr:href='data:i.alternate.href'>
              <data:i.title/>
            </a>
          </span>
          <b:if cond='data:showItemDate'>
            <b:if cond='data:i.str_published != &quot;&quot;'>
              <span class='item-date'>
                &#160;-&#160;<data:i.str_published/>
              </span>
            </b:if>
          </b:if>
          <b:if cond='data:showItemAuthor'>
            <b:if cond='data:i.author != &quot;&quot;'>
              <span class='item-author'>
                &#160;-&#160;<data:i.author/>
              </span>
            </b:if>
          </b:if>
        </li>
      </b:loop>
    </ul>
    <b:include name='quickedit'/>
    </div>
  </b:includable>
</b:widget>
<b:widget id='NewsBar1' locked='false' title='Perihal' type='NewsBar'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>

  <div class='widget-content' style='width:100%'>
    <div expr:id='data:widget.instanceId + &quot;_bar&quot;'>
      <span class='newsBar-status'>Loading...</span>
    </div>
  </div>

  <b:include name='quickedit'/>
</b:includable>
</b:widget>
<b:widget id='BlogArchive1' locked='false' title='Arsip blog' type='BlogArchive'>
<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div class='widget-content'>
  <div id='ArchiveList'>
  <div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
    <b:if cond='data:style == &quot;HIERARCHY&quot;'>
     <b:include data='data' name='interval'/>
    </b:if>
    <b:if cond='data:style == &quot;FLAT&quot;'>
      <b:include data='data' name='flat'/>
    </b:if>
    <b:if cond='data:style == &quot;MENU&quot;'>
      <b:include data='data' name='menu'/>
    </b:if>
  </div>
  </div>
  <b:include name='quickedit'/>
  </div>
</b:includable>
<b:includable id='flat' var='data'>
  <ul>
    <b:loop values='data:data' var='i'>
      <li class='archivedate'>
        <a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
      </li>
    </b:loop>
  </ul>
</b:includable>
<b:includable id='menu' var='data'>
  <select expr:id='data:widget.instanceId + &quot;_ArchiveMenu&quot;'>
    <option value=''><data:title/></option>
    <b:loop values='data:data' var='i'>
      <option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
    </b:loop>
  </select>
</b:includable>
<b:includable id='interval' var='intervalData'>
  <b:loop values='data:intervalData' var='i'>
      <ul>
        <li expr:class='&quot;archivedate &quot; + data:i.expclass'>
          <b:include data='i' name='toggle'/>
          <a class='post-count-link' expr:href='data:i.url'><data:i.name/></a>
            <span class='post-count' dir='ltr'>(<data:i.post-count/>)</span>
          <b:if cond='data:i.data'>
            <b:include data='i.data' name='interval'/>
          </b:if>
          <b:if cond='data:i.posts'>
            <b:include data='i.posts' name='posts'/>
          </b:if>
        </li>
      </ul>
  </b:loop>
</b:includable>
<b:includable id='toggle' var='interval'>
  <b:if cond='data:interval.toggleId'>
  <b:if cond='data:interval.expclass == &quot;expanded&quot;'>
    <a class='toggle' expr:href='data:widget.actionUrl + &quot;&amp;action=toggle&quot; +       &quot;&amp;dir=close&amp;toggle=&quot; + data:interval.toggleId +       &quot;&amp;toggleopen=&quot; + data:toggleopen'>
        <span class='zippy toggle-open'>&#9660; </span>
    </a>
  <b:else/>
    <a class='toggle' expr:href='data:widget.actionUrl + &quot;&amp;action=toggle&quot; +         &quot;&amp;dir=open&amp;toggle=&quot; + data:interval.toggleId +         &quot;&amp;toggleopen=&quot; + data:toggleopen'>
          <span class='zippy'>
            <b:if cond='data:blog.languageDirection == &quot;rtl&quot;'>
              &#9668;
            <b:else/>
              &#9658;
            </b:if>
          </span>
    </a>
  </b:if>
 </b:if>
</b:includable>
<b:includable id='posts' var='posts'>
  <ul class='posts'>
    <b:loop values='data:posts' var='i'>
      <li><a expr:href='data:i.url'><data:i.title/></a></li>
    </b:loop>
  </ul>
</b:includable>
</b:widget>
</b:section>



        <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>
<b:includable id='main' var='top'>
  <!-- posts -->
  <div class='blog-posts hfeed'>

    <b:include data='top' name='status-message'/>

    <data:adStart/>
    <b:loop values='data:posts' var='post'>
      <b:if cond='data:post.dateHeader'>
        <h2 class='date-header'><data:post.dateHeader/></h2>
      </b:if>
      <b:include data='post' name='post'/>
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
        <b:include data='post' name='comments'/>
      </b:if>
      <b:if cond='data:post.includeAd'>
        <data:adEnd/>
        <data:adCode/>
        <data:adStart/>
      </b:if>
    </b:loop>
    <data:adEnd/>
  </div>

  <!-- navigation -->
  <b:include name='nextprev'/>

  <!-- feed links -->
  <b:include name='feedLinks'/>
 
  <b:if cond='data:top.showStars'>
    <script src='http://www.google.com/jsapi' type='text/javascript'/>
    <script type='text/javascript'>
      google.load(&quot;annotations&quot;, &quot;1&quot;, {&quot;locale&quot;: &quot;<data:top.languageCode/>&quot;});
      function initialize() {
        google.annotations.setApplicationId(<data:top.blogspotReviews/>);
        google.annotations.createAll();
        google.annotations.fetch();
      }
      google.setOnLoadCallback(initialize);
    </script>
  </b:if>

</b:includable>
<b:includable id='nextprev'>
  <div class='blog-pager' id='blog-pager'>
    <b:if cond='data:newerPageUrl'>
      <span id='blog-pager-newer-link'>
      <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
      </span>
    </b:if>

    <b:if cond='data:olderPageUrl'>
      <span id='blog-pager-older-link'>
      <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
      </span>
    </b:if>

    <b:if cond='data:blog.homepageUrl != data:blog.url'>
      <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
      <b:else/>
      <b:if cond='data:newerPageUrl'>
        <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
      </b:if>
    </b:if>

  </div>
  <div class='clear'/>
</b:includable>
<b:includable id='post' var='post'>
  <div class='post hentry uncustomized-post-template'>
    <a expr:name='data:post.id'/>
    <b:if cond='data:post.title'>
      <h3 class='post-title entry-title'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h3>
    </b:if>

    <div class='post-header-line-1'/>

    <div class='post-body entry-content'>
      <data:post.body/>
      <div style='clear: both;'/> <!-- clear for photos floats -->
    </div>

    <div class='post-footer'>
    <div class='post-footer-line post-footer-line-1'>
      <span class='post-author vcard'>
        <b:if cond='data:top.showAuthor'>
          <data:top.authorLabel/>
          <span class='fn'><data:post.author/></span>
        </b:if>
      </span>

      <span class='post-timestamp'>
        <b:if cond='data:top.showTimestamp'>
          <data:top.timestampLabel/>
        <b:if cond='data:post.url'>
          <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
        </b:if>
        </b:if>
      </span>
 
      <span class='reaction-buttons'>
        <b:if cond='data:top.showReactions'>
          <table border='0' cellpadding='0' width='100%'><tr>
            <td valign='center'><span class='reactions-label'>
              <data:top.reactionsLabel/></span>
              &#160;</td>
            <td><iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/></td>
           </tr></table>
        </b:if>
      </span>

      <span class='star-ratings'>
        <b:if cond='data:top.showStars'>
           <div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:height='42' g:type='RatingPanel' g:width='280'/>
        </b:if>
      </span>

      <span class='post-comment-link'>
        <b:if cond='data:blog.pageType != &quot;item&quot;'>
          <b:if cond='data:post.allowComments'>
            <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
          </b:if>
        </b:if>
      </span>

       <!-- backlinks -->
       <span class='post-backlinks post-comment-link'>
         <b:if cond='data:blog.pageType != &quot;item&quot;'>
           <b:if cond='data:post.showBacklinks'>
             <a class='comment-link' expr:href='data:post.url + &quot;#links&quot;'><data:top.backlinkLabel/></a>
           </b:if>
         </b:if>
       </span>

      <span class='post-icons'>
        <!-- email post links -->
        <b:if cond='data:post.emailPostUrl'>
          <span class='item-action'>
          <a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
              <img alt='' class='icon-action' src='http://www.blogger.com/img/icon18_email.gif'/>
          </a>
          </span>
        </b:if>

        <!-- quickedit pencil -->
        <b:include data='post' name='postQuickEdit'/>
      </span>
      </div>

      <div class='post-footer-line post-footer-line-2'>
      <span class='post-labels'>
        <b:if cond='data:post.labels'>
          <data:postLabelsLabel/>
          <b:loop values='data:post.labels' var='label'>
            <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
          </b:loop>
        </b:if>
      </span>
      </div>

      <div class='post-footer-line post-footer-line-3'/>
    </div>
  </div>
</b:includable>
<b:includable id='postQuickEdit' var='post'>
  <b:if cond='data:post.editUrl'>
    <span expr:class='&quot;item-control &quot; + data:post.adminClass'>
      <a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
        <img alt='' class='icon-action' src='http://www.blogger.com/img/icon18_edit_allbkg.gif'/>
      </a>
    </span>
  </b:if>
</b:includable>
<b:includable id='commentDeleteIcon' var='comment'>
  <span expr:class='&quot;item-control &quot; + data:comment.adminClass'>
    <a expr:href='data:comment.deleteUrl' expr:title='data:top.deleteCommentMsg'>
      <img src='http://www.blogger.com/img/icon_delete13.gif'/>
    </a>
  </span>
</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'>
  <span expr:class='&quot;item-control &quot; + data:backlink.adminClass'>
    <a expr:href='data:backlink.deleteUrl' expr:title='data:top.deleteBacklinkMsg'>
      <img src='http://www.blogger.com/img/icon_delete13.gif'/>
    </a>
  </span>
</b:includable>
<b:includable id='comments' var='post'>
  <div class='comments' id='comments'>
    <a name='comments'/>
    <b:if cond='data:post.allowComments'>
      <h4>
        <b:if cond='data:post.numComments == 1'>
          1 <data:commentLabel/>:
        <b:else/>
          <data:post.numComments/> <data:commentLabelPlural/>:
        </b:if>
      </h4>

      <b:if cond='data:post.commentPagingRequired'>
        <span class='paging-control-container'>
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'><data:post.oldestLinkText/></a>
          &#160;
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'><data:post.olderLinkText/></a>
          &#160;
          <data:post.commentRangeText/>
          &#160;
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'><data:post.newerLinkText/></a>
          &#160;
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'><data:post.newestLinkText/></a>
        </span>
      </b:if>

      <dl id='comments-block'>
        <b:loop values='data:post.comments' var='comment'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:comment.authorUrl'>
              <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
            <b:else/>
              <data:comment.author/>
            </b:if>
            <data:commentPostedByMsg/>
          </dt>
          <dd class='comment-body'>
            <b:if cond='data:comment.isDeleted'>
              <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
              <p><data:comment.body/></p>
            </b:if>
          </dd>
          <dd class='comment-footer'>
            <span class='comment-timestamp'>
              <a expr:href='data:comment.url' title='comment permalink'>
                <data:comment.timestamp/>
              </a>
              <b:include data='comment' name='commentDeleteIcon'/>
            </span>
          </dd>
        </b:loop>
      </dl>

      <b:if cond='data:post.commentPagingRequired'>
        <span class='paging-control-container'>
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'>
            <data:post.oldestLinkText/>
          </a>
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'>
            <data:post.olderLinkText/>
          </a>
          &#160;
          <data:post.commentRangeText/>
          &#160;
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'>
            <data:post.newerLinkText/>
          </a>
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'>
            <data:post.newestLinkText/>
          </a>
        </span>
      </b:if>

      <p class='comment-footer'>

        <b:if cond='data:post.embedCommentForm'>
          <b:include data='post' name='comment-form'/>
        <b:else/>
          <b:if cond='data:post.allowComments'>
            <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
          </b:if>
        </b:if>

      </p>
    </b:if>

    <div id='backlinks-container'>
    <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
       <b:if cond='data:post.showBacklinks'>
         <b:include data='post' name='backlinks'/>
       </b:if>
    </div>
    </div>
  </div>
</b:includable>
<b:includable id='comment-form' var='post'>
  <div class='comment-form'>
    <a name='comment-form'/>
    <h4 id='comment-post-message'><data:postCommentMsg/></h4>
    <p><data:blogCommentMessage/></p>
    <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src' style='display: none'/>
    <iframe allowtransparency='true' class='blogger-iframe-colorize' frameborder='0' height='275' id='comment-editor' scrolling='auto' src='' width='100%'/>
    <data:post.iframeColorizer/>
  </div>
</b:includable>
<b:includable id='backlinks' var='post'>
  <a name='links'/><h4><data:post.backlinksLabel/></h4>
  <b:if cond='data:post.numBacklinks != 0'>
    <dl class='comments-block' id='comments-block'>
      <b:loop values='data:post.backlinks' var='backlink'>
        <div class='collapsed-backlink backlink-control'>
          <dt class='comment-title'>
            <span class='backlink-toggle-zippy'>&#160;</span>
            <a expr:href='data:backlink.url' rel='nofollow'><data:backlink.title/></a>
            <b:include data='backlink' name='backlinkDeleteIcon'/>
          </dt>
          <dd class='comment-body collapseable'>
            <data:backlink.snippet/>
          </dd>
          <dd class='comment-footer collapseable'>
            <span class='comment-author'><data:post.authorLabel/> <data:backlink.author/></span>
            <span class='comment-timestamp'><data:post.timestampLabel/> <data:backlink.timestamp/></span>
          </dd>
        </div>
      </b:loop>
    </dl>
  </b:if>
  <p class='comment-footer'>
    <a class='comment-link' expr:href='data:post.createLinkUrl' expr:id='data:widget.instanceId + &quot;_backlinks-create-link&quot;' target='_blank'><data:post.createLinkLabel/></a>
  </p>
</b:includable>
<b:includable id='feedLinks'>
  <b:if cond='data:blog.pageType != &quot;item&quot;'> <!-- Blog feed links -->
    <b:if cond='data:feedLinks'>
      <div class='blog-feeds'>
        <b:include data='feedLinks' name='feedLinksBody'/>
      </div>
    </b:if>

    <b:else/> <!--Post feed links -->
    <div class='post-feeds'>
      <b:loop values='data:posts' var='post'>
        <b:if cond='data:post.allowComments'>
          <b:if cond='data:post.feedLinks'>
            <b:include data='post.feedLinks' name='feedLinksBody'/>
          </b:if>
        </b:if>
      </b:loop>
    </div>
  </b:if>
</b:includable>
<b:includable id='feedLinksBody' var='links'>
  <div class='feed-links'>
  <data:feedLinksMsg/>
  <b:loop values='data:links' var='f'>
     <a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
  </b:loop>
  </div>
</b:includable>
<b:includable id='status-message'>
  <b:if cond='data:navMessage'>
  <div class='status-msg-wrap'>
    <div class='status-msg-body'>
      <data:navMessage/>
    </div>
    <div class='status-msg-border'>
      <div class='status-msg-bg'>
        <div class='status-msg-hidden'><data:navMessage/></div>
      </div>
    </div>
  </div>
  <div style='clear: both;'/>
  </b:if>
</b:includable>
</b:widget>
</b:section>



        <b:section class='sidebar' id='sidebarkanan' preferred='yes'>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'>
<b:includable id='main'>
    <b:if cond='data:title != &quot;&quot;'>
      <h2><data:title/></h2>
    </b:if>
    <div class='widget-content'>
    <b:if cond='data:team == &quot;true&quot;'> <!-- team blog profile -->
      <ul>
        <b:loop values='data:authors' var='i'>
          <li><a expr:href='data:i.userUrl'><data:i.display-name/></a></li>
        </b:loop>
      </ul>

      <b:else/> <!-- normal blog profile -->

      <b:if cond='data:photo.url != &quot;&quot;'>
        <a expr:href='data:userUrl'><img class='profile-img' expr:alt='data:photo.alt' expr:height='data:photo.height' expr:src='data:photo.url' expr:width='data:photo.width'/></a>
      </b:if>

      <dl class='profile-datablock'>
        <dt class='profile-data'><data:displayname/></dt>

        <b:if cond='data:showlocation == &quot;true&quot;'>
          <dd class='profile-data'><data:location/></dd>
        </b:if>

        <b:if cond='data:aboutme != &quot;&quot;'><dd class='profile-textblock'><data:aboutme/></dd></b:if>
      </dl>
      <a class='profile-link' expr:href='data:userUrl'><data:viewProfileMsg/></a>
    </b:if>

     <b:include name='quickedit'/>
    </div>
  </b:includable>
</b:widget>
<b:widget id='Label1' locked='false' title='label' type='Label'>
<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <ul>
    <b:loop values='data:labels' var='label'>
      <li>
        <b:if cond='data:blog.url == data:label.url'>
          <span expr:dir='data:blog.languageDirection'>
            <data:label.name/>
          </span>
        <b:else/>
          <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
            <data:label.name/>
          </a>
        </b:if>
        <span dir='ltr'>(<data:label.count/>)</span>
      </li>
    </b:loop>
    </ul>

    <b:include name='quickedit'/>
  </div>
</b:includable>
</b:widget>
<b:widget id='BloggerButton1' locked='false' title='' type='BloggerButton'>
<b:includable id='main'>
 <div class='widget-content'>
    <a href='http://www.blogger.com'><img alt='Powered By Blogger' expr:src='data:fullButton'/></a>
    <b:include name='quickedit'/>
  </div>
</b:includable>
</b:widget>
</b:section>



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

<div id='munir'>
  <!-- Tulisan dibawah ini jangan dihapus -->
Design by <a href='http://layout4all.blogspot.com/'> Abdul Munir</a> Visit Original Post <a href='http://layout4all.blogspot.com/2007/12/islamic2-template.html'>Islamic2 Template</a>
</div>
</div>
</div>
</body>
</html>

silahkan langsung dicopy dan di paste di edit template atau html anda semoga manfaat