Usamos cookies propias y de terceros para ofrecer info personalizada según su navegación. Si continua navegando consideramos que acepta el uso de cookiesOKMás información

Código Color de una imagen



Código Color de una imagen

¿Quieres saber que colores son los que se estan utilizando en alguna imagen para poner texto de igual color?


Pictaculous



















Con esta herramiente online 

Pictaculous

Tan solo necesitas ir a Pictaculous, en buscar, pones la imagen que quieras y te devuelve una paleta con el Código Color que utiliza la imagen, pudiendo cambiar color a una imagen, para multitud de proyectos que puedas necesitar.

Espero que te ayude en algun proyecto.


Código Color de una imagen

¿Quieres saber que colores son los que se estan utilizando en alguna imagen para poner texto de igual color?


Pictaculous



















Con esta herramiente online 

Pictaculous

Tan solo necesitas ir a Pictaculous, en buscar, pones la imagen que quieras y te devuelve una paleta con el Código Color que utiliza la imagen, pudiendo cambiar color a una imagen, para multitud de proyectos que puedas necesitar.

Espero que te ayude en algun proyecto.

Como poner fotos una al lado de otra en un post

Como poner fotos una al lado de otra en un post
Cuando subimos al blog varias imágenes nos las coloca así:

uno

Dos

Tres

Cuatro

Pero claro, no queremos que esto sea así, las queremos colocar en horizontal, así:


Uno
DosTres Cuatro

¿Como poner fotos una al lado de otra en un post ?
Bien, para conseguirlo lo que haremos sera lo siguiente :

  1. Subiremos las imágenes en vista Redactar
  2. Cambiaremos a vista HTML y copiaremos todo el código 
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZrRgHndcofMMFRQbSAKrWrOVyzfBMNMuNf3h47mT_JOdodceKj6V8BoshO9NC7Os3Qhir9-3lZ5ECbUJx9YP5cJC7EuA6bht34YcKxdVx-B8wZBrQ3pUIoOrh_2IVPJVVag4rMUp_Nc/s1600/uno.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZrRgHndcofMMFRQbSAKrWrOVyzfBMNMuNf3h47mT_JOdodceKj6V8BoshO9NC7Os3Qhir9-3lZ5ECbUJx9YP5cJC7EuA6bht34YcKxdVx-B8wZBrQ3pUIoOrh_2IVPJVVag4rMUp_Nc/s1600/uno.jpg" height="200" width="130" /></a></div>

<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjlxaCM6qk1sObEVjd4mMYLd0icrdmrCaCqek7Gw7xkl2MhsSiqa9ncGXLHXE1_zPSGNOT_CVPvIoI7Db0TxLx44VvkRMlD8xoXpyt8PfK1DdQ8oLqLLf6OyK-brOJWBm1hdS0BJJxJd8/s1600/dos.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjlxaCM6qk1sObEVjd4mMYLd0icrdmrCaCqek7Gw7xkl2MhsSiqa9ncGXLHXE1_zPSGNOT_CVPvIoI7Db0TxLx44VvkRMlD8xoXpyt8PfK1DdQ8oLqLLf6OyK-brOJWBm1hdS0BJJxJd8/s1600/dos.jpg" height="200" width="130" /></a></div>

<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3mpdcKldUyiWfogO_T9_W7Dp_Totp5Cu-hoA51xuapMQr4aqEBNKqJKxBWgEtt11vVFsywcHdujm7XmEN7J1ULVM4HaUhuWhYltRL9WvpDai9BTnDgsoTr8zy_96feRHMucTVV743yQ/s1600/tres.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3mpdcKldUyiWfogO_T9_W7Dp_Totp5Cu-hoA51xuapMQr4aqEBNKqJKxBWgEtt11vVFsywcHdujm7XmEN7J1ULVM4HaUhuWhYltRL9WvpDai9BTnDgsoTr8zy_96feRHMucTVV743yQ/s1600/tres.jpg" height="200" width="130" /></a></div>

