25

Plantilla Scribe (añadir nueva sidebar)


Recuerda
que aunque yo pruebe los "trucos"
Antes de hacer ningún cambio
GUARDA SIEMPRE TU PLANTILLA
Nunca es seguro
que todo salga bien...

Vamos a modificar la plantilla Scribe para añadirle una sidebar, las medidas que usaremos serán estas: ancho del blog: 950px, de las entradas: 480px y de las dos sidebar: 170px y 180px;

1- Vamos a plantilla - html y buscamos #outer-wrapper { , hemos de cambiar el valor de width: a 950

Seguimos hacia abajo de la plantilla y veremos #main-top { , hemos de cambiar el valor de width: a 950

A continuación veremos #main-bot {, aquí también cambiamos el valor de width: a 950

Un poco después está #wrap2 {, de nuevo cambiamos el valor de width: a 950

Más hacia abajo buscamos #main { y cambiamos el valor de width: a 480
Añadimos estas dos líneas, sustituyendo la de margin:
margin-left: 10px;
margin-right: 10px;

Debajo justo está #sidebar { cambiamos el valor de width: a 180
Copiamos todo lo que está en #sidebar{ y lo pegamos justo debajo, pero cambiando el nombre por newsidebar, el float de left a right y el width a 170. Quedaría así:
#newsidebar {
width:170px;
float:right;
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 */
}

2- Ahora en el html de nuestra plantilla buscamos esto:<div id='sidebar-wrapper'> y justo encima ponemos el código para nuestra nueva sidebar:
<div id='newsidebar-wrapper'>
<b:section class='sidebar' id='newsidebar' preferred='yes'>
</b:section>
</div>


3- Una vez modificado esto, tendremos el blog más ancho, pero se verá fatal porque las imágenes del fondo no se adaptan a nuestros cambios.
Vamos a cambiarlas por las nuevas imágenes:

En #main-top { cambiamos la url de la imagen por esta otra:
http://img127.imageshack.us/img127/5144/bgpapertoprc5.jpg

En #main-bot { cambiamos la url de la imagen por esta otra:
http://img112.imageshack.us/img112/5870/bgpaperbotjr9.jpg

En #wrap2 { cambiamos la url de la imagen por esta otra:
http://img127.imageshack.us/img127/3826/bgpapermidbh2.jpg

En #footer { y en #header { cambiamos la url de la imagenes por esta otra:
http://img519.imageshack.us/img519/820/dividerhb7.gif

Nota
Habréis visto que he añadido una línea a ambos lados de las entradas, para añadirlas a vuestro blog, consultáis las instrucciones en este post.
Para que el texto de las entradas no se pegue a las líneas de separación, le cambiaremos en #main{ el valor del padding, con 5px o 10px quedará bien:
#main {
padding: 8px 10px;



DESCARGAR PLANTILLA

Entradas Relacionadas:

25 comentarios:


Angélica Zambrano

Rosa te adoro, esa es la plantilla que estoy usando para crear mi nuevo blooooooog gracias jajaja ahora si se va a ver genial pues estoy agrandando sus márgenes y estaba en eso creándole una nueva sidebar, estoy en eso primero e investigando para empezar a publicar. Gracias infinitas pues la plantilla me parece muy linda. Esta es la dirección no tiene nada publicado aún, http://lasrutasdeangelica.blogspot.com/
Besitos e infinitas bendiciones. Angélica Zambrano. Angema412.

toXicboy

HOLA Rosa. Hoy no tengo nada personal que preguntar (bueno, todavía no me funciona la sidebar y blogger no me hace ni puto caso). He estado revisando tu blog y no he encontrado nada relacionado con como publicitar tu blog en internet, concretamente en google. No para atraer publicidad sino personas. Por ejemplo. Pongo en google los titulos de mis entradas y no aparecen. En cambio el nombre de mi blog si...

Estaria bien un post sobre este tema.

Cuando puedas, claro.

Besossss!!!

Andrew

