lunes, 7 de enero de 2008

Código Plantilla

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



<style type='text/css'>

#navbar-iframe {

height:0px;

visibility:hidden;

display:none;

}

</style>



<head>



<b:include data='blog' name='all-head-content'/>

<!-- Optimización del título en Blogger -->



<title>AQUI TITULO O TEXTO</title>



<!-- Termina título optimizado -->



<link href='http://3.bp.blogspot.com/_11C4h7_3E8U/Ro_dp35i6DI/AAAAAAAAD9U/qvAw2tWS8LI/s400/www_seriocomic_com.gif' rel='shortcut icon' type='image/x-icon'/>

<link href='http://3.bp.blogspot.com/_11C4h7_3E8U/Ro_dp35i6DI/AAAAAAAAD9U/qvAw2tWS8LI/s400/www_seriocomic_com.gif' rel='icon' type='image/png'/>



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

-----------------------------------------------

Blogger Template Style

Name: Yolanda Cabalas Virtuales

Designer: Cabalas Virtuales 2

URL: http://cabalasvirtuales.blogspot.com/

Date: 11 agosto 2007

----------------------------------------------- */



/* Variable definitions

====================

<Variable name="bgcolor" description="Page Background Color"

type="color" default="#000" value="#999999">

<Variable name="textcolor" description="Text Color"

type="color" default="#ccc" value="#808080">

<Variable name="linkcolor" description="Link Color"

type="color" default="#9ad" value="#940f04">

<Variable name="pagetitlecolor" description="Blog Title Color"

type="color" default="#ccc" value="#7f7f7f">

<Variable name="descriptioncolor" description="Blog Description Color"

type="color" default="#777" value="#191919">

<Variable name="titlecolor" description="Post Title Color"

type="color" default="#ad9" value="#940f04">

<Variable name="bordercolor" description="Border Color"

type="color" default="#333" value="#333333">

<Variable name="sidebarcolor" description="Sidebar Title Color"

type="color" default="#777" value="#000000">

<Variable name="sidebartextcolor" description="Sidebar Text Color"

type="color" default="#999" value="#000000">

<Variable name="visitedlinkcolor" description="Visited Link Color"

type="color" default="#a7a" value="#940f04">

<Variable name="bodyfont" description="Text Font"

type="font" default="normal normal 100% 'Trebuchet MS',Trebuchet,Verdana,Sans-serif" value="normal normal 107% Trebuchet, Trebuchet MS, Arial, sans-serif">

<Variable name="headerfont" description="Sidebar Title Font"

type="font"

default="normal bold 78% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif" value="normal bold 91% Verdana, sans-serif">

<Variable name="pagetitlefont" description="Blog Title Font"

type="font"

default="normal bold 200% 'Trebuchet MS',Trebuchet,Verdana,Sans-serif" value="normal bold 275% Georgia, Times, serif">

<Variable name="descriptionfont" description="Blog Description Font"

type="font"

default="normal normal 78% 'Trebuchet MS', Trebuchet, Verdana, Sans-serif" value="normal bold 105% Georgia, Times, serif">

<Variable name="postfooterfont" description="Post Footer Font"

type="font"

default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 67% Trebuchet, Trebuchet MS, Arial, sans-serif">

*/



/* Use this with templates/template-twocol.html */



body {

background:#222222;

color:$textcolor;

font: x-small "Trebuchet MS", Trebuchet, Verdana, Sans-serif;

font-size/* */:/**/small;

font-size: /**/small;

text-align: center;

}

a:link {

color:$linkcolor;

text-decoration:none;

}

a:visited {

color:$visitedlinkcolor;

text-decoration:none;

}

a:hover {

color:$titlecolor;

text-decoration:underline;

}

a img {

border-width:0;

}



/* Header

-----------------------------------------------

*/



#header-wrapper {

width:799px;

height:205px;

background: #c7c7c7 url(http://1.bp.blogspot.com/_11C4h7_3E8U/R3La_rP2UPI/AAAAAAAAKEA/FZ4alxFaQdk/s1600/header%2Bdeporte.jpg);

border-top: #000 solid 5px;

border-bottom: #000 solid 10px;

}



