Mostrando entradas con la etiqueta izquierda. Mostrar todas las entradas
Mostrando entradas con la etiqueta izquierda. Mostrar todas las entradas

lunes, 2 de julio de 2012

Insertar una tabla en la entrada de tu blog

Si quieres poner una tabla en una entrada sólo tienes que poner este código:

<table bgcolor="#f4e3bc" border="1" cellpadding="5" style="width: 100%;">
<tbody>
<tr><td>Texto o imagen</td><td>Texto o imagen</td></tr>
<tr><td>Texto o imagen</td><td>Texto o imagen</td></tr>
</tbody>
</table>

Puedes cambiarle el color del fondo cambiando en bgcolor=(aquí pones el código del color que quieres).
También puedes quitarle el borde cambiando en border= (el 1 por 0) o poner un borde más marcado cambiando a un número mayor.
Y si quieres añadir más filas vas repitiendo lo que aparece en negrita entre <tbody> y <tbody>. Por ejemplo:

<table bgcolor="#f4e3bc" border="1" cellpadding="5" style="width: 100%;">
<tbody>
<tr><td>Texto o imagen</td><td>Texto o imagen</td></tr>
<tr><td>Texto o imagen</td><td>Texto o imagen</td></tr>
<tr><td>Texto o imagen</td><td>Texto o imagen</td></tr>
<tr><td>Texto o imagen</td><td>Texto o imagen</td></tr>
</tbody>
</table>

Y si lo que quieres es que tenga más columnas, sólo tienes que añadir <td>Texto o imagen</td> entre </tr> y </tr>

Por ejemplo:

<table bgcolor="#f4e3bc" border="1" cellpadding="5" style="width: 100%;">
<tbody>
<tr><td>Texto o imagen</td><td>Texto o imagen</td><td>Texto o imagen</td></tr>
<tr><td>Texto o imagen</td><td>Texto o imagen</td><td>Texto o imagen</td></tr>
<tr><td>Texto o imagen</td><td>Texto o imagen</td><td>Texto o imagen</td></tr>
<tr><td>Texto o imagen</td><td>Texto o imagen</td><td>Texto o imagen</td></tr>
</tbody>
</table>

Además podrás centrar o alinear la imagen o el texto añadiendo los códigos que ya conocemos para ello:

<div align="center">Código que se quiere centrar</div>

<div align="left">Código que se quiere a la izquierda</div>

<div align="right">Código que se quiere a la derecha </div>

Si en lugar de que aparezca en una entrada, la quieres poner en alguna de las columnas laterales o inferiores, vete a Diseño-añadir gadget-Java Html y hazlo añadiendo el código tal y como lo haces como cualquier ptro gadget. La personalización la podrás hacer igualmente.

Puedes ver como me ha quedado a mí en la columna lateral la tabla de directorios.




Poner un botón para subir y bajar

Poner el boton de Subir y Bajar en tu blog te vendrá muy bien sobre todo cuando en la página principal hay muchas entradas o si hay alguna entrada con muchos comentarios.

Para añadirlo vamos a Diseño-añadir gadget-HTML / Javascript y ponemos el siguiente código:

<div id="navigation_up_down_79136"><noscript>Javascript is disable - <a href="http://www.webestools.com/">Webestools</a> - <a href="http://www.webestools.com/navigation-buttons-generator-scroll-top-bottom-shortcut-page-up-down-scroll-buttons-javascript.html">Navigation Buttons Generator html scroll up down</a></noscript><script type="text/javascript" src="http://services.webestools.com/navigation_up_down/1-79136-right.js"></script></div>

Así los botones aparecerán abajo a la derecha de tu blog, pero si quieres que aparezcan a la izquierda, pon este:

<div id="navigation_up_down_79136"><noscript>Javascript is disable - <a href="http://www.webestools.com/">Webestools</a> - <a href="http://www.webestools.com/navigation-buttons-generator-scroll-top-bottom-shortcut-page-up-down-scroll-buttons-javascript.html">Navigation Buttons Generator html scroll up down</a></noscript><script type="text/javascript" src="http://services.webestools.com/navigation_up_down/1-79136-right.js"></script></div>

Y listo, tus lectores se moverán más rápido por tu blog.

Centrar las pestañas de las páginas

Normalmente la barra con las pestañas de las páginas está alineada hacia la izquierda por defecto. Pero si prefieres tenerla centrada es muy fácil.
Vamos a Diseño-diseñador de plantillas-avanzado-añadir Css




Y ponemos lo siguiente en el cuadro blanco que sale a la derecha:

.PageList {text-align:center !important;}
.PageList li {display:inline !important; float:none !important;}
 
En caso de que ya tengas algún código anterior, por ejemplo para alinear una imagen en la cabecera, deja dos espacios entre ambos códigos, es decir, colojusto después de la llave que marca el final del primer código pulsamos dos veces intro y colocamos el segundo código.
 
Luego ya sólo queda clickar en APLICAR AL BLOG

 
 
En caso de que lo quieras alineado a la derecha en lugar de centrado, el código que tienes que poner es el siguiente:
 
.PageList {text-align:right !important;}
.PageList li {display:inline !important; float:none !important;}