Me parece que dominas mas sobre las plantillas, las deztrozas jejeje, es decir que las vas modificando y construyendo de otra manera, cosa que a mi me parece un poco tedioso, pero seria bueno que modifique todas las plantillas de blogger poniendole una sidebar mas para que puedan descargarla, asi uno no tenga que cometer errores al modificarla y simplemente tener ya la plantilla con 2 sidebar.
Ahora mi pregunta es ¿Cuándo haces estas modificaciones no se distorciona un poco la plantilla o sea donde añades los elementos, dentro se veria con dos sidebares o una arriba y la otra abajo, cosa que cuando ves el blog se ve normal?
Saludos.

Rosa

Pues si, andrew, me sería muy fácil prefabricar plantillas para descargar, pero ya ves, no se porque será, que no me lo piden...
Hay muchas páginas de plantillas para descarga pero hay bastantes personas a las que les gusta modificar el template que ya tienen, para personalizarlo a su gusto o por miedo a perder elementos, o lo que es más interesante para practicar y comprender mejor las partes del template.

En añadir elementos se ve con una a cada lado, en este caso, hay otros en que no, pero eso no implica que la modificación no sea correcta.

De hecho, en Hoctro´c Place, que se supone que es "alguien" en esto del blog, muchas de sus plantillas modificadas, cuando las descargas en elementos no se ven equilibradas, pero resultan.

¡Saludos!

Rosa

Toxicboy, mira aqui:

http://elescaparatederosa.blogspot.com/2007/03/aumenta-las-visitas-en-tu-blog.html

Además de eso y de tener paciencia, claro, a veces los buscadores te suben un día y el otro has "caído"
Yo te recomendaría registrarte en cuantos directorios de blog puedas, eso genera links a tu blog, y por tanto visitas y trafico.
Algunos de los mejores directorios están en mi sidebar, en esos botones tan monos, te recomiendo encarecidamente UHB, es uno de los mejores, según mi opinión.
Tecnorathi, es casi imprescindible...
En fin, en los que encuentres por ahí, yo me registro en todos los que encuentro de habla hispana.

Eva C.

Hola Rosa!

Me he topado por casualidad con tu página y estoy encantada. Es lo suficientemente completa como para hacer cosas muy chulas con los blogs... y ¡lo suficientemente bien explicada como para que funcionen! He hecho reformas en mi plantilla Scribe siguiendo tus indicaciones y estoy encantada.
Besitos y gracias.

P.D. Si alquien quiere ver el resultado:
http://www.evalparaiso.blogspot.com

PerSe

quiero ponerle una tercer columna a mi blog (www.perse79.blogspot.com) pero mi plantilla no dice ni tiene esas cosas que dijiste vos.... maldicion.. help!!

Rosa

Perse, porque tu plantilla no es Rounders, a decir verdad ni siquiera es de Blogger, es una plantilla de Wordpress modificada para Blogger.

En cuanto pueda te lo miro...

PerSe

uh que nabo, bueno ok no hya problema.... tus consejitos siempre son bienvenidos :)

luna

Hola Rosa
eres como mi manual de Internet, me facilitas todo lo que yo quiero hacer,ahora no se como hacer para poner una página principal y que aparezcan nada más los títulos de cada contenido de mi blog, ayúdame ya me duele la cabeza te quiero...Luna
mi blog es http://isluna12.blogspot.com/

juan benjamin

Solo puedo decir cosas positivas, me parece un blog muy interesante e ilustrativo que suelo visitar de vez en cuando. Cuidate que no te tenemos repetida.

Rosa

Juan Benjamin, fíjate que casualidad...además de ser asturiano te apellidas como mi madre solo que al revés, mi madre es "Varela Gutierrez". Mi segundo apellido, por tanto, es Varela y, por cierto, tengo un hermano que vive en Oviedo "Torre Varela" tiene una empresa de fontanería, je,je, igual has visto por allí alguna de sus furgonetas ;-)

chelo

Hola Rosa
felcidades por tan excelente espacio.

Rosa es tratado de poner nuevas plantillas a blog de prueba que tengo para ver como funcionan

ya que tendo diasss buscando una plantilla de tres columna que funcione y no lo he logrado.

Espero me ayude