<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPPD8XulmCvtATCizpndPzyMKUruBAMecbZjWvzN7zl5wG1aq9Ii0PE8VS8xl2yI48fNkusc_trvxrcu2nj_9I7_38h6VoohL6fj-hmtaCnwh4Q-U8Q-yPyhW3HIwFZCZfqnNEvgEwPyo/s1600/cuatro.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPPD8XulmCvtATCizpndPzyMKUruBAMecbZjWvzN7zl5wG1aq9Ii0PE8VS8xl2yI48fNkusc_trvxrcu2nj_9I7_38h6VoohL6fj-hmtaCnwh4Q-U8Q-yPyhW3HIwFZCZfqnNEvgEwPyo/s1600/cuatro.jpg" height="200" width="130" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
Limpiaremos el código y dejaremos  solo el código de las imágenes entre <a> y </a> y el primer
 <div class="separator" style="clear: both; text-align: center;"> quedando asi:
 <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZrRgHndcofMMFRQbSAKrWrOVyzfBMNMuNf3h47mT_JOdodceKj6V8BoshO9NC7Os3Qhir9-3lZ5ECbUJx9YP5cJC7EuA6bht34YcKxdVx-B8wZBrQ3pUIoOrh_2IVPJVVag4rMUp_Nc/s1600/uno.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZrRgHndcofMMFRQbSAKrWrOVyzfBMNMuNf3h47mT_JOdodceKj6V8BoshO9NC7Os3Qhir9-3lZ5ECbUJx9YP5cJC7EuA6bht34YcKxdVx-B8wZBrQ3pUIoOrh_2IVPJVVag4rMUp_Nc/s1600/uno.jpg" height="200" width="130" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjlxaCM6qk1sObEVjd4mMYLd0icrdmrCaCqek7Gw7xkl2MhsSiqa9ncGXLHXE1_zPSGNOT_CVPvIoI7Db0TxLx44VvkRMlD8xoXpyt8PfK1DdQ8oLqLLf6OyK-brOJWBm1hdS0BJJxJd8/s1600/dos.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjlxaCM6qk1sObEVjd4mMYLd0icrdmrCaCqek7Gw7xkl2MhsSiqa9ncGXLHXE1_zPSGNOT_CVPvIoI7Db0TxLx44VvkRMlD8xoXpyt8PfK1DdQ8oLqLLf6OyK-brOJWBm1hdS0BJJxJd8/s1600/dos.jpg" height="200" width="130" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3mpdcKldUyiWfogO_T9_W7Dp_Totp5Cu-hoA51xuapMQr4aqEBNKqJKxBWgEtt11vVFsywcHdujm7XmEN7J1ULVM4HaUhuWhYltRL9WvpDai9BTnDgsoTr8zy_96feRHMucTVV743yQ/s1600/tres.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3mpdcKldUyiWfogO_T9_W7Dp_Totp5Cu-hoA51xuapMQr4aqEBNKqJKxBWgEtt11vVFsywcHdujm7XmEN7J1ULVM4HaUhuWhYltRL9WvpDai9BTnDgsoTr8zy_96feRHMucTVV743yQ/s1600/tres.jpg" height="200" width="130" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPPD8XulmCvtATCizpndPzyMKUruBAMecbZjWvzN7zl5wG1aq9Ii0PE8VS8xl2yI48fNkusc_trvxrcu2nj_9I7_38h6VoohL6fj-hmtaCnwh4Q-U8Q-yPyhW3HIwFZCZfqnNEvgEwPyo/s1600/cuatro.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPPD8XulmCvtATCizpndPzyMKUruBAMecbZjWvzN7zl5wG1aq9Ii0PE8VS8xl2yI48fNkusc_trvxrcu2nj_9I7_38h6VoohL6fj-hmtaCnwh4Q-U8Q-yPyhW3HIwFZCZfqnNEvgEwPyo/s1600/cuatro.jpg" height="200" width="130" /></a>
Solamente nos quedara tener en cuenta, las medidas de las imágenes para que no sobrepasen la anchura que tenemos para todas ellas.
Espero que lo haya explicado bien para que no tengas ningun problema a la hora de llevarlo a la practica.
¿Te atreves a ejecutarlo?
Como poner fotos una al lado de otra en un post
Cuando subimos al blog varias imágenes nos las coloca así:

uno

Dos

Tres

Cuatro

