bueno como ia es tiempo:P vo a decirles como hacer templates plantillas fondos etc.. como quieran llamarles..

para nireblog.. y para casi todos los sistemas de blogs..

:X algo muy explicativo y muy practico nada dificil jeje

espero q les guste..

primero..:

1)Tengan en mente lo que quieran hacer..( ejemplo.. mmm mm tengo en mente.. un diseño peligroso jeje....)

2)Deben tener un Patern *( q es esto.. bueno un patern es un mosaico q se repite muchas veces. y nosotros los vamos a utilizar de fondo..)

como se hace un patern.. no es muy dificil.. pero yo les voy a dejar una herramienta web que es sencilla de utilizar

es http://www.bgpatterns.com/

aqui tu puedes crear tu propio patern y bajarlo a tu PC

3) guardala en tu PC...

*BIEN:: AHORA YA TENEMOS NUESTRA IMAGEN DE FONDO:: OJO.. SI NO QUIEREN USAR UN PATTERN Y PONER UNA IMAGEN:: YA SEA FOTO ETC::: ABAJO LES MOSTRAMOS COMO PONER UNA IMAGEN:::

4)Ahora necesitamos hacer una cabezera para el blog..para hacer esto les dejo aki una cabezera en blanco. para que ustedes la modifiquen..

para descargar la imagen en blanco anterior solo hagan click-derecho y guardar como...

5) Modifica tu plantilla..

este es un paso talvez el mas complicado pero con ganas lo lograras..

puedes modificarlo en cualquier programa ya sea paint etc... solo deja volar tu imaginacion...

ejemplo.. mi plantilla modificada..

algunos tips para hacer tu cabezera...

*manten una imagen central ( q llame mas la atencion)

*usa colores q combinen

*OJO.. usa letras solo si quieres q no salga el titulo de tu blog

ya veremos mas adelante.. si quieres q el titulo de tu blog salga..

entonces deja un espacio en la cabezera..

1 cabezera sin titulo.. (titulo en la imagen)

2 cabezera con titulo (tiene el espacio para el titulo de tu blog)

6) GUARDAMOS NUESTRA CABEZERA TAMBIEN EN LA PC

7)Subimos las imagenes al internet

Usamos..

http://imageshack.us/

es un buen alojador de imagenes si usan otros no hay inconveniente..

7.1 seleccionamos imagen

7.2 click en "HOST IT"

8)Una vez q nuestras imagenes ya esten en internet..

debemos copiar los links..

OJO:: COPIA LOS LINKS EN UN ARCHIVO DE WORD DONDE LOS PUEDAS GUARDAR::

copiamos el link que dice DIRECT LINK..

q esta en la parte de abajo

9) AHORA SI.. YA tenemos todo lo que necesitamos solo debemos unirle en el código..

10)Pues seguimos el tutorial anterior.

Click aka..:

http://sortilegios.nireblog.com/post/2008/08/08/como-usar-los-nuevos-templates

11) pues bien.. sigue el tutorial

hasta donde dice "borramos código antiguo"

12) AHora bien.. vamos con lo mas interesante el código..

Bueno el código principal es este..

********

* {
margin:0;
padding:0;
}

body {
background-color:#00B4E5;
color:#FF9900;
font-family:'Trebuchet MS','Lucida Grande', Arial, sans-serif; /diseñado por junior www.sortilegios.nireblog.com no lo modifiques gracias/
font-size:small;
font-weight:400;
text-align:left;
margin:0;
padding:0;
}

body,html {
background-color:#000000;

background-image: url(http://img381.imageshack.us/img381/930/37084330on3.jpg);
background-position: top left;
background-repeat: repeat;
color:#000000;
margin:0;
padding:0;
}

#wrap {
overflow:hidden;

background-color:#ffffff;
position:relative;
width:900px;
margin:0 auto;
}

#header {
background-image: url(http://img127.imageshack.us/img127/583/fondo2up8.jpg);
background-position: top center;
background-repeat: no-repeat;
height: 171px;
}

#logodos {
width:900px;
margin:0 auto;
text-align:center;
}

#blogname {
padding-top:10px;
}

h1#blogname a {
color:#000000;
font-size:36px;

font-weight:400;
}

div#description {
color:#000000;
font-size:1em;
font-style:italic;
font-weight:400;
height:24px;
}

