Mil Trucos Blogger

Frases tuiteables en tus entradas de Blogger

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

Blogger se ha caracterizado por ser una plataforma muy flexible y hoy precisamente nos vamos a valer de esta flexibilidad para agregar frases tuiteables en tus entradas de Blogger, gracias a un servicio externo llamado Click to Tweet.

 Frases tuiteables en tus entradas de Blogger

Frases-Tuiteables-en-Blogger

Lo primero que debes hacer esa dirigirte a la web https://clicktotweet.com/basic y en el cuadro “Message you would like tweeted” escribes el mensaje que quieres (ten en cuenta que no debe superar los 140 caracteres) y luego dar clic en Generate New Link; después de esto pega el link que te dan en el edición html de una entrada.

El resultado será como el siguiente:

Consigue más trucos para tu blog en @MtrucosBlogger

 

Pero se puede personalizar agregando algo de CSS para que el resultado final sea como el siguiente:

 

 
El CSS utilizado (lo agregas antes de  ]]></b:skin> ) para darle estilo a la frase ha sido el siguiente:

.frasetwitterMTB{display:inline-block;width:90%;margin:10px;border:1px solid #d1d1d1;padding:20px;overflow:hidden;box-shadow:0 0 1px 1px rgba(230,230,230,1);border-radius:5px;}
.frasetwitterMTB a{display:block;float:right;margin:10px 0 0 0;padding:0 27px 0 0;background:url(https://lh6.googleusercontent.com/-am99nu4f2xI/VShTXVlEoVI/AAAAAAAAAs4/yHeBzcrYA3E/s16-no/twitter-bird.png)no-repeat center right;text-decoration:none;}

 

Aunque si quieres puedes añadir todo el CSS y el HTML en la entrada, en ese caso el código es el siguiente:

 <div class="frasetwitterMTB">
<a target="_blank" href="http://ctt.ec/2q80e">Tweet: Consigue más trucos para tu blog en @MtrucosBlogger</a></div>
<style type='text/css'>
.frasetwitterMTB{display:inline-block;width:90%;margin:10px;border:1px solid #d1d1d1;padding:20px;overflow:hidden;box-shadow:0 0 1px 1px rgba(230,230,230,1);border-radius:5px;}
.frasetwitterMTB a{display:block;float:right;margin:10px 0 0 0;padding:0 27px 0 0;background:url(https://lh6.googleusercontent.com/-am99nu4f2xI/VShTXVlEoVI/AAAAAAAAAs4/yHeBzcrYA3E/s16-no/twitter-bird.png)no-repeat center right;text-decoration:none;}
</style>

 

Ten en cuenta que lo resaltado en color verde es lo que corresponde al código que nos proporciona Click to Tweet; lo recomendable es registrarse en la web porque nos ofrece un informe completo de la actividad del enlace generado.

Espero que el truco de hoy les haya gustado y que le saquen provecho, pues es un buen tip de mucha utilidad.

Vía/Compartidisimo

0
Shares

Relacionados...

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Categorías

Síguenos en Facebook

Suscribete por Email

Introduce tu Correo:

Recibiras nuestros últimos posts en tu correo