Monday, May 9, 2011

Dividir el crosscol del blog

El crosscol es esa ?rea debajo de la cabecera en la que la mayor?a de las veces a?adimos un men? horizontal, aunque muchas otras veces queremos que nos rinda m?s ese espacio para a?adir m?s gadgets y la mejor forma de hacerlo es dividir el crosscol del blog para que pueden entrar m?s gadgets en una fila, es decir, que si originalmente se ve as?:


Con las respectivas divisiones pueda verse as?:


Empecemos, lo primero es entrar en Dise?o | Elementos de la p?gina y cerciorarse que no haya ning?n gadget en esa ?rea, si tienes alguno lo mejor es moverlo a la sidebar u otro lugar moment?neamente, ya despu�s podr?s ponerlo de nuevo ah?, s?lo tienes que arrastrarlo y soltarlo en el lugar donde lo quieras mover.

Ya que est? libre esa ?rea entonces vamos a Dise?o | Edici?n de HTML y SIN expandir los artilugios busca este c?digo:
<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol'/>
</div>

O si usas una plantilla del Dise?ador de Plantillas de Blogger entonces busca este c?digo:
<div class='region-inner tabs-inner'>
<b:section class='tabs' id='crosscol' maxwidgets='1' showaddelement='yes' />
<b:section class='tabs' id='crosscol-overflow' showaddelement='no'/>
</div>

Cualquiera de esos c?digos que tengas elim?nalo y en su lugar pon este:
<div class='region-inner tabs-inner' id='crosscol-wrapper' style='text-align:center'>

<div id='crosscol0' style='text-align: center; padding: 5px;'>
<b:section class='tabs' id='crosscol-superior' preferred='yes'/>
</div>

<div id='crosscol1' style='width: 33%; float: left; margin:0; padding: 5px;'>
<b:section class='tabs' id='cross1' preferred='yes' style='float:left;'/>
</div>

<div id='crosscol2' style='width: 33%; float: left; margin:0; padding: 5px;'>
<b:section class='tabs' id='cross2' preferred='yes' style='float:left;'/>
</div>

<div id='crosscol3' style='width: 33%; float: right; margin:0; padding: 5px;'>
<b:section class='tabs' id='cross3' preferred='yes' style='float:right;'/>
</div>

<div style='clear:both;'/>
</div>
Guarda los cambios y listo, puedes ingresar a Elementos de la P?gina y ya podr?s ver tu crosscol dividido en tres partes.
Si quisieras que s?lo estuviera dividido en dos y no en tres partes entonces elimina el c?digo en color gris, y cambia los 33% que est?n a los lados por 49%
F?cil y r?pido ?no?

No comments:

Post a Comment