CopyPasteando: noviembre 2007

Como eliminar los link de las imágenes de Blogger

Etiquetas: Blogger, Trucos, Tutoriales | 0 comentarios

Cuando subimos una imagen desde nuestro PC a una de nuestras entradas, Blogger por defecto le añade un link que hace que al pinchar sobre la imagen, esta se muestre en una página nueva a su tamaño real.
Para evitar esto podemos eliminar este link, de tal forma que si pinchamos sobre la imagen no pase nada, simplemente mostraremos la imagen como se ve en la entrada.

Ejemplo: (Pinchar en las imagenes para verlo)

Imagen con link

Imagen sin link

Una vez hemos subido la imagen a nuestro editor de entradas, en la parte del html, el código de la imagen que vemos es este:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_8PJ-pgoBhWQ/Rzg8hpE9uJI/AAAAAAAACjc/snhMorCEbtI/s1600-h/
Dibujo.bmp"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;" src="http://2.bp.blogspot.com/_8PJ-pgoBhWQ/Rzg8hpE9uJI/AAAAAAAACjc/snhMorCEbtI/s200/
Dibujo.bmp" border="0" alt=""id="BLOGGER_PHOTO_ID_5131918324048705682" /></a>

Si nos fijamos en este código podremos observar que está dividido (por así decirlo) en tres partes marcadas por las < > de apertura y cierre:

[1] La parte que hace posible el link a la imagen.

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_8PJ-pgoBhWQ/Rzg8hpE9uJI/AAAAAAAACjc/snhMorCEbtI/s1600-h/
Dibujo.bmp">

[2] La parte que muestra la imagen.

<img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;" src="http://2.bp.blogspot.com/_8PJ-pgoBhWQ/Rzg8hpE9uJI/AAAAAAAACjc/snhMorCEbtI/s200/
Dibujo.bmp" border="0" alt=""id="BLOGGER_PHOTO_ID_5131918324048705682" />

[3] El cierre del código: </a>

Una vez controladas las partes, para eliminar el link de la imagen, nada más simple que borrar el código de la parte [1] y el cierre de la parte tres [3].

Eliminado esto, nos quedará solamente el código que muestra la imagen [2]

Compartir Enlace

Destacar o Resaltar los Comentarios del Autor del Blog de Blogger

Etiquetas: Blogger, Trucos, Tutoriales | 0 comentarios

Aplicando una líneas de código en nuestra plantilla podemos conseguir que cuando nosotros mismo hagamos un comentario en nuestro blog, este se distinga del de nuestras visitas. Creo que es un "truco" muy útil, sobre todo cuando tenemos bastantes comentarios, así de un solo vistazo nos daremos cuenta donde hemos respondido.
De la misma manera cuando un visitante ha dejado un comentario y vuelve a comprobar si le hemos respondido le será más fácil y rápido comprobarlo. :-)
Podéis ver el resultado en este mismo blog, mis comentarios tienen un color de fondo distinto al de mis visitas.

Empezamos!

Paso [1] Vamos a la parte de edición - HTML de la plantilla y expandimos los artilugios. Buscamos la parte del código que corresponde al bloque de comentarios y añadimos la parte que está en negrita:

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>

<b:if cond='data:comment.author == data:post.author'>
<dd class='blog-author-comment'>
<data:comment.body/>
</dd>
<b:else/>

<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<data:comment.body/>
<b:else/>
<data:comment.body/>
</b:if>
</dd>

</b:if>

<dd class='comment-footer'>

<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>

</dd>
</b:loop>
</dl>

Paso [2] Hecho esto subimos hacia arriba de la plantilla, a la parte del CSS y buscamos la zona de comentarios, en las plantillas Mínima, por ejemplo, veremos algo así:

#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-body p {
margin:0 0 .75em;
}

Paso [3] Si la plantilla es la Rounders, por ejemplo, será algo como esto lo que hemos de encontrar:

.comment-body {
margin:0 0 1.25em;
padding:0 0 0 20px;
}
.comment-body p {
margin:0 0 .5em;
}

En las demás plantillas será algo más o menos parecido, en realidad no tiene demasiada importancia el lugar, pero mejor que este más o menos por esa zona para evitar problemas de localización del código cuando lo necesitemos.

Paso [4] Una vez situados en la zona del CSS de comentarios, añadimos debajo del código de los ejemplos anteriores este otro:

.blog-author-comment {
margin:.25em 0 0;
}
.blog-author-comment p {
margin:0 0 .75em;
padding:5px 10px;
border:1px dotted #254117;
background:#C3FDB8;
}

Esto hará que cuando dejemos el comentario en nuestro blog, este se distinga de los demás:

En estas líneas del código podemos hacer los cambios de color del fondo, grosor y color del borde:
border:1px dotted #254117;
background:#C3FDB8;

Compartir Enlace

Libro Los Secretos de Google (e-Book)

Etiquetas: e-Book, Libros | 0 comentarios

Los secretos de GOOGLE:
Descubre todas las opciones ocultas de este potente buscador CÓMO FUNCIONA POR DENTRO - Coloca tu sitio web en los primeros puestos - Haz búsquedas avanzadas de textos e imágenes - Usa las herramientas del idioma - Accede a Google desde tu móvil - Y mucho más EL FINAL DE LA INTIMIDAD Descubre cómo Internet permite descubrir los datos personales de casi cualquier persona, localizar cartas y entregas, consultar datos telefónicos y buscar en bases de datos ocultas. HACKING CON GOOGLE Cómo saberlo todo sobre un sitio, y cómo conocer los datos personales de su dueño, sin ni siquiera invadirlo.

Descarga

CopyPasteandoLink