La plantilla que vamos a modificar es la Rounders, que podemos identificar en el encabezamiento, así: -----------------------------------------------
Blogger Template Style
Name: Rounders
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 segmentos de códigos y hacemos las modificaciones indicadas con los resaltados en rojo: - Para ensanchar el blog:
#outer-wrapper {
width:940px;
margin:0 auto;
text-align:$startSide;
font: $bodyFont;
} |
- Para ensanchar el cuerpo de las entradas:
#main-wrap1 {
width:635px;
float:$startSide;
background:$mainBgColor url("http://www1.blogblog.com/rounders/corners_main_bot.gif") no-repeat $startSide bottom;
margin:15px 0 0;
padding:0 0 10px;
color:$mainTextColor;
font-size:97%;
line-height:1.5em;
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 */
}
#main-wrap2 {
float:$startSide;
width:100%;
background:url("http://www1.blogblog.com/rounders/corners_main_top.gif") no-repeat $startSide top;
padding:10px 0 0;
}
#main {
background:url("http://www.blogblog.com/rounders/rails_main.gif") repeat-y $startSide;
padding:0;
width:635px;
} |
- Para ensanchar la sidebar:
#sidebar-wrap {
width:290px;
float:$endSide;
margin:15px 0 0;
font-size:97%;
line-height:1.5em;
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 */
} |
- Para ensanchar el widget pie de post:
.main .widget {
margin-top: 4px;
width: 618px;
padding: 0 13px;
} |
- Para ensanchar el marco exterior de las entradas:
.main .Blog {
margin: 0;
padding: 0;
width: 634px;
} |
- Para ensanchar la envoltura exterior del blog:
body#layout #outer-wrapper {
width: 930px;
} |
- Debido a que los blogs diseñados con las plantillas Rounders tienen las esquias redondeadas, y éstas no se desplazan, la apariencia del blog aparecerá muy extraña. Para evitar esto eliminamos todas las URLs de las imágenes que redondean las esquinas para que éstas adquieran la forma cuadrada, que también es un buen diseño. Dichas URLs las localizarremos fácilmente porque todas tienen la palabra Corners. Son las siguientes:
url("http://www1.blogblog.com/rounders/corners_main_bot.gif") |
url("http://www1.blogblog.com/rounders/corners_main_top.gif") |
url("http://www2.blogblog.com/rounders/corners_cap_top.gif") |
url("http://www.blogblog.com/rounders/corners_cap_bot.gif") |
url("http://www.blogblog.com/rounders/corners_prof_bot.gif") |
url("http://www2.blogblog.com/rounders/corners_prof_top.gif") |
url("http://www.blogblog.com/rounders/corners_side_top.gif") |
url("http://www1.blogblog.com/rounders/corners_side_bot.gif") |
url("http://www2.blogblog.com/rounders/corners_cap_top.gif") |
url("http://www.blogblog.com/rounders/corners_cap_bot.gif") |
- Por último eliminamos esta URL, que corresponde a la imagen del marco que une las esquinas redondeadas del cuerpo de las entradas (la parte resaltada):
#main {
background:url("http://www.blogblog.com/rounders/rails_main.gif") repeat-y $startSide;
padding:0;
width:485px; |
- Vista previa y, si todo está bien, guardamos plantilla.
|
1 comentarios :
te agradeceria mucho si me envias el archivo de la plantilla rounders, aunque paresca increible, pero no lo encuentro por ningun lado.
mi e-mail es:
erickesme@hotmail.com
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.