Pero claro, no queremos que esto sea así, las queremos colocar en horizontal, así:


Uno
DosTres Cuatro

¿Como poner fotos una al lado de otra en un post ?
Bien, para conseguirlo lo que haremos sera lo siguiente :

  1. Subiremos las imágenes en vista Redactar
  2. Cambiaremos a vista HTML y copiaremos todo el código 
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZrRgHndcofMMFRQbSAKrWrOVyzfBMNMuNf3h47mT_JOdodceKj6V8BoshO9NC7Os3Qhir9-3lZ5ECbUJx9YP5cJC7EuA6bht34YcKxdVx-B8wZBrQ3pUIoOrh_2IVPJVVag4rMUp_Nc/s1600/uno.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZrRgHndcofMMFRQbSAKrWrOVyzfBMNMuNf3h47mT_JOdodceKj6V8BoshO9NC7Os3Qhir9-3lZ5ECbUJx9YP5cJC7EuA6bht34YcKxdVx-B8wZBrQ3pUIoOrh_2IVPJVVag4rMUp_Nc/s1600/uno.jpg" height="200" width="130" /></a></div>

<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjlxaCM6qk1sObEVjd4mMYLd0icrdmrCaCqek7Gw7xkl2MhsSiqa9ncGXLHXE1_zPSGNOT_CVPvIoI7Db0TxLx44VvkRMlD8xoXpyt8PfK1DdQ8oLqLLf6OyK-brOJWBm1hdS0BJJxJd8/s1600/dos.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjlxaCM6qk1sObEVjd4mMYLd0icrdmrCaCqek7Gw7xkl2MhsSiqa9ncGXLHXE1_zPSGNOT_CVPvIoI7Db0TxLx44VvkRMlD8xoXpyt8PfK1DdQ8oLqLLf6OyK-brOJWBm1hdS0BJJxJd8/s1600/dos.jpg" height="200" width="130" /></a></div>

<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3mpdcKldUyiWfogO_T9_W7Dp_Totp5Cu-hoA51xuapMQr4aqEBNKqJKxBWgEtt11vVFsywcHdujm7XmEN7J1ULVM4HaUhuWhYltRL9WvpDai9BTnDgsoTr8zy_96feRHMucTVV743yQ/s1600/tres.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3mpdcKldUyiWfogO_T9_W7Dp_Totp5Cu-hoA51xuapMQr4aqEBNKqJKxBWgEtt11vVFsywcHdujm7XmEN7J1ULVM4HaUhuWhYltRL9WvpDai9BTnDgsoTr8zy_96feRHMucTVV743yQ/s1600/tres.jpg" height="200" width="130" /></a></div>