#content {
color:#000000;
display:inline;
float:left;
font-size:100%;
line-height:1.6em;
text-align:left;
width:650px;
margin:15px 0 0 20px;
padding:5px 0 15px;
}

#sidebar {
display:inline;

float:right;
line-height:1.5em;
padding-top:5px;
width:200px;
margin:5px 20px 20px 0;
}

h2 {
font-size:150%;
}

h4 {
font-size:130%;
}

ol#commentlist {
list-style:none;
margin:15px 0 0;
padding:0;
}

a img {
border:0;
}

h3.entrytitle,h3 {
color:#6BA1A5;

display:block;
font-size:170%;
font-weight:400;
line-height:100%;
margin:0;
}

h3.entrytitle a,h3.entrytitle a:visited,h3 a {
color:#7C127B;
font-weight:400;
text-decoration:none;
text-transform:capitalize;
}

.entry {
margin-bottom:25px;

margin-top:0;
padding-bottom:25px;
padding-left:2px;
}

.entrybody img {
border:1px solid #e5e5e5;
}

.entrybody {
background-color: #ffffff;
margin:0;
padding:5px 5px 10px 10px;
}

.entrybody p {
margin-bottom:15px;
text-align:left;
}

.entrymeta {
color:#16659D;
font-weight:400;
margin-bottom:5px;
margin-top:3px;
}

.entrybody ul,.entrybody ol {
margin-bottom:10px;
margin-left:30px;
margin-top:10px;
}

.entrybody li {
padding-bottom:2px;
padding-top:2px;
}

#sidebar h2 {
font-size:18px;
font-weight:400;
letter-spacing:0;
line-height:12px;
text-transform:capitalize;
margin:0;
padding:0;
}

#sidebar p {
margin-bottom:10px;
margin-top:10px;
}

#sidebar ul {
list-style:none;

margin:5px 0;
padding:10px 0;
}

#sidebar ul li a {
text-decoration:none !important;
margin:0;
}

#searchdiv {
font-weight:700;
padding:0;
}

.navigation {
clear:both;
height:30px;
margin:0 auto;
padding-left: 20px;
}

.navigation a:link,.navigation a:visited {
background:#ffffff;
color:#16659D;
height:24px;
margin-right:2px;
padding-left:12px;
padding-right:12px;
text-decoration:none;
}

.navigation a:link,.navigation a:visited {
cursor:pointer;
display:block;
float:left;
}

.navigation li {
line-height:23px;
float:left;
list-style:none;
margin:0;
}

.navigation a:hover {
background:#F5CAFB;
color:#8C1919;
height:24px;
padding-left:12px;
text-decoration:none;
}

.current_page_item a:link,.current_page_item a:visited {
background:#F5CAFB;
color:#746F6F;
height:27px;
line-height:24px;
margin-right:2px;
padding-left:15px;
text-decoration:none;
}

.navigation ul {
list-style:none;
margin:0;
padding:0;
}

blockquote {
border-left:2px solid #ffffff;
font-style:italic;
padding-left:8px;
margin:0 25px;
}

h1,h2,h3,h4,#comments {
font-weight:400;
}

h3,#commentblock h2 {
font-size:140%;
}

.entrybody a:link,.entrybody a:visited {
font-weight:400;
text-decoration:underline;
}

.entrybody a:active,.entrybody a:hover {
font-weight:400;
text-decoration:none;
}

a,a:visited,a:hover {
color:#1286D8;
text-decoration:none;
}

******

13) ahora si les explico lo mas intenso jaja... el famoso código...!!!!!

* {
margin:0; esto ni lo toquen.. no es nada importante...
padding:0;
}

body {
background-color:#00B4E5;
color:#FF9900;aqui cambias el color de fondo aunq no  sale jeje xq hay imagen de fondo.. :)
font-family:'Trebuchet MS','Lucida Grande', Arial, sans-serif; estas son los tipos de letras q van en tu blog.. nada interesante la verdad.. dejalo asi :P

font-size:small;

font-weight:400;
text-align:left;

margin:0;
padding:0;
}

body,html {
background-color:#000000;

background-image: url(http://img381.imageshack.us/img381/930/37084330on3.jpg);cambia esto por. el link de tu imagen de fondo . el q copiamos en un archiivo de word.. el otro va mas abajo
background-position: top left; posicion (top left top center top right)

background-repeat: repeat; si quieres q la imagen se repita

color:#000000;
margin:0;
padding:0;
}

#wrap {
overflow:hidden;

background-color:#ffffff;
position:relative;
width:900px;
margin:0 auto;
}

#header {
background-image: url(http://img127.imageshack.us/img127/583/fondo2up8.jpg);pon aqui el link de la cabezera de nuestro blog
background-position: top center;
background-repeat: no-repeat;
height: 171px;
}

#logodos {
width:900px;
margin:0 auto;
text-align:center;
}

#blogname {
padding-top:10px;
}

h1#blogname a {
color:#000000;
font-size:36px;

font-weight:400;
}

div#description {
color:#000000;
font-size:1em;
font-style:italic;
font-weight:400;
height:24px;
}

#content {
color:#000000;
display:inline;
float:left;
font-size:100%;
line-height:1.6em;
text-align:left;
width:650px;
margin:15px 0 0 20px;
padding:5px 0 15px;
}

#sidebar {
display:inline;

float:right;
line-height:1.5em;
padding-top:5px;
width:200px;
margin:5px 20px 20px 0;
}

h2 {
font-size:150%;
}

h4 {
font-size:130%;
}

ol#commentlist {
list-style:none;
margin:15px 0 0;
padding:0;
}

a img {
border:0;
}

h3.entrytitle,h3 {
color:#6BA1A5;

display:block;
font-size:170%;
font-weight:400;
line-height:100%;
margin:0;
}

h3.entrytitle a,h3.entrytitle a:visited,h3 a {
color:#7C127B;
font-weight:400;
text-decoration:none;
text-transform:capitalize;
}

.entry {
margin-bottom:25px;

margin-top:0;
padding-bottom:25px;
padding-left:2px;
}

.entrybody img {
border:1px solid #e5e5e5;
}

.entrybody {
background-color: #ffffff;
margin:0;
padding:5px 5px 10px 10px;
}

.entrybody p {
margin-bottom:15px;
text-align:left;
}

.entrymeta {
color:#16659D;
font-weight:400;
margin-bottom:5px;
margin-top:3px;
}

.entrybody ul,.entrybody ol {
margin-bottom:10px;
margin-left:30px;
margin-top:10px;
}

.entrybody li {
padding-bottom:2px;
padding-top:2px;
}

#sidebar h2 {
font-size:18px;
font-weight:400;
letter-spacing:0;
line-height:12px;
text-transform:capitalize;
margin:0;
padding:0;
}

#sidebar p {
margin-bottom:10px;
margin-top:10px;
}

#sidebar ul {
list-style:none;

margin:5px 0;
padding:10px 0;
}

#sidebar ul li a {
text-decoration:none !important;
margin:0;
}

#searchdiv {
font-weight:700;
padding:0;
}

.navigation {
clear:both;
height:30px;
margin:0 auto;
padding-left: 20px;
}

.navigation a:link,.navigation a:visited {
background:#ffffff;
color:#16659D;
height:24px;
margin-right:2px;
padding-left:12px;
padding-right:12px;
text-decoration:none;
}

.navigation a:link,.navigation a:visited {
cursor:pointer;
display:block;
float:left;
}

.navigation li {
line-height:23px;
float:left;
list-style:none;
margin:0;
}

.navigation a:hover {
background:#F5CAFB;
color:#8C1919;
height:24px;
padding-left:12px;
text-decoration:none;
}

.current_page_item a:link,.current_page_item a:visited {
background:#F5CAFB;
color:#746F6F;
height:27px;
line-height:24px;
margin-right:2px;
padding-left:15px;
text-decoration:none;
}

.navigation ul {
list-style:none;
margin:0;
padding:0;
}

blockquote {
border-left:2px solid #ffffff;
font-style:italic;
padding-left:8px;
margin:0 25px;
}

h1,h2,h3,h4,#comments {
font-weight:400;
}

h3,#commentblock h2 {
font-size:140%;
}

.entrybody a:link,.entrybody a:visited {
font-weight:400;
text-decoration:underline;
}

.entrybody a:active,.entrybody a:hover {
font-weight:400;
text-decoration:none;
}

a,a:visited,a:hover {
color:#1286D8;
text-decoration:none;
}