#header {

margin: 5px;

text-align: center;

color:$pagetitlecolor;

}



#header h1 {

margin:5px 5px 0;

padding:15px 20px .25em;

line-height:1.2em;

text-transform:uppercase;

letter-spacing:.2em;

font: $pagetitlefont;

}



#header a {

color:$pagetitlecolor;

text-decoration:none;

}



#header a:hover {

color:$pagetitlecolor;

}



#header .description {

margin:0 5px 5px;

padding:0 20px 15px;

max-width:700px;

text-transform:uppercase;

letter-spacing:.2em;

line-height: 1.4em;

font: $descriptionfont;

color: $descriptioncolor;

}







/* Outer-Wrapper

----------------------------------------------- */

#outer-wrapper {

background:#808080;

width: 975px;

margin:0 auto;

padding:0px;

text-align:left;

font: $bodyfont;

border: #6d6d6d solid 10px;

}



#main-wrapper {

width: 799px;

float: left;

background: #cac6c6;

border-right: #000 solid 10px;

padding-top: 0px;

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */

overflow: hidden; /* fix for long non-text content breaking IE sidebar float */

}



#sidebar-wrapper {

width: 166px;

float: right;

background:#D3D3D3;

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */

overflow: hidden; /* fix for long non-text content breaking IE sidebar float */

}





/* Headings

----------------------------------------------- */



h2 {

margin:1.5em 0 .75em;



font:$headerfont;

line-height: 1.4em;

text-transform:uppercase;

letter-spacing:.2em;

color:#000000;

}





/* Posts

-----------------------------------------------

*/

h2.date-header {

margin:1.5em 0 .5em;

padding-left:15px;

}



.post {

margin:.5em 0 1.5em;

border-left:15px solid #000;

border-right:15px solid #cac6c6;

background: #f4f4f4;

padding-bottom:1.5em;

padding-left:15px;

padding-right:15px;

}

.post h3 {

margin:.25em 0 0;

padding:25 0 15px;

font-size:140%;

font-weight:normal;

line-height:1.4em;

color:$titlecolor;

}



.post h3 a, .post h3 a:visited, .post h3 strong {

display:block;

text-decoration:none;

color:$titlecolor;

font-weight:bold;

}



.post h3 strong, .post h3 a:hover {

color:$textcolor;

}



.post p {

margin:0 0 .75em;

line-height:1.6em;

padding:25 0 15px;

}



.post-footer {

margin: .75em 0;

color:$sidebarcolor;

text-transform:uppercase;

letter-spacing:.1em;

font: $postfooterfont;

line-height: 1.4em;

}



.comment-link {

margin-left:.6em;

padding-left: 15px;

}

.post img {

padding:4px;

border:1px solid $bordercolor;

}

.post blockquote {

margin:1em 20px;

}

.post blockquote p {

margin:.75em 0;

}



/* Comments

----------------------------------------------- */





#comments h4 {

margin:1em 0;

font-weight: bold;

line-height: 1.4em;

text-transform:uppercase;

letter-spacing:.2em;

color: $sidebarcolor;

padding-left: 10px;

}



#comments-block {

background: #e3e3e3;

width: 400px;

border: 15px solid #cac6c6;

margin:1em 0 1.5em;

line-height:1.6em;

padding-left: 10px;

padding-right: 10px



}

#comments-block .comment-author {

margin:.5em 0;

padding-left: 10px;

}

#comments-block .comment-body {

margin:.25em 0 0;

padding-left: 10px;

paddigg-right: 10px;

}

#comments-block .comment-footer {

margin:-.25em 0 2em;

line-height: 1.4em;

text-transform:uppercase;

letter-spacing:.1em;

padding-left: 10px;



}

#comments-block .comment-body p {

margin:0 0 .75em;

padding-left: 10px;

border-bottom: 15px solid cac6c6;

}

.deleted-comment {

font-style:italic;

color:gray;

}



.feed-links {

clear: both;

line-height: 2.5em;

padding-left: 15px;

}



#blog-pager-newer-link {

float: left;

padding-left: 15px;

}



#blog-pager-older-link {

float: right;

padding-right: 15px;

}