<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPPD8XulmCvtATCizpndPzyMKUruBAMecbZjWvzN7zl5wG1aq9Ii0PE8VS8xl2yI48fNkusc_trvxrcu2nj_9I7_38h6VoohL6fj-hmtaCnwh4Q-U8Q-yPyhW3HIwFZCZfqnNEvgEwPyo/s1600/cuatro.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPPD8XulmCvtATCizpndPzyMKUruBAMecbZjWvzN7zl5wG1aq9Ii0PE8VS8xl2yI48fNkusc_trvxrcu2nj_9I7_38h6VoohL6fj-hmtaCnwh4Q-U8Q-yPyhW3HIwFZCZfqnNEvgEwPyo/s1600/cuatro.jpg" height="200" width="130" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
Limpiaremos el código y dejaremos  solo el código de las imágenes entre <a> y </a> y el primer
 <div class="separator" style="clear: both; text-align: center;"> quedando asi:
 <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZrRgHndcofMMFRQbSAKrWrOVyzfBMNMuNf3h47mT_JOdodceKj6V8BoshO9NC7Os3Qhir9-3lZ5ECbUJx9YP5cJC7EuA6bht34YcKxdVx-B8wZBrQ3pUIoOrh_2IVPJVVag4rMUp_Nc/s1600/uno.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZrRgHndcofMMFRQbSAKrWrOVyzfBMNMuNf3h47mT_JOdodceKj6V8BoshO9NC7Os3Qhir9-3lZ5ECbUJx9YP5cJC7EuA6bht34YcKxdVx-B8wZBrQ3pUIoOrh_2IVPJVVag4rMUp_Nc/s1600/uno.jpg" height="200" width="130" /></a> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjlxaCM6qk1sObEVjd4mMYLd0icrdmrCaCqek7Gw7xkl2MhsSiqa9ncGXLHXE1_zPSGNOT_CVPvIoI7Db0TxLx44VvkRMlD8xoXpyt8PfK1DdQ8oLqLLf6OyK-brOJWBm1hdS0BJJxJd8/s1600/dos.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjlxaCM6qk1sObEVjd4mMYLd0icrdmrCaCqek7Gw7xkl2MhsSiqa9ncGXLHXE1_zPSGNOT_CVPvIoI7Db0TxLx44VvkRMlD8xoXpyt8PfK1DdQ8oLqLLf6OyK-brOJWBm1hdS0BJJxJd8/s1600/dos.jpg" height="200" width="130" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3mpdcKldUyiWfogO_T9_W7Dp_Totp5Cu-hoA51xuapMQr4aqEBNKqJKxBWgEtt11vVFsywcHdujm7XmEN7J1ULVM4HaUhuWhYltRL9WvpDai9BTnDgsoTr8zy_96feRHMucTVV743yQ/s1600/tres.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK3mpdcKldUyiWfogO_T9_W7Dp_Totp5Cu-hoA51xuapMQr4aqEBNKqJKxBWgEtt11vVFsywcHdujm7XmEN7J1ULVM4HaUhuWhYltRL9WvpDai9BTnDgsoTr8zy_96feRHMucTVV743yQ/s1600/tres.jpg" height="200" width="130" /></a><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPPD8XulmCvtATCizpndPzyMKUruBAMecbZjWvzN7zl5wG1aq9Ii0PE8VS8xl2yI48fNkusc_trvxrcu2nj_9I7_38h6VoohL6fj-hmtaCnwh4Q-U8Q-yPyhW3HIwFZCZfqnNEvgEwPyo/s1600/cuatro.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPPD8XulmCvtATCizpndPzyMKUruBAMecbZjWvzN7zl5wG1aq9Ii0PE8VS8xl2yI48fNkusc_trvxrcu2nj_9I7_38h6VoohL6fj-hmtaCnwh4Q-U8Q-yPyhW3HIwFZCZfqnNEvgEwPyo/s1600/cuatro.jpg" height="200" width="130" /></a>
Solamente nos quedara tener en cuenta, las medidas de las imágenes para que no sobrepasen la anchura que tenemos para todas ellas.
Espero que lo haya explicado bien para que no tengas ningun problema a la hora de llevarlo a la practica.
¿Te atreves a ejecutarlo?

Como poner una imagen o icono en todas tus entradas

Unknown
Mercedes Miramar
En este post, Una imagen o icono en todas tus entradas
Aprendimos a  poner fija una imagen como la que ves en esta esquina, en ella se explica como ponerla en el código pero si no quieres tocar la plantilla, vamos el código , lo puedes poner en cualquier entrada simplemente poniendo el código en HTML. Y teniendo la imagen alojada en un servidor, sustituyes LA IMAGEN QUE QUIERAS por la URL de la imagen.
<img src=' LA IMAGEN QUE QUIERAS ' style='float:left;height:80px;margin-bottom:10px;margin-right:10px;margin-top:6px;width:80px;'/><data:post.body/>

En la esquina superior derecha
<img src='LA IMAGEN QUE QUIERAS' style='float:right;height:80px;margin-bottom:10px;margin-left:10px;margin-top:6px;width:80px;'/><data:post.body/>

En la esquina inferior izquierda

Agrega el código a continuación de la etiqueta resaltada en verde:

<data:post.body/><img src='LA IMAGEN QUE QUIERAS' style='float:left;height:80px;margin-bottom:10px;margin-right:10px;margin-top:6px;width:80px;'/>

En la esquina inferior derecha

Sigue el mismo procedimiento citado en el punto anterior pero utiliza esto otro:

<data:post.body/><img src='LA IMAGEN QUE QUIERAS'style='float:right;height:80px;margin-bottom:10px;margin-left:10px;margin-top:6px;width:80px;'/>