Rosa

Chelo...¿Y qué problema es el que te surge a la hora de hacerlo?

Alex

Y si quisiera que la nueva barra estuviera justo debajo de la anterior? Es para separar secciones, por ejemplo. En todos los tutoriales que he visto te dicen como ponerla al otro lado del blog, o justo al lado de la barra original, pero no debajo, que es lo que yo busco. Cada vez que toqueteo el HTML pongo la nueva barra en un sitio diferente, pero nunca donde yo quiero xD. Encima la nueva barra aparece sin la imagen que sí tiene la anterior (y eso que el código está copiado de uno a otro), pero eso ya investigaré por mi cuenta.

Rosa

Alex, si estás hablando de la plantilla Scribe, lo que has de hacer es copiar el código css de la sidebar y copiarlo debajo, llamandolo newsidebar, por ejemplo, sin hacerle ningún cambio al código.

Después, en el html, encima de:
<div id='footer-wrapper'>

Pegas el código html para la nueva:
<div id='newsidebar-wrapper'>
<b:section class='sidebar' id='newsidebar' preferred='yes'>

</b:section>
</div>

Porla imagen de fondo no hay que preocuparse (en este caso) ya que la sidebar no la tiene, es transparente, así que se vará como la otra.

Regalada es cara

Primero agradecerte el que compartas estas cosas con nosotros
Segundo comentarte un problemita que me surgió al intentar modificar el html para que aparezca la tercera columna: copié y pegué, modifiqué según tus indicaciones y el resultado fue ensanchar la página, no me aparecen las 3 columnas
Tendrás idea de qué estoy haciendo mal?
Te agradezco de antemano cualquier ayuda que me puedas brindar.
Saludos

Ah por si querés ver de lo que hablo, el blog es www.mardelalma.blogspot.com

Rosa

Regalada es cara , si lo has hecho tal cual tendría que salir...¿estás segura que no sido así?
¿Has comprobado el resultado en la parte de Diseño?
Porque en el blog no se verá el contenido de la nueva columna hasta que no pongas algo en ella.

Regalada es cara

[IMG]http://i37.tinypic.com/27xe0ia.jpg[/IMG]
sip, en diseño continúan las dos columnas, mirá.
Voy a intentar rehacer mañana todos los pasos y después te cuento, gracias Rosa!

Regalada es cara

sigo peleando rosa, conseguí las tres columnas
solo que ahora me pone la entrada abajo de todo a la derecha
debo haber borrado algo, vuelvo a hacerlo a ver si sale. gracias.

Rosa

Regalada, déjalo como está y en esta parte:
#main {
width:480px;
float:right;
padding:8px 10px;
margin-left: 10px;
margin-right: 10px;
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 */
}
Cambia float:right; por float:left;
A ver si sin necesidad de más complicaciones queda bien.

Domingo Tassara S.

¿Cómo puedo aumentar la cantidad de Recent Post que hoy es de 10 por más?.

www.dotasa.blogspot.com

Rosa

Domingo, pues como no me des más datos...¿qué sistema usas para los post recientes?

Glenlinab

Hola Rosa..

bueno soy super nueva en en blogger y no termino de encontrar la solución a mi problema, en la plantilla, queria pedirte que me ayudaras en lo siguiente.
quiero liberar mi blogge de columnas
que sea de esta forma:
http://la-aurora-de-mi-alma.blogspot.com/

el mio es éste:
http://glendysbarreto.blogspot.com/
y no me gusta nada, quiero soltarlo.liberarlo, es que las columnas tambien me ahogan a mí..

ayudame porfa,..si?
éste es mi correo: glenlinab@gmail.com

Rosa

Glenlinab , puedes ver como hacerlo aquí:

http://elescaparatederosa.blogspot.com/2007/11/ensanchar-la-plantilla-mnima.html

Publicar un comentario en la entrada

Si vas a dejar una consulta, procura tener habilitado tu perfil en Blogger o deja la url del blog a revisar (no enlace).

Los comentarios están siendo moderados.

:) :(( :( :P :D :$ ;) :I :X :O |O :S