#blog-pager {

text-align: center;

}



/* Sidebar Content

----------------------------------------------- */

.sidebar {

color: $sidebartextcolor;

line-height: 1.5em;

}

.sidebar h2 {

margin:1.5em 0 .75em;

font:$headerfont;

line-height: 2.0em;

text-transform:uppercase;

text-align:left;

padding-left: 10px;

letter-spacing:.2em;

color: #ff98cb;



background: #6d6d6d;



}

.sidebar ul {

list-style:none;

margin:0 0 0;

padding-left:10px;



}

.sidebar li {

margin:0;

padding-left: 10px;

text-indent:-15px;

line-height:1.5em;



}



.sidebar .widget, .main .widget {



margin:0 0 0em;

padding:0 0 0em;



}



.sidebar .widget a{

color: #000000;

}

.main .Blog {

border-bottom-width: 0;

}



/* Profile

----------------------------------------------- */

.profile-img {

float: left;

margin: 0 5px 5px 0;

padding: 4px;

border: 1px solid $bordercolor;

}



.profile-data {

margin:0;

text-transform:uppercase;

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: uppercase;

letter-spacing: .1em;

}



/* Footer

----------------------------------------------- */

#footer {

width:780px;

height:5px;

background: #6d6d6d;

clear:both;

margin:0 auto;

padding-top:15px;

line-height: 1.6em;

text-transform:uppercase;

letter-spacing:.1em;

text-align: center;

}

.credit{

font-size:10px;

color: #fff;

display:block;

text-align: center;

background:#6d6d6d;

height:20px;

}

.credit a{

color: #fff;

}





/** Page structure tweaks for layout editor wireframe */

body#layout #header {

margin-left: 0px;

margin-right: 0px;

}



