Icono en los títulos de las entradas

¡ Artículo publicado en el blog El Balcón de Jaime, que pese a ser un blog terminado, es uno de los mejores en truvos blogger. ! Ve la entrada en su blog original.


Imagen o icono a la derecha de los títulos de las entradas

Los títulos de las entradas en blogger pueden modificarse de muchas formas, y una de ellas es agregándoles una imagen o icono a su derecha.

Aunque también puede hacerse por medio de unas líneas de CSS, explicaré el procedimiento para realizar el truco en HTML (lo que tiene ventajas... Podremos añadir una imagen de fondo y un icono distinto a la derecha).

Diseño>Edición de HTML>expandimos artilugios

Busca este bloque de código:

<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>

<b:else/>

<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>

<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>

Y añade la línea que aparece resaltada en verde a continuación:

<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>

<b:else/>
<b:if cond='data:post.url'>
<img style="margin-right:4px;" src= "URL DEL ICONO"/><a expr:href='data:post.url'><data:post.title/></a>

<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>

Reemplaza URL DEL ICONO por la dirección de tu imagen o icono ^[+].

Haz vista previa para ver el resultado y guarda la plantilla para terminar.

Read More

Cambiar el "Sin comentarios" o "x Comentarios" por una imagen o icono

¡ Artículo publicado en el blog El Balcón de Jaime, que pese a ser un blog terminado, es uno de los mejores en truvos blogger. ! Ve la entrada en su blog original.

Cambiar "Sin comentarios , 1 comentario, X comentarios" por una imagen

Este es un truco muy sencillo y bastante interesante ya que podrás cambiar la frase "Sin comentarios , 1 comentario, X comentarios" por una imagen cualquiera, de manera que ésta actúe como enlace hacia los comentarios de cada entrada...



Para aplicarlo en tu blog haz lo siguiente:

Diseño>Edición de HTML>expandimos artilugios

Busca el bloque perteneciente al enlace de comentarios:

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

Y bórralo por completo. Ahora pon este en su lugar:

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><img src='URL DE TU IMAGEN'/></a>
</b:if>
</b:if>
</span>

Sustituye URL DE TU IMAGEN por la dirección de tu imagen o icono ^[+].

En Iconfinder podrás encontrar un variado surtido de iconos, entre ellos, de comentarios.

Para terminar, guarda la plantilla:

Read More

Agrega una imagen o icono en el título de las entradas

¡ Artículo publicado en el blog El Balcón de Jaime, que pese a ser un blog terminado, es uno de los mejores en truvos blogger. ! Ve la entrada en su blog original.

Imagen o icono en el título de las entradas (modo simple)

Ya hemos aprendido a incluir una imagen o un icono a los títulos de nuestras entradas por medio del HTML de nuestra plantilla. Dicho procedimiento era un tanto complicado pero tenía la ventaja de que la imagen aparecería en todos los títulos por igual.

Este segundo truco, y no por ello, de menor importancia, posee otra notable característica, o más bien hace lo contrario que el anterior: aplica una imagen o un icono a los títulos escogidos (se hace "manualmente").

Bastará con abrir una entrada cualquiera y en el recuadro del título, incluir el código que contiene la imagen:



Código:

<img src="URL DE LA IMAGEN"/>

Reemplaza URL DE LA IMAGEN por la dirección de tu icono ^[+].

El lugar en el que insertes el código no importa, ya sea antes, después o entre el título.

Publica la entrada y listo.

Read More

Crea textos, banners, iconos y logos en segundos

Para aquellas personas que no se manejan con los programas de edición gráfica y quiere una herramienta sencilla, Cool Text les posibilita:

- Crear textos de forma personalizada con el estilo y la configuración que elijan

- Crear botones de forma personalizada con el estilo y configuración que elijan

- Descargar una serie de fuentes tipográficas, divididas por categorías, nombres y diseñador, para instalar en su sistema

Una vez creado el texto o botón, los usuarios podrán descargárselos en formato de imagen PNG, editarlos y, si disponen de cuenta de usuario, disponer del código html para situar en sus webs o enviarse los trabajos por correo electrónico. Las tipografías, por su parte, en general son True Type.

Enlace: Cool Text | Vía

Read More