La plantilla que vamos a modificar es la Scribe, que podemos identificar en el encabezamiento, así: -----------------------------------------------------
Blogger Template Style Sheet
Name: Scribe
Date: 27 Feb 2004
Updated by: Blogger Team
------------------------------------------------------ */ |
Vamos a Edición de HTML
Página principal ► Diseño ► Plantilla ► Edición de HTML |
Sin expandir plantilla de artilugios localizamos los siguientes códigos, y modificamos las cifras resaltadas en rojo:
1.- Para ensanchar todo el blog, 700 por 940:
#outer-wrapper {
background-color:#473624;
border-$startSide:1px solid #332A24;
border-$endSide:1px solid #332A24;
width:700px;
margin:0px auto;
padding:8px;
text-align:center;
font: $bodyFont;
}
#main-top {
width:700px;
height:49px;
background:#FFF3DB url("http://www2.blogblog.com/scribe/bg_paper_top.jpg")
no-repeat top $startSide;
margin:0px;
padding:0px;
display:block;
}
#main-bot {
width:700px;
height:81px;
background:#FFF3DB url("http://www.blogblog.com/scribe/bg_paper_bot.jpg")
no-repeat top $startSide;
margin:0;
padding:0;
display:block;
}
#wrap2 {
width:700px;
background:#FFF3DB url("http://www1.blogblog.com/scribe/bg_paper_mid.jpg") repeat-y;
margin-top: -14px;
margin-$endSide: 0px;
margin-bottom: 0px;
margin-$startSide: 0px;
text-align:$startSide;
display:block;
} |
2.- Para ensanchar el cuerpo de las entradas, 430 por 600:
#main {
width:430px;
float:$endSide;
padding:8px 0;
margin:0;
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 */
} |
3.- Para ensanchar la barra lateral (sidebar), 150 por 220:
#sidebar {
width:150px;
float:$startSide;
padding:8px 0;
margin:0;
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 */
} |
4.- Debemos cambiar las imágenes que le dan un efecto sombreado al fondo del blog y al marco del mismo, como también las que corresponden a las líneas que se encuentran encima y debajo de las entradas. Si no hacemos esto, como las imágenes no se ensanchan, el blog se nos va a ver muy mal. Para lograr esto cambiamos las URLs de las imágenes originales por las URLs de las mismas imágenes, pero adaptadas al ancho que le hemos dado al blog. Éstos son los cambios:
En:
#main-top {
width:940px;
height:49px;
background:#FFF3DB url("http://www2.blogblog.com/scribe/bg_paper_top.jpg")
no-repeat top $startSide;
margin:0px;
padding:0px;
display:block;
} |
...cambiamos la URL (resaltada en rojo), por ésta:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFq9xAPe6npMYKQ7m9EJmD-A4qdJfzwyK_TYLSjzzGxR_t-Z1r0B39W_QNjhhOufMjPDppPQVGJITrYpRK-lq2K2wLM0v5adz4APIsg8r6ljzgqyqJQtiik6J-bkVBv-d00uHoHbGzVqs/
s1600/imagenScribe1.jpg |
En:
#main-bot {
width:940px;
height:81px;
background:#FFF3DB url("http://www.blogblog.com/scribe/bg_paper_bot.jpg")
no-repeat top $startSide;
margin:0;
padding:0;
display:block;
} |
...cambiamos la URL (resaltada en rojo), por ésta:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4BhMU98CWxDjdCxQ7SGn8_DgA_yZEr7texmXkTUzPZR2ynPx2Dn5omvvS3Btd6KknPD5QJ8eleNQfd-6_c0qKKSGu5RUmolecsKFPZsl26fGm5gM6k40gofjtlXzlR44-aWWzVchK8ow/
s1600/imagenScribe2.jpg |
En:
#wrap2 {
width:940px;
background:#FFF3DB url("http://www1.blogblog.com/scribe/bg_paper_mid.jpg")
repeat-y;
margin-top: -14px;
margin-$endSide: 0px;
margin-bottom: 0px;
margin-$startSide: 0px;
text-align:$startSide;
display:block;
} |
...cambiamos la URL (resaltada en rojo), por ésta:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPxUfz4GLuWe_AFD-4dPX_-R6gDubgf_cc2iKVlIpgRfyyHEX_QF0LBuAcgqwQf_qf6ICl-nqtyp-85cTr-zo3Sm0LbzWJN_J-eKTqDZWdKSVREpccEOK241ymqeH1WF76XysfYcwgQYw/
s1600/imagenScribe3.jpg |
En:
#footer {
clear:both;
background:url("http://www.blogblog.com/scribe/divider.gif")
no-repeat top $startSide;
padding-top:10px;
_padding-top:6px; /* IE Windows target */
} |
...y en:
#header {
background:url("http://www.blogblog.com/scribe/divider.gif")
no-repeat bottom $startSide;
} |
...Cambiamos la URL (resaltada en rojo), por ésta:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHyMIkSw3P-pXHDNKPBdG5XFpexi3lttXNoCmlSqHPE8K61VbfqxLeWdjimdrQ2BiJ5pnVpztPYKuQZDBCBo5H_vK8bJrsaaTzUi3bSHl_QHYvFpalwD7h0Ow6vZ0tm9WEbSUFHxEMTDU/s1600/imagenScribe4.gif |
5.- Vista previa y Guardar plantilla
|
0 comentarios :
Este blog ya cumplió su ciclo, por esta razón, aunque sigue a disposición de los usuarios, no se harán más publicaciones ni se atenderán más consultas. La respuesta a su inquietud puede estar entre los comentarios hechos hasta aquí.
El autor.