Hacker of the Web
Tus ideas en código!...y mas

Blogger: Sustituir el nombre del autor con una imagen

Colocar una imagen con la firma personalizada del autor en vez del clásico nombre del autor por la cuestión que se te ocurra, puede ser atractiva a la vista de nuestros lectores además de poder poner en la imagen lo que mejor te parezca.

Pero si no sabes bien como crear tu firma o que ponerle. Aqui te dejo algunas herramientas que te pueden resultar interesantes:

Cool Text
Cool Text

Potente herramienta donde puedes escoger el tipo de texto, despues puedes personalizarlo de la manera en que tu quieras, me parecio muy buena esta herramienta.

3D Text Marker
3D Text Marker

Esta otra exelente herramienta permite escoger muchisimos tipo de letras, asi como el color de la misma y otros parametros avanzados. Muy buena!

Xara
Xara

Simple pero efectiva, con ella puedes escoger diferentes tipos de letras, colores y estilos. Pudiendo así crear la apropiada para tu sitio.

ImageChefImageChef

Para usar esta herramienta debes escoger el tipo de imagen que desees crear. Luego de eso escribes el texto y haces click en el botón anaranjado "Visualizar"

HTML Live
HTML Live

Solo colocas los parametros a tu gusto y te retornará una imagen.

Glitter Marker
Glitter Marker

La imagen habla por si sola, cabe rescatar que el circulo del tercer paso hay que dar clic en el color que queramos.

Glitter Kiss
Glitter Kiss

Aqui solo escoges el color de la letra que te paresca mas apropiada, despues escoges el tipo de letra que mas te guste, escribes el texto en la caja de texto "Type Letters". Luego de todo eso das clic en "Create The Image".

Kessels
Kessels

Escribe el texto que quieras, despues haces click en "Make Chlocolate!". Una vez creado teclea "Impr Pant" para tomar una captura de pantalla. La pegas y guardas con paint.

Flaming Text
Flaming Text

Otra buen herramienta, crea texto animado con efecto de llamas en las letras. My Live Signatures Con esta herramienta puedes crear de diferentes maneras tu firma. Es recomendable comenzar con la primer opcion.

Despues de crear satisfactoriamente tu firma, ahora hay que colocarla. Para esto implementaremmos alguna variables de Blogger y algunas condiciones.

[1] Entra en el panel Diseño>Edicion HTML>Expandir PLantillas de artilugios

[2] Busca con Ctrl + F "post-author vcard", sin las comilllas y verás algo como esto:
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<span class='fn'><data:post.author/></span>
</b:if>
</span>

[3] Que tenemos que modificar de la siguiente manera:
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<b:if cond='data:post.author != "{AUTOR}"'>
<span class='fn'>
<img expr:alt='data:post.author' expr:title='data:post.author' src='{URL DE TU IMAGEN}' style='margin:none !important;padding:none !important;border:none !important;'/>
</span>
</b:if>
</b:if>
</span>
Pero si tenemos mas de una autor en el blog podemos agregar a los demas de la siguiente manera:
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<!-- Autor 1 -->
<b:if cond='data:post.author != "{AUTOR}"'>
<span class='fn'>
<img expr:alt='data:post.author' expr:title='data:post.author' src='{URL DE TU IMAGEN}' style='margin:none !important;padding:none !important;border:none !important;'/>
</span>
</b:if>
<!-- Autor 2 -->
<b:if cond='data:post.author != "{AUTOR}"'>
<span class='fn'>
<img expr:alt='data:post.author' expr:title='data:post.author' src='{URL DE TU IMAGEN}' style='margin:none !important;padding:none !important;border:none !important;'/>
</span>
</b:if>
<!-- Autor 3 -->
<b:if cond='data:post.author != "{AUTOR}"'>
<span class='fn'>
<img expr:alt='data:post.author' expr:title='data:post.author' src='{URL DE TU IMAGEN}' style='margin:none !important;padding:none !important;border:none !important;'/>
</span>
</b:if>
</b:if>
</span>

Cambiando {AUTOR} por tu nick o por el de otra persona.
Y {URL DE TU IMAGEN} por la Url de la imagen que quieras

#

Deja tu huella y comenta!

Hola!, por favor deja tus comentarios, te aseguro serán contestados, dudas, sugerencias, lo que sea!!!!!!!!!!.

Si el formulario no funciona, o quieres irte a la segura: agrega tu comentario de forma tradicional

Si necesitas ayuda mas personalizada deja un <a href='URL'>ENLACE</a> hacia tu blog.

Emoticons
Comenta con tu:
Comenta:

6 comentarios !

Carlos dijo...

Muchas gracias, me ha servido de mucho, porque otros blogs no explicaban como ponerlo si eran varios autores

SäNTÿ dijo...

Carlos, que excelente que te pudiera servir xD!!

Seroc dijo...

Me a costado lo mio, hasta que he puesto el nombre sin mayúsculas...xD

Gracias por el buen aporte...^^

Fabian Olivas dijo...

No me resulta, en parte si se ven la imagenes pero pongo los otros autores y aparecen juntas todas las imagenes, a todo esto es un blog de tumblr que lo pruebo

Fabian Olivas dijo...

Lo hice pero en un bloger de tumblr y no resulta, osea en parte si se ve la imagen pero se ven todos los autores que pongo no solo el que lo reblogea o publica

Tomás Briones M dijo...

Se que el post es antiguo pero ¿en donde sale autor pongo el nombre en google+ o el nick que se usaba antes en blogger?


Página Principal
Arriba