.feed-links {

padding-left: 20px;

padding-top: 5px;

background: url(http://1.bp.blogspot.com/_Zuzii37VUO4/Rj7ME-MBRJI/AAAAAAAAAwM/IOo-YUYR5aM/s1600/icono-feed.gif) center left no-repeat;

}



.comment-link {

padding-left: 20px;

padding-top: 5px;

background: url(http://2.bp.blogspot.com/_Zuzii37VUO4/Rkqpd5yax8I/AAAAAAAABQg/tu-ANuj9tvo/s1600/icono-comentarios.gif) center left no-repeat;

}



#backlinks-container h4 {

padding-left: 20px;

padding-top: 5px;

background: url(http://1.bp.blogspot.com/_Zuzii37VUO4/Rkqpdpyax6I/AAAAAAAABQQ/g0c6ItO8SaQ/s1600/icono-backlinks.gif) center left no-repeat;

}



date-header {

padding-left: 20px;

padding-top: 5px;

background: url(http://3.bp.blogspot.com/_Zuzii37VUO4/Rkn-DuMBU_I/AAAAAAAABN0/CNp5q8l_KY8/s1600/time.png) center left no-repeat;

}



.post-labels {

padding-left: 20px;

padding-top: 5px;

background: url(http://2.bp.blogspot.com/_11C4h7_3E8U/RtHY9cnB6eI/AAAAAAAAFhU/aiTBNfLvB1o/s400/lupaet.png) center left no-repeat;

}



#Label1 ul, #Label2 ul {

list-style-type:none;

}



#Label1 li, #Label2 li {

padding-left: 40px;

padding-top: 5px;

background: url(http://2.bp.blogspot.com/_11C4h7_3E8U/RtHY9cnB6eI/AAAAAAAAFhU/aiTBNfLvB1o/s400/lupaet.png) center left no-repeat;

}



.post-author {

padding-left: 20px;

padding-top: 5px;

background: url(http://2.bp.blogspot.com/_Zuzii37VUO4/RfebZS0300I/AAAAAAAAAcw/dBZjEJ39hDE/s1600/autor.gif) center left no-repeat;

}



.comment-timestamp {

padding-left: 20px;

padding-top: 5px;

background: url(http://1.bp.blogspot.com/_Zuzii37VUO4/Rkqpdpyax7I/AAAAAAAABQY/lPj-wAcTrRM/s1600/icono-calendario.gif) center left no-repeat;

}



.post-title {

padding-left: 40px;

padding-top: 5px;

background: url(http://4.bp.blogspot.com/_WV9hNk6njDg/RktmFlwsUtI/AAAAAAAAAFw/sQ1g1ZKrsXc/s400/crobbo.gif) center left no-repeat;

}



#fecha {

display: block;

margin:0 10px;

float:left;

padding: 5px;

color: #464646;

background: #e4e3ad;

border:#d7d675 3px solid;

text-transform:capitalize;

}



.fecha_dia {

display: block;

font-size: 16px;

font-weight:bold;

}



.fecha_mes {

display: block;

font-size: 10px;

}



.fecha_anio {

display: block;

font-size: 10px;

}



blockquote {

background: url(http://2.bp.blogspot.com/_11C4h7_3E8U/Rqc21MN8llI/AAAAAAAAEZs/ikVHcixUxiQ/s400/comillastres.gif) no-repeat 0 3px;

color: #666;

padding-left: 25px;

font-size : 15pt;

font-style: italic;

margin-bottom: 1px;

display:block;

padding-top:5px;



}





#navcontainer

{

padding: 0;

background: #ccc;

height: 20px;

}



#navlist

{

margin: 0px;

padding: 0px 0px;

display: block;

}



#navlist li

{

list-style: none;

float: left;

}



#navcontainer a, #navlist li.extend

{

margin: 0px;

display: block;

border-top: 1px solid #333;

padding: 1px 6px;

text-decoration: none;

background: #ccc;

font: normal 12px verdana, serif;

color: #000;

}



#navcontainer a:hover, #navcontainer a#current

{

padding: 1px 5px;

background: #FAFAFA;

border-right: 1px solid #333;

border-left: 1px solid #333;

border-top: 1px solid #FAFAFA;

border-bottom: 1px solid #333;

color: #000;

}



#navcontainer a#current

{

background: #F6F6F6;

border-top: 1px solid #F6F6F6;

font-weight: bold;

}



#navcontainer li#active

{

border-right: 2px solid #828282;

border-bottom: 2px solid #828282;

}







]]></b:skin>



</head>



<body>

<div id='outer-wrapper'><div id='wrap2'>



<!-- skip links for text browsers -->

<span id='skiplinks' style='display:none;'>

<a href='#main'>skip to main </a> |

<a href='#sidebar'>skip to sidebar</a>

</span>







<div id='content-wrapper'>







<div id='main-wrapper'>

<div id='header-wrapper'>

<b:section class='header' id='header' maxwidgets='3' showaddelement='yes'>

<b:widget id='HTML1' locked='false' title='' type='HTML'/>

<b:widget id='Header1' locked='false' title='Plantilla En Forma (cabecera)' type='Header'/>

</b:section>

</div>



<b:section class='main' id='main' showaddelement='no'>

<b:widget id='Blog1' locked='true' title='Entradas del blog' type='Blog'/>

</b:section>

</div>



<div id='sidebar-wrapper'>

<b:section class='sidebar' id='sidebar' preferred='yes'>

<b:widget id='BlogArchive1' locked='false' title='Archivo del blog' type='BlogArchive'/>

<b:widget id='NewsBar1' locked='false' title='Deportes' type='NewsBar'/>

</b:section>

</div>



<!-- spacer for skins that want sidebar and main to be the same height-->

<div class='clear'>&#160;</div>



</div> <!-- end content-wrapper -->



<div id='footer-wrapper'>





<b:section class='footer' id='footer'/>

<div class='credit'>

Diseñada por <a href='http://cabalasvirtuales.blogspot.com/'>Yolanda</a> para <a href='http://plantillasytemplatesbloggercaseras.blogspot.com/'>Plantillas y Templates</a>

</div>

</div>



</div></div> <!-- end outer-wrapper -->

</body>

</html>

Menu

<div id="navcontainer">
<ul id="navlist">
<li id="active"><a id="current" href="URL">Item one</a></li>
<li><a href="URL">Item two</a></li>
<li><a href="URL">Item three</a></li>
<li><a href="URL">Item four</a></li>
<li><a href="URL">Item five</a></li>
</ul>
</div>