Vista previa y si todo esta en orden, guardar


Mercedes Miramar
En este post, Una imagen o icono en todas tus entradas
Aprendimos a  poner fija una imagen como la que ves en esta esquina, en ella se explica como ponerla en el código pero si no quieres tocar la plantilla, vamos el código , lo puedes poner en cualquier entrada simplemente poniendo el código en HTML. Y teniendo la imagen alojada en un servidor, sustituyes LA IMAGEN QUE QUIERAS por la URL de la imagen.
<img src=' LA IMAGEN QUE QUIERAS ' style='float:left;height:80px;margin-bottom:10px;margin-right:10px;margin-top:6px;width:80px;'/><data:post.body/>

En la esquina superior derecha
<img src='LA IMAGEN QUE QUIERAS' style='float:right;height:80px;margin-bottom:10px;margin-left:10px;margin-top:6px;width:80px;'/><data:post.body/>

En la esquina inferior izquierda

Agrega el código a continuación de la etiqueta resaltada en verde:

<data:post.body/><img src='LA IMAGEN QUE QUIERAS' style='float:left;height:80px;margin-bottom:10px;margin-right:10px;margin-top:6px;width:80px;'/>

En la esquina inferior derecha

Sigue el mismo procedimiento citado en el punto anterior pero utiliza esto otro:

<data:post.body/><img src='LA IMAGEN QUE QUIERAS'style='float:right;height:80px;margin-bottom:10px;margin-left:10px;margin-top:6px;width:80px;'/>

Vista previa y si todo esta en orden, guardar


Transforma tus imagenes online a Polaroid

lared

Una nueva herramienta muy útil para un efecto Polaroid que en muchos blogs utilizan para las imágenes. Así que si te gusta su utilización es muy sencilla. Entraremos en este enlace y seguiremos los pasos:



En convertir su imagen:
Seleccionaremos nuestro archivo, añadiremos una descripción a nuestra imagen 
Pondremos los grados que queremos que gire y le daremos a subir imagen.

El enlace resultante solo estará 24 h, así que lo mejor sera guardarlo en nuestro PC.
En agradecimiento nos piden que votemos por el sitio.
Enlace: Instantizer

lared

Una nueva herramienta muy útil para un efecto Polaroid que en muchos blogs utilizan para las imágenes. Así que si te gusta su utilización es muy sencilla. Entraremos en este enlace y seguiremos los pasos:



En convertir su imagen:
Seleccionaremos nuestro archivo, añadiremos una descripción a nuestra imagen 
Pondremos los grados que queremos que gire y le daremos a subir imagen.

El enlace resultante solo estará 24 h, así que lo mejor sera guardarlo en nuestro PC.
En agradecimiento nos piden que votemos por el sitio.
Enlace: Instantizer

Una imagen o icono en todas tus entradas

Unknown

Para poner una imagen o icono en todas tus entradas, buscaremos la siguiente etiqueta:

<data:post.body/> 

<img src='URL IMAGEN' style='float:left;height:80px;margin-bottom:10px;margin-right:10px;margin-top:6px;width:80px;'/><data:post.body/>


Reemplaza URL IMAGEN por la dirección de la imagen 
Se vera en la esquina superior izquierda del post

Para la esquina superior derecha

<img src='URL IMAGEN' style='float:right;height:80px;margin-bottom:10px;margin-left:10px;margin-top:6px;width:80px;'/><data:post.body/>


Para la esquina inferior izquierda


<data:post.body/><img src='URL IMAGEN' style='float:left;height:80px;margin-bottom:10px;margin-right:10px;margin-top:6px;width:80px;'/>


Para la esquina inferior derecha

<data:post.body/><img src='URL IMAGEN' style='float:right;height:80px;margin-bottom:10px;margin-left:10px;margin-top:6px;width:80px;'/>

En cada uno de los casos tendremos que dar vista previa y si es correcto, Guardaremos cambios.
Si quieres también puedes ver esta entrada en la que se explica como ponerlo simplemente en HTML

Para poner una imagen o icono en todas tus entradas, buscaremos la siguiente etiqueta:

<data:post.body/> 

<img src='URL IMAGEN' style='float:left;height:80px;margin-bottom:10px;margin-right:10px;margin-top:6px;width:80px;'/><data:post.body/>


Reemplaza URL IMAGEN por la dirección de la imagen 
Se vera en la esquina superior izquierda del post

Para la esquina superior derecha

<img src='URL IMAGEN' style='float:right;height:80px;margin-bottom:10px;margin-left:10px;margin-top:6px;width:80px;'/><data:post.body/>


Para la esquina inferior izquierda


<data:post.body/><img src='URL IMAGEN' style='float:left;height:80px;margin-bottom:10px;margin-right:10px;margin-top:6px;width:80px;'/>


Para la esquina inferior derecha

<data:post.body/><img src='URL IMAGEN' style='float:right;height:80px;margin-bottom:10px;margin-left:10px;margin-top:6px;width:80px;'/>

En cada uno de los casos tendremos que dar vista previa y si es correcto, Guardaremos cambios.
Si quieres también puedes ver esta entrada en la que se explica como ponerlo simplemente en HTML

Imágenes de marcador de posición

Unknown
Otra página, Lorem pixel, Imágenes de marcador de posición para todos los casos. 
Diseño web o impresión. Es muy sencillo y totalmente gratuito!
Sólo hay que poner la url personalizada en el código como el siguiente:
<img src="http://lorempixel.com/400/200" />para obtener su imagen FPO / maniquí.

La página en cuestión es:

generador-imagenes

Lorem pixel
Espero que le encontréis utilidad
Otra página, Lorem pixel, Imágenes de marcador de posición para todos los casos. 
Diseño web o impresión. Es muy sencillo y totalmente gratuito!
Sólo hay que poner la url personalizada en el código como el siguiente:
<img src="http://lorempixel.com/400/200" />para obtener su imagen FPO / maniquí.

La página en cuestión es:

generador-imagenes

Lorem pixel
Espero que le encontréis utilidad

Cantos redondeados en nuestras imagenes con Roundpic

herramientas



















Otra herramienta interesante a la hora de diseñar nuestro blog, hoy se trata de una herramienta online.
Se trata de redondear las esquinas de nuestras imágenes, el procedimiento es muy sencillo.
Tan solo iremos a la direccion http://www.roundpic.com/ le daremos a examinar, elegimos la imagen y ya en las opciones seleccionamos lo que mas nos guste. 
Cuando lo tengamos daremos a       Round     y se descargara el archivo modificado, y lo tendremos listo para utilizarlo.

herramientas



















Otra herramienta interesante a la hora de diseñar nuestro blog, hoy se trata de una herramienta online.
Se trata de redondear las esquinas de nuestras imágenes, el procedimiento es muy sencillo.
Tan solo iremos a la direccion http://www.roundpic.com/ le daremos a examinar, elegimos la imagen y ya en las opciones seleccionamos lo que mas nos guste. 
Cuando lo tengamos daremos a       Round     y se descargara el archivo modificado, y lo tendremos listo para utilizarlo.

Como Quitar Borde a las imagenes

Las  plantillas de Blogger vienen con un borde incluido en las imágenes,
entra al blog en vista Diseño y vas a Html, con Ctrl F buscas este código y cambias el valor de "border" por 0,
Localizas en tu plantilla en modo Html, esta parte del código:

.post img {padding:4px;border:1px solid $bordercolor;}










Las  plantillas de Blogger vienen con un borde incluido en las imágenes,
entra al blog en vista Diseño y vas a Html, con Ctrl F buscas este código y cambias el valor de "border" por 0,
Localizas en tu plantilla en modo Html, esta parte del código:

.post img {padding:4px;border:1px solid $bordercolor;}










Como poner una Imagen en el fondo de página

La Red Te Ayudara











Subiremos nuestra imagen a un alojamiento adecuado o la alojamos en Blogger.

Copiaremos la url de nuestra imagen y volvemos a nuestro panel,  a Edición HTML,
con CTRL F, buscamos el siguiente código,

body { el resto podría ser distinto al ejemplo) dentro del código de la plantilla:


body {background:#fff;margin:0;}


Añadimos en el código la url de nuestra imagen tal como se ve en el código siguiente:

body {background: url(URL de la IMAGEN);
margin:0;}

La imagen de fondo, deberá ser una imagen adecuada ya que se repetirá tanto en vertical como en horizontal y cubrirá por completo el fondo del blog,


La Red Te Ayudara











Subiremos nuestra imagen a un alojamiento adecuado o la alojamos en Blogger.

Copiaremos la url de nuestra imagen y volvemos a nuestro panel,  a Edición HTML,
con CTRL F, buscamos el siguiente código,

body { el resto podría ser distinto al ejemplo) dentro del código de la plantilla:


body {background:#fff;margin:0;}


Añadimos en el código la url de nuestra imagen tal como se ve en el código siguiente:

body {background: url(URL de la IMAGEN);
margin:0;}

La imagen de fondo, deberá ser una imagen adecuada ya que se repetirá tanto en vertical como en horizontal y cubrirá por completo el fondo del blog,


Como quitar el Borde a la Foto del Perfil

La Red Te Ayudara










Para quitar el borde a la imagen que se muestra en tu perfil, localizas esta parte del

código en la plantilla,entra al blog en vista Diseño y vas a Html, con Ctrl F buscas este código y
 y cambias el valor de "border" por 0

.profile-img {float: left;margin: 0 5px 5px 0;padding: 4px;border: 1px solid $bordercolor;}
La Red Te Ayudara










Para quitar el borde a la imagen que se muestra en tu perfil, localizas esta parte del

código en la plantilla,entra al blog en vista Diseño y vas a Html, con Ctrl F buscas este código y
 y cambias el valor de "border" por 0

.profile-img {float: left;margin: 0 5px 5px 0;padding: 4px;border: 1px solid $bordercolor;}

Como poner una imagen de fondo en una entrada de tu blog


puntillas
Poner una imagen de fondo en una entrada de tu blog para poder escribir encima de la imagenes , usando una tabla (table):
Crea una Entrada Nueva en el blog, en el modo HTML pega este código:








<table bordercolor="#ffffff" cellspacing="0" cellpadding="0" width="100%"background="URL_DE_IMAGEN" border="0"><tbody><tr><td><p>TextoAquí</p></td></tr></tbody></table>





Puedes coger cualquier imagen de tu agrado y en cualquier página de alojamiento gratuito o en Blogger ,copias la url dela imagen. para sustituirla en el código anterior por "URL_DE_IMAGEN" Donde pone "Texto aquí" escribes tu entrada,respetando el resto del código.



puntillas
Poner una imagen de fondo en una entrada de tu blog para poder escribir encima de la imagenes , usando una tabla (table):
Crea una Entrada Nueva en el blog, en el modo HTML pega este código:








<table bordercolor="#ffffff" cellspacing="0" cellpadding="0" width="100%"background="URL_DE_IMAGEN" border="0"><tbody><tr><td><p>TextoAquí</p></td></tr></tbody></table>





Puedes coger cualquier imagen de tu agrado y en cualquier página de alojamiento gratuito o en Blogger ,copias la url dela imagen. para sustituirla en el código anterior por "URL_DE_IMAGEN" Donde pone "Texto aquí" escribes tu entrada,respetando el resto del código.


Impedir que guarden nuestras imagenes

Unknown
codigo

Con solo un código aplicado a vuestra imagen podéis hacer que cuando vuestro visitante intente
guardarse la imagen, aparezca un mensaje de "No tienes permiso".


Código:

<img src="URL DE LA IMAGEN" oncopy="alert('No tienes permiso' );return false"oncontextmenu="alert(' No tienes permiso' );return false" />

Podéis cambiar el mensaje "No tienes permiso" por el que queráis poner vosotros.

codigo

Con solo un código aplicado a vuestra imagen podéis hacer que cuando vuestro visitante intente
guardarse la imagen, aparezca un mensaje de "No tienes permiso".


Código:

<img src="URL DE LA IMAGEN" oncopy="alert('No tienes permiso' );return false"oncontextmenu="alert(' No tienes permiso' );return false" />

Podéis cambiar el mensaje "No tienes permiso" por el que queráis poner vosotros.