Picture2Life: efectos en las imágenes

Picture2Life es una herramienta novedosa que nos permite modificar en cuestión de segundos la imagen que deseemos; nos ofrece muchos efectos y posibilidades para transformar una misma imagen en imágenes diferentes con solo subir la imagen de nuestra PC o la dirección URL de la imagen...Y si queremos podemos crear una cuenta...

Una imagen...



...puede ser vista de mil formas; aquí algunas maneras en que esta herramienta nos permite tranformarla:

Premio "Batipremio"

Me enteré con algo de sorpresa y a la vez de alegría, que había recibido este premio. Me lo ha dado Birdelo a quien le agradezco por haber tenido en cuenta este blog.

Y bueno, como debo compartirlo con seis blogs,lo comparto con:

♠ Gema de Gem@blog
♠ Rosa de El Escaparate de Rosa
♠ G de Para Para todos
♠ Vesta de El blog de Vesta
♠ Eulalia de Tuneando el blog
♠ Feripula de ReCurS.O.S para tu Blog

A mi parecer son blog que tiene de todo un poco: nos informan y divierten.

Texto con sombra y volumen

Ahora les enseñaré cómo crear un texto con sombra y volumen...Y también, veremos cómo podemos usarlos.Vamos a ello.

El código a usar es:

<div style="margin:0px auto;width:450px;filter:shadow;color:red;font-size:32pt;line-height:200%;">TEXTO</div>

Una pequeña explicación:
♠ width:450px es el ancho del texto.
♠ color: podemos cambiarlo por el color que deseemos, pero en palabras y en inglés ( red, blue, green, etc.)
♠ font-size:32pt es el tamaño de letra; podemos agrandarla o reducirla.

Ejemplo:

Diversas & Variadas

♥ Podemos usarlo, junto con un fondo, para la cabecera de nuestro blog.



♥ O usarlo como un botón de enlace.

D & V

En fin, podemos usarlo de distintas formas: cómo título de entradas, como letra capital...Ya depende de cada uno de nosotros.

Si tienen dudas o comentarios, háganmelos llegar.

Texto del post en dos columnas

Ahora,les voy a hablar de un código que puede servirnos para dar un estilo diferente a nuestros post: se trata de colocar el texto en dos columnas.

El código a usar es el siguiente:

<table><tbody><tr><td style="PADDING-RIGHT: 15px; MARGIN-TOP: 0px; PADDING-LEFT: 15px; PADDING-BOTTOM: 15px; WIDTH: 40%; PADDING-TOP: 15px"><p style="TEXT-ALIGN: justify">TEXTO DE LA PRIMERA COLUMNA DEL POST
</p><td style="PADDING-RIGHT: 15px; MARGIN-TOP: 0px; PADDING-LEFT: 15px; PADDING-BOTTOM: 15px; WIDTH: 40%; PADDING-TOP: 15px"><p style="TEXT-ALIGN: justify">TEXTO DE LA SEGUNDA COLUMNA DEL POST</p></td></tr></tbody></table>

Un ejemplo:

El protagonista, Jean Valjean, un hombre que recién acaba de salir de prisión, busca refugio y alimento. Sin embargo, nadie quiere acogerlo por haber sido un ladrón. Después de haber tocado muchas puertas, toca la puerta de un sacerdote que lo acoge: le da de comer y permite que pase la noche en su casa.

Valjean se levanta y coge unos cubiertos de plata. Está a punto de irse, cuando ingresa el sacerdote. Valjean lo golpea y se va.Al día siguiente, unos oficiales llevan a Valjean a la casa del sacerdote, porque no le creen que, según Valjean, el sacerdote le haya regalado los cubiertos.

También podemos agregar dibujos , enlaces, etc...Es decir, podemos trabajar como cualquier entrada.
Si deseamos usar este estilo para todas nuestras entradas y, para evitar pegar a cada rato el código, hacemos lo siguiente:

♠ Ingresamos a Configuración/ Formato y nos ubicamos en Plantilla de entrada.
♠ En Plantilla de entrada pegamos el código y damos click en Guardar configuración

Éso es todo, muy sencillo,pero si tiene dudas o comentarios, háganmelos saber.

Lo vi en: El Escaparate

Agregar una segunda columna (plantilla Mínima)

Hace unos días, G me preguntaba cómo agregar una nueva columna (o sidebar) a su blog; y en un comentario posterior, me dice que usa la plantilla Mínima. Para los que no saben cómo hacerlo, pues aquí les va la solución:

♠ Ingresamos a Diseño/ Edición de HTML y activamos el casillero Expandir plantillas de artilugios.
♠ Con Ctrl+F , buscamos en la plantilla /* Outer-Wrapper: y debajo de éste, encontraremos #outer-wrapper .
♠ Al modificar el #outer-wrapper estaremos modificando el ancho del blog; para aumentar el ancho, modificamos width:6620px; a el ancho de 752px; aproximadamente.
♠ Siguiendo dentro de /* Outer-Wrapper: buscaremos #main-wrapper y, en este caso, reduciremos el width:412px; a 400px; aproximadamente.
♠ También, modificaremos la #sidebar-wrapper ,de width: 220px; a width: 150 px;
♠ Debajo de todo el código #sidebar-wrapper { hasta su corchete de cierre }, agregaremos éste código:

#newsidebar-wrapper {
width: 150px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
}

♠ Finalmente, con la ayuda de Ctrl+F buscaremos en la plantilla : div id='content-wrapper'> y debajo de este código agregamos:

<div id='newsidebar-wrapper'>
<b:section class='sidebar' id='newsidebar' preferred='yes'>
<b:widget id='NewProfile' locked='false' title='About Me' type='Profile'/>
</b:section>
</div>

Guardamos los cambios y listo!
Si hicimos bien todos los pasos, el resultado será éste:



Bueno G espero ahora ya sabes cómo agregar una sidebar a la plantilla Mínima :)

Códigos básicos

Hace unos días Fabiola comentaba lo siguiente:

Es muy poco demoroso estar leyendo la plantilla completa asi que si pudieras darme algún truco para buscar en la plantilla (si es que existe ) te lo agradecería.

Este comentario me dio la idea de hacer un post sobre lo que podríamos llamar "trucos" o códigos básicos, que son sencillos, pero que nos facilitan las cosas. Bueno, veamos algunos:

♠ Texto en negrita

<b>TEXTO</b>

Ejemplo: Hola

♠ Texto en cursiva:

<i>TEXTO</i>

Ejemplo: Hola

♠ Negrita y cursiva al mismo tiempo:

<b><i>TEXTO</i></b>

Ejemplo: Hola

♠ Texto o párrafo con sangría:

<blockquote>TEXTO</blockquote>

Ejemplo:

No tenía miedo a las dificultades: lo que la asustaba era la obligación de tener que escoger un camino. Escoger un camino significaba abandonar otros.
Paulo Coelho

Puedes usarlo para citar tus frases favoritas o destacar algún texto!

♠ Buscar un código en la plantilla:

CTRL+F

Se abrirá un cuadro de diálogo; ponemos el texto o código a buscar, aceptar y listo!

♠ Crear un enlace:

<a href="URL">TEXTO</a>

Ejemplo: Diversas & Variadas

También podemos usarlo para crear un enlace con nuestro e-mail!

♠ Crear un enlace que se abrirá en una ventana emergente:

<a href="URL" target="_blank">TEXTO</a>

Ejemplo: Diversas & Variadas

También podemos poner en vez de texto, una imagen con enlace y escogemos si queremos que se abra en una ventana emergente o en la misma ventana !

♠ Añadir una imagen:

<img src="url-de-la-imagen" />

Ejemplo:

♠ Escribir texto en distintas líneas (este truco sobretodo les servirá cuando quieran agregar varios códigos en un mismo gadget; por ejemplo si quieren poner botones de enlaces, verán que aparecen junto, si usan este código, harán que los botones están uno debajo de otro)

<div align="left">TEXTO-CÓDIGOS-ETC</div>

Ejemplo:
Diversas
Variadas

♠ Línea con color:

<table bgcolor="#C3D9FF"><tbody><tr><td>TEXTO</td></tr></tbody></table>

Ejemplo:

Diversas & Variadas

Podemos usar este código para resaltar un enlace, por ejemplo, o un texto o frase especial!

Pueden aplicarlos, o mezclarlos, como mejor les parezca; si tienen alguna duda, háganmela saber y veré cómo puedo ayudarlos.

Flashmo:plantillas en flash

Flashmo es una página que nos ofece una variedad de plantillas en flash (totalmente gratuitas) para nuestro blog.Encontrarán diseños realmente bonitos, además de otras utilidades, como wallpapers, menús,todo en flash.Aquí les dejo una pequeña muestra: