Cómo compartir tu blog por Messenger, Whatsapp o Telegram

30.4.18

Coding

Los botones para compartir son una excelente manera de brindar a tus lectores la opción de viralizar tu contenido, y así puedas aumentar el alcance de tu sitio.

Existen servicios que mediante pocos clicks te brindan una botonera de rápida inclusión en tu panel (algunos hasta agregan el gadget por ti). Desafortunadamente, la mayoría de estos tiene personalización limitada e incluso pueden requerir la carga de scripts externos.

Por ello es más recomendable optar por la botonera HTML: más personalizable, mejor desempeño, total control de tu parte. La mayoría de temas pre-diseñados ya le incluyen para las redes sociales.

Lo que haré hoy es compartirte los enlaces para añadir los servicios de mensajería más usados: Messenger, Telegram y Whatsapp.


Cómo compartir tu blog por Messenger, Whatsapp o Telegram

Messenger

<a class='solocel' alt='Compartir por Messenger' expr:href='&quot;fb-messenger://share/?link=&quot; + data:post.url.escaped + &quot;&amp;app_id=123456789&quot;'>
MESSENGER
</a>

Whatsapp

<a class='solocel' alt='Compartir por WhatsApp' data-action='share/whatsapp/share' expr:href='&quot;whatsapp://send?text=" + data:post.title + "-" + data:post.url'>
WHATSAPP
</a>

Telegram

<a class='solocel' alt='Compartir por Telegram' expr:href='&quot;whatsapp://send?text=" + data:post.title + "-" + data:post.url'>
TELEGRAM
</a>


Observaciones

Cada enlace está listo para compartir la url de tu entrada, sólo tienes que añadirle justo con el resto de botones en tu tema y asegurarte de implementar las mismas clases CSS, así como el ícono o frase que visualizarán los lectores.

Si tienes dudas de donde incorporar los botones, es buena idea localizar en tu tema, en la Edición HTML, la palabra sharer que es parte del enlace para compartir en Facebook.

He añadido a cada enlace la clase .solocel que condiciona su aparición solamente en dispositivos móviles, ya que no funcionan si se usan desde una computadora de escritorio o una tablet.

Si ya tienes una clase en tu tema de similar funcionamiento, puedes bien sustituirle.

Aquí tienes el CSS antes mencionado para añadir dentro de b:skin:
.solocel {
display:none;
}
@media screen and (max-width:767px){
.solocel {
display:inline-block!important;
}
}

¿No quieres complicarte? Puedes contactarme por el Servicio Express y elaboraré la botonera para tu sitio, con tu estilo y en un par de horas.


Si quieres ver lo bien que funcionan los botones, sencillamente comparte este post a uno de tus contactos de mensajería, siempre que estés leyéndome desde tu móvil claro está, y así me ayudas a llegar a más personas 😉.






yo, cyball

Escrito por Cyball Ruiz

Creadora de ANMATT Studio donde encuentras recursos y consejos para tu espacio en Blogger.






Otros artículos...