AjMrDeSiGn

Templates Blogger, exquisitez para usuarios curiosos.

Crear template blogger (Parte 1)

2 oct 2012

Como son muchos los que le gusta crear template para blogger, me llegan bastantes comenatrios y preguntándome que explique como hacerlo, intentaremos explicarlo de la mejor forma que no sea posible, explicare mediante ejemplos, como crear un template blogger, lo mas importante es saber css y html, tenéis que buscar información en internet que encontrareis bastante y sera mas fácil aprender.


Lo primero que haremos sera crear el contenedor principal, esta sera la parte 1, en una entrada anterior mostré un ejemplo de como hacerlo, esta es la forma: empezaremos con lo principal, body, color de los enlaces y contenedor.

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[

/*
Autor: AjMrDesiGn
url: http://ajmrdesign.com
fwcha: 02/10/2012
Template desde cero
---------------------------------
*/

/* CSS
---------------------------------
*/

body {
background: #fff;
margin: 0;
padding: 0;
color: #333;
font-family: Arial,Helvetica,sans-serif;
font-size:13px;
text-align: center;
}
a:link, a:visited {
color:#000;
}
a:hover {
color:#3a8eff;
}


/* Contenedor
---------------------------------
*/

#contenedor-ajmrdesign {
width: 980px;
margin:0 auto;
padding:0;
text-align:center;
}

]]></b:skin>
</head>

<body>
<b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'>
<b:widget id='Navbar1' locked='true' title='Barra de navegación' type='Navbar'/>
</b:section>

<div id='contenedor-ajmrdesign'>

<b:section class='header' id='header' preferred='yes'/>

<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Entradas del blog' type='Blog'/>
</b:section>

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

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

</div>

<b:include data='blog' name='google-analytics'/>
</body>
</html>

Son los primeros pasos que hay que hacer, en la parte 2, explicare como hacer el header, tendrá varias partes, esta tutoría o mini, como lo prefieran llamar, haber si de esta forma podéis aprender o intentar, crear template para blogger, son ejemplos para que tengan una idea.

No hay comentarios:

Normas comentarios › Leer antes de comentar...

« »

Suscríbete a nuestro feed...