Empezando por el tejado
Como primera lección, un tema que les preocupa a muchos de nuestros blogovidentes: la imagen dela cabecera. Sustituir esos incómodos textos enmarcados por tan rígidas líneas es tan sencillo como esto:
- Cree su cabecera con su aplicación favorita o pídasela a un amigo diseñador. Si se niega, insista.
- La medida que viene por defecto en la plantilla original es de 660px de ancho. Procuraremos mantener el tamaño, ya que se pretende embellecer la estructura, no destrozarla. En este ejercicio trabajaremos con una cabecera de 660px de ancho por 264px de alto.
- Entre en ImageShack. Seleccione la imagen de su disco duro y súbala. Una vez hecho esto, seleccione el enlace directo a la imagen (Direct link to image) y cópielo.
- Acceda a su panel de control.
- Acceda a la pestaña Plantilla.
- Busque en el código, justo cuando acaba el
- Una vez localizado, elimine la línea marcada en negrita en el punto anterior y sustituya
- Ahora, busque al principio del código, en la hoja de estilo, este texto:
- Transforme el margen y el borde, con este resultado:
- Busque a continuación, un poco más abajo:
- Transfórmelo en esto otro:
- Compruebe con el botónVista previa que los cambios han funcionado. Si está satisfecho, pulse Guardar cambios de plantilla.
Et voilà! Su blog acaba de subir de categoría estética. Disfrute de su nuevo look con amigos y familiares, sorprenda a sus vecinos con un toque de elegancia y no se pierda la próxima lección de Puño, su amigo y esteta.
Añado: en caso de tener, de manera irreversible, la nueva versión de Blogger, aquí dispone usted de una manera de modificar su cabecera. Recordamos a nuestros lectores que es preferible mantener la vieja y leal plantilla HTMLera.
- Cree su cabecera con su aplicación favorita o pídasela a un amigo diseñador. Si se niega, insista.
- La medida que viene por defecto en la plantilla original es de 660px de ancho. Procuraremos mantener el tamaño, ya que se pretende embellecer la estructura, no destrozarla. En este ejercicio trabajaremos con una cabecera de 660px de ancho por 264px de alto.
- Entre en ImageShack. Seleccione la imagen de su disco duro y súbala. Una vez hecho esto, seleccione el enlace directo a la imagen (Direct link to image) y cópielo.
- Acceda a su panel de control.
- Acceda a la pestaña Plantilla.
- Busque en el código, justo cuando acaba el
</head> y empieza el <body>, este párrafo:<div id="header">
<h1 id="blog-title">
<ItemPage><a href="<$BlogURL$>"></ItemPage>
<$BlogTitle$>
<ItemPage></a></ItemPage>
</h1>
<p id="description"><$BlogDescription$></p>
</div>
- Una vez localizado, elimine la línea marcada en negrita en el punto anterior y sustituya
<$BlogTitle$> por este otro código, corrigiendo el link donde se indica:<img border="0" src="aquí ha de pegar el enlace directo que ha copiado en ImageShack" width="660" height="264">- Ahora, busque al principio del código, en la hoja de estilo, este texto:
@media all
#header
width:660px;
margin:0 auto 10px;
border:1px solid #ccc;
}
}- Transforme el margen y el borde, con este resultado:
@media all {
#header {
width:660px;
margin:0 auto 0;
border:0px;
}
}- Busque a continuación, un poco más abajo:
#blog-title {
margin:5px 5px 0;
padding:20px 20px .25em;
border:1px solid #eee;
border-width:1px 1px 0;
font-size:200%;
line-height:1.2em;
font-weight:normal;
color:#666;
text-transform:uppercase;
letter-spacing:.2em;
}- Transfórmelo en esto otro:
#blog-title {
margin:0;
padding:0;
border:0px;
}- Compruebe con el botónVista previa que los cambios han funcionado. Si está satisfecho, pulse Guardar cambios de plantilla.
Et voilà! Su blog acaba de subir de categoría estética. Disfrute de su nuevo look con amigos y familiares, sorprenda a sus vecinos con un toque de elegancia y no se pierda la próxima lección de Puño, su amigo y esteta.
Añado: en caso de tener, de manera irreversible, la nueva versión de Blogger, aquí dispone usted de una manera de modificar su cabecera. Recordamos a nuestros lectores que es preferible mantener la vieja y leal plantilla HTMLera.
posted by Puño at 7:50 PM
40 comments
