Trucos - Consejos - Turoriales Blogger
<div align="center" style="background:#CCCCCC; border-bottom: #000000 1px dotted; border-left-color: #AFAFAF; border-left-style: outset; border-right-color: #AFAFAF; border-right-style: inset; border-top-color: #AFAFAF; border-top-style: groove; color: black; height: 100px; overflow: scroll; scrollbar-3dlight-color: #FFFFFF; scrollbar-arrow-color: #FFFFFF; scrollbar-darkshadow-color: #FFFFFF; scrollbar-face-color: #FFFFFF; scrollbar-highlight-color: #FFFFFF; scrollbar-shadow-color: #FFFFFF; width: auto;">
<title><data:blog.pageTitle/></title>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> : <data:blog.title/></title>
</b:if>
<b:section-contents id='sidebar-right-1'>Nos mostrara la sección donde se encuentran las identificaciones de los gadgets de la sidebar, cuyo código es como el siguiente:
<b:section-contents id='sidebar-right-1'>Este código corresponde a un blog con seis tipos de gadgets. Cada uno de los entrecomillados resaltados en rojo es como se identifica cada uno de los gadgets, es lo que debemos tener en cuenta para personalizarlos. Los entrecomillados resaltados en azul son los tipos de gadgtes.
<b:widget id='BlogArchive1' locked='false' title='Título del gadget' type='BlogArchive'/>
<b:widget id='Profile1' locked='false' title='Título del gadget' type='Profile'/>
<b:widget id='Image1' locked='false' title='Título del gadget' type='Image'/>
<b:widget id='Text1' locked='false' title='Título del gadget' type='Text'/>
<b:widget id='HTML1' locked='false' title='Título del gadget' type='HTML'/>
<b:widget id='NewsBar1' locked='false' title='Título del gadget' type='NewsBar'/>
</b:section-contents>
#BlogArchive1 h2{
color: #0b3861; /* Color del título */
background: #58acfa; /* Color del fondo */
text-align: center; /* Título en el centro */
font-weight: bold; /* Título en negrilla */
font-family: Verdana; /* Tipo de fuente */
font-size: 12px; /* Tamaño de la fuente */
}
<b:widget id='HTML1' locked='false' title='Título del gadget' type='HTML'>
<b:widget id='HTML1' locked='false' title='Título del gadget' type='HTML'>Vamos a:
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
.post-title{
color: #000; /* Color del título */
background: url(URL de la imagen) center left no-repeat;
text-transform: uppercase;
font-size:16px !important;
text-align: center;
letter-spacing: 2px;
text-shadow: #999 1px -1px 1px;
border-top: 2px double #666;
border-bottom: 2px solid #666;
border-right: 0px double #666;
border-left: 0px double #666;
}
#Text1 .widget-content{
color: #000000; /* Color del texto */
background: #cccccc; /* Color del fondo */
font-family: Verdana; /* Tipo de fuente */
font-size: 12px; /* Tamaño la fuente */
}
......widget-content{
color: #...; /* Color del texto */
background: #...; /* Color del fondo */
font-family: ....; /* Tipo de fuente */
font-size: ...px; /* Tamaño de la fuente */
}
.sidebar .widget {
margin: 0 0 15px;
padding: 0 0 15px;
border-bottom: 2px solid #eee;
}
.sidebar .widget-content {
margin-top: 15px;
}
.sidebar .widget h2 {
border-bottom: 1px solid #eee;
padding-bottom: 5px;
text-align: center;
text-transform: uppercase;
}
