Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. WordPress
Code

Botones de Facebook, Twitter y Chat en vivo: Creación de un sitio de WordPress con integraciones de comunicación social

by
Difficulty:IntermediateLength:LongLanguages:

Spanish (Español) translation by Eva Collados Pascual (you can also view the original English article)

No importa si bloguear es tu trabajo diario o un nuevo pasatiempo. Ya sea que acabes de lanzar tu startup y sueñes con hacerla grande "un día", o seas un negocio establecido con objetivos estrictos a cumplir este trimestre financiero, las redes sociales son una de las formas más efectivas para dirigir tráfico a tu sitio web.

Facebook, Twitter, LinkedIn, Instagram, Pinterest y la creciente lista de plataformas de redes sociales se han convertido en cruciales para generar ruido en torno a tus actividades online. Hoy en día, las redes sociales pueden ayudarte a conectar con un público completamente nuevo a diario, y es una herramienta vital para mantener el interés de tu actual público por el contenido que estés publicando.

En este tutorial, estaré cubriendo todas las principales maneras para añadir soporte de redes sociales en tu sitio web WordPress. Te mostraré cómo añadir botones para compartir en redes sociales que animen a los visitantes a distribuir tu contenido en todos los principales canales de redes sociales, así como contadores sociales para que los visitantes puedan seguir tus cuentas con solo hacer clic sobre un botón. Por último, te mostraré cómo interactuar con los visitantes de tu sitio web y nuevos potenciales clientes en tiempo real añadiendo un chat en vivo a tu sitio WordPress, incluido Facebook Live Chat.

Descargar el plugin Easy Social Share Buttons

En este artículo, añadiremos en nuestro sitio web diversos tipos de funcionalidad para compartir en redes sociales, usando el plugin Easy Social Share Buttons for WordPress.

Puedes comprar este plugin a través de CodeCanyon:

Cuando se te solicite, descarga el plugin. Cuando hayas descomprimido tu plugin, la carpeta resultante debería contener varios elementos, incluyendo un archivo zip easy-social-share-buttons, que cargarás en tu sitio WordPress.

Añadir un plugin de terceros en WordPress

Una vez tengas tu plugin, el siguiente paso es añadirlo en tu sitio web de WordPress:

  • Inicia sesión en tu instalación de WordPress, si aún no lo has hecho.
  • Selecciona Plugins en el menú izquierdo del escritorio de WordPress, y después Añadir nuevo.
  • Selecciona el botón Subir plugin.
  • Desplázate hasta la sección Si tienes un plugin en un archivo .zip, y selecciona Seleccionar archivo.
  • Selecciona el archivo easy-social-share-buttons.zip.
  • Selecciona Instalar ahora. El plugin Easy Social Share ahora se cargará en tu instalación WordPress.

Después de unos segundos, deberías ver el mensaje Plugin instalado correctamente. Haz clic en Activar plugin y un nuevo elemento Easy Social Share buttons aparecerá en el menú de la izquierda de WordPress.

Select Easy Social Share from WordPress left-hand menu

Dale un clic al menú Easy Social Share Buttons y se te pedirá que participes en un breve tutorial de introducción. La mayor parte de la información de este tutorial se explica bastante por sí sola, no obstante solo tardarás unos minutos en completarlo, por lo que se recomienda que lo consultes.

Aumentar la participación en las redes sociales

Por defecto, este plugin proporciona botones de compartir en redes sociales para todas las redes sociales más populares.

Select Easy Social Shares Buttons from the left-hand menu to access the plugins settings

Cuando un usuario hace clic en uno de estos botones, normalmente el plugin generará una publicación que contiene el título de la página, la URL y un fragmento del contenido de esa página, aunque esto puede variar dependiendo de la red social en cuestión. El usuario puede publicar este contenido en su plataforma de redes sociales preferida, con tan solo un clic sobre un botón.

Estas publicaciones en redes sociales generadas automáticamente no siempre representan el contenido de tu sitio de la mejor manera. Por ejemplo, imagina que acabas de publicar un blog y deseas generar un poco de ruido en Twitter. Podrías usar el botón estándar Post to Twitter, ¡pero los tweets generados por este botón predeterminado no están exactamente optimizados para alentar la participación del usuario!

You can add a basic Post to Twitter button to your WordPress website

Puedes animar a más personas a interactuar con este tweet añadiendo hashtags o etiquetando a algunas partes relevantes.

En esta sección, te mostraré cómo añadir botones para compartir en redes sociales a tu sitio web y, a continuación, exploraremos distintas formas en las que puedes modificarlos para que las publicaciones generadas en las redes sociales sean más atractivas.

Añadir en tu sitio web botones para compartir en redes sociales

Empecemos agregando algunos botones básicos para compartir en redes sociales a nuestro sitio web:

  • Si aún no lo has hecho, selecciona Easy Social Share Buttons en el menú izquierdo de WordPress.
  • Seleccione Networks.
Navigate to Easy Social Share Buttons Networks
  • Desplázate hasta la sección Social Networks.

Ahora deberías ver todas las plataformas de redes sociales que aparecerán en tu sitio web una vez hayas habilitado los botones para compartir en redes sociales.

Varias de las plataformas de redes sociales más comunes aparecen seleccionadas por defecto, pero puedes eliminar cualquiera de estos sitios seleccionando el botón X que las acompaña. Para mostrar botones para cualquier plataforma de redes sociales adicional, selecciona Add More Networks y, a continuación, selecciona las redes que desees en la siguiente ventana.

Choose from the available social networks including Buffer Tumblr Gmail and Flattr

Una vez estés satisfecho con tu selección, abre la pestaña Additional Network Options. Aquí, podrás personalizar las publicaciones que serán generadas por cada botón, modificar la apariencia y la ubicación del botón, y realizar cualquier otra configuración extra necesaria para integrarse con esta red social concreta.

En las siguientes secciones, te mostraré cómo configurar y personalizar los botones para compartir redes sociales de Twitter y Pinterest, pero los pasos son en gran medida similares para la mayoría de las otras redes sociales.

Cómo añadir el botón de Twitter a WordPress

De forma predeterminada, el botón Post to Twitter creará un tweet que incluye el título de la página, la URL y una vista previa del contenido de esa página. Sin embargo, a menudo aumentarás la participación de los usuarios si agregas hashtags y potencialmente algunos nombres de usuarios relevantes en cada tweet.

Comencemos modificando nuestros tweets generados de manera que incluyan un hashtag y un nombre de usuario de Twitter:

  • Selecciona la pestaña Additional Network Options, si aún no lo ha hecho.
  • Selecciona la siguiente tarjeta Twitter: Configure additional options for this network. Si no ves esta tarjeta, vuelve a Easy Social Share > Networks y asegúrate de haber seleccionado Twitter.
Select the Twitter Configure additional options for this network card

Ahora puedes añadir nombres de usuario de Twitter y hashtags a tus tweets:

1. ¡No olvides etiquetarte a ti mismo!

Cada vez que alguien haga clic sobe el botón Post to Twitter en tu sitio web, podrás etiquetar a una o más cuentas de Twitter en el tweet generado. La mayoría de las veces, querrás etiquetarte usando tu propio nombre de usuario de Twitter, para que cualquier persona interesada en conocerte mejor pueda hacer clic para dirigirse a tu cuenta de Twitter y empezar a seguirte.

Si quieres, también podrás etiquetar a terceros, lo que puede ser útil si estás afiliado a cualquier otra cuenta de Twitter, o si estás tratando de llamar la atención de una cuenta relevante que pueda estar interesada en tu contenido. Si etiquetas a un tercero, simplemente ten en cuenta que como resultado podrías recibir docenas o incluso cientos de tweets similares al día, algo que en potencia puede llegar a ser muy molesto, ¡muy rápidamente!

Para incluir un nombre de usuario en tus tweets, busca el campo Username to be mentioned y, a continuación, escribe el nombre de usuario de Twitter en cuestión, sin añadir un símbolo "@" de la arroba.

2. Conecta con un nuevo público a través de hashtags

Si añades algunos hashtags relevantes podrás exponer tu sitio web ante un público mucho más amplio, lo que podría hacerte ganar más clics, nuevos seguidores en Twitter y más interacciones en forma de "me gusta" y retweets.

Para empezar, identifica uno o más hashtags que sean relevantes para tu sitio web, o crea un hashtag propio, por ejemplo, convirtiendo el nombre de tu sitio web en un hashtag.

A continuación, busca el campo Hashtags to be added e introduce el o los hashtags elegidos, sin el símbolo de la almoadilla "#". Si quieres usar varios hashtags, tendrás que separarlos mediante una coma, por ejemplo: wordpress, tutorial, socialmedia.

You can add hashtags to your automatically-generated Tweets

La desventaja es que estos hashtags se incluirán en cada tweet que se genere a través del botón Post to Twitter de tu sitio web, por lo que no estarán creados pensando exclusivamente en una página concreta de tu sitio web.

Si deseas utilizar distintos hashtags para diferentes páginas, una posible solución consiste en aprovechar las etiquetas de WordPress. Probablemente habrás notado como cada vez que creas una nueva publicación en WordPress tienes la opción de agregar etiquetas.

Every time you create a new WordPress post youll have the option to Add New Tag

Puedes configurar el plugin Easy Social Sharing para que use estas etiquetas de WordPress como hashtags para Twitter. Cada vez que un usuario intente compartir una página específica, Easy Social Share generará un tweet con todas las etiquetas de WordPress que tenga asignada esa página, formateadas como hashtags.

Si bien esto puede crear hashtags más específicos y únicos, requiere que cambies la forma en que creas tus etiquetas en WordPress. En lugar de etiquetar cada nueva publicación con tantas etiquetas de WordPress relevantes como sea posible, tendrás que limitarte a asignar solo una o dos etiquetas por entrada, para evitar generar tweets consistentes en docenas de hashtags.

Si crees que este enfoque podría funcionar en tu sitio web, busca el control deslizante Use post tags as hashtags y ajústalo a la posición On.

¿Qué sucede si mis tweets superan el límite de 280 caracteres de Twitter?

Twitter tiene un límite de 280 caracteres, lo cual puede, en ocasiones, ser problemático. Tal vez agregues una etiqueta de WordPress adicional a una entrada, o publiques una entrada en tu blog con un título inusualmente largo, en estos escenarios, Easy Social Share podría comenzar a generar tweets que excedan el límite de 280 caracteres.

Para asegurarte que estos tweets siguen siendo atractivos, es importante que especifiques cómo debe truncar estos mensajes Easy Social Share.

Empieza encontrando el control deslizante Twitter message optimization: Activate y empújalo a la posición On.

El plugin Easy Social Sharing ofrece varias opciones para reducir el número de caracteres en un tweet, así que abre el menú desplegable adjunto y revisa los siguientes métodos:

  • Remove hashtags, remove via username, truncate message
  • Remove via username, remove hashtags, truncate message
  • Remove via username, truncate message
  • Remove hashtags, truncate message
  • Truncate only message

Imaginemos que seleccionas Remove via username, remove hashtags, truncate message. Si un tweet supera el límite de 280, Easy Social Sharing comenzará eliminando cualquier nombre de usuario incluido en el texto del tweet, pero si el tweet todavía es superior a 280 caracteres, también eliminará los hashtags, y luego potencialmente truncará el texto del mensaje, hasta que el tweet alcance los 280 caracteres o menos.

Como regla general, truncar el texto del mensaje siempre debe ser el último recurso, por lo que a menos que tengas una razón específica para no hacerlo, se recomienda que selecciones Remove hashtags, remove via username, truncate message o Remove via username, remove hashtags, truncate message.

Si el mensaje se trunca, a veces puede aparecer como si el usuario hubiese dejado de escribir la mitad de la frase al azar. Para evitar cualquier confusión, también debes habilitar Add read more dots when truncate message, lo que añadirá ... al final de cada mensaje truncado.

¿Has terminado de editar los ajustes para Twitter?

Cuando estés satisfecho con los cambios que has realizado, haz clic en el botón rojo Update Settings. Ahora, si te diriges a cualquier página de tu sitio web y haces clic en el botón para compartir en redes sociales de Twitter, aparecerá un nuevo tweet en una ventana emergente, listo para que lo compartas con tus seguidores de Twitter.

Select your websites Twitter button and itll generate a Tweet complete with hashtags and usernames

Promocionar tu sitio web WordPress con Pinterest

Pinterest es una plataforma de redes sociales que permite a los usuarios pinear el contenido que ellos consideren importante, creando tableros temáticos en los que cada pieza de contenido esté representada visualmente, mediante una imagen o un GIF pineados.

Cuando añadas soporte de Pinterest en tu sitio web, los visitantes podrán pinear las páginas de tu web que deseen, para tenerlas siempre a mano. Este contenido también aparecerá en el feed del usuario, donde será visible para todos sus seguidores de Pinterest, que podrán repinear este contenido o hacer clic para ir a tu sitio web.

En esta sección, explicaré algunas distintas formas de ajustar el botón Pinterest de Easy Social Share. Al final de esta sección, habrás modificado el tipo de imágenes que los usuarios pueden pinear, y crearás un botón flotante de Pinterest que aparecerá cada vez que un usuario pase el cursor sobre cualquiera de tus imágenes.

¡Mis cambios no aparecen!

A veces, los cambios que realices a través de Easy Social Share no serán accesibles hasta después de haber borrado la caché.

Dependiendo de cómo esté configurada tu instalación de WordPress, el proceso para borrar la caché puede variar, pero normalmente tendrás que hacer lo siguiente:

  • Elige Performance en la barra de menús de WordPress.
  • Selecciona Purge all caches.
You can empty WordPress cache by selecting Performance Purge all caches

Si esto no resuelve tu problema, es posible que también debas borrar la caché de tu navegador web realizando una recarga dura, a veces conocida como una actualización dura.

Los pasos difieren entre navegadores. Por ejemplo, si estás usando Chrome, puedes realizar una recarga dura con cualquiera de los siguientes métodos abreviados de teclado: Control-Mayús-RMayús-F5, o puedes mantener presionada la tecla Mayús mientras presionas el botón de recarga estándar de Chrome. Si no estás seguro de cómo realizar una recarga dura, la documentación de tu navegador web debe tener toda la información que necesitas.

Alternativamente, si has añadido un plugin específico para el almacenamiento en caché en tu instalación WordPress, puedes usar este plugin para borrar la caché. Normalmente encontrarás los ajustes de caché específicos del plugin seleccionando Performance en la barra de herramientas de WordPress y luego buscando cualquier sección que contenga la palabra cache.

Controla las imágenes que tus visitantes pueden pinear

Una vez hayas añadido un botón de Pinterest a tu sitio web, los visitantes podrán pinear tus páginas web utilizando cualquiera de las imágenes disponibles en esa página en particular. Por ejemplo, si una página web contiene dos imágenes, los visitantes pueden hacer clic en el botón Pinterest y, a continuación, elegir pinear cualquiera de esas imágenes.

Alternativamente, puedes ajustar la configuración de Pinterest para favorecer la imagen destacada de una página. Imagina que tienes una página web que consta de dos imágenes "estándar" y una imagen destacada; con esta configuración habilitada, el usuario solo podrá pinear la imagen destacada. Este comportamiento puede ser útil si tu sitio web contiene mucho contenido de terceros. Por ejemplo, tal vez promociones productos como parte de un programa de afiliados de Amazon y desees asegurarte de que tus visitantes solo pinean imágenes que representan el contenido original de tu sitio web.

Si habilitas esta función, los usuarios seguirán teniendo la opción de pinear imágenes "estándar" para las páginas que no contengan ninguna imagen destacada.

Para favorecer las imágenes destacadas:

  • Si aún no lo has hecho, dirígete a Easy Social Share > Networks y asegúrate de que la pestaña Social Networks esté seleccionada.
  • Selecciona la siguiente tarjeta: Pinterest: Configure additional options for this network.
  • Busca la sección Disable Pinterest Pin any image y coloca su control deslizante en la posición Yes.
  • Cuando estés satisfecho con los cambios, haz clic en el botón Update Settings.

Fija un Pin en él: Añadir un botón flotante de Pinterest

Puedes facilitar el pineo de contenido a los visitantes mediante la creación de un botón de pin flotante. Este botón aparecerá automáticamente, siempre que el usuario coloque el cursor sobre cualquier imagen.

Add a floating Pin button to your website

Para añadir este botón flotante:

  • En el menú de la izquierda de WordPress, selecciona Easy Social Share Buttons.
  • Selecciona Social Sharing, y a continuación Pinterest Pro.
  • Busca la sección Image Pin Button On Hover y arrastra el control deslizante que lo acompaña a la posición Yes.

En este punto, hay muchas maneras de ajustar la apariencia del botón. La mayoría de estos ajustes se explican bastante bien por sí solos, pero para empezar es posible que desees considerar los siguientes:

  • Buttons style. Elige entre mostrar el logotipo P, simplemente el texto Pin sin formato o una combinación de ambos.
Select a style for your Pinterest button
  • Change the button’s size. Tus opciones para el tamaño del botón van desde XS a XXL.
  • Position over image. Especifica dónde debe aparecer el botón Pin flotante. Yo prefiero mostrar este botón en el centro de la imagen en lugar de cerca de cualquiera las esquinas, ya que esto hace que el botón sea más fácil de detectar, especialmente en las imágenes más grandes que no encajan perfectamente en la pantalla.

Cuando estés satisfecho con los cambios, haz clic en el botón Update Settings. Para probar tu botón Pinterest, ve a cualquier página que contenga una imagen e intenta pasar el cursor sobre ella: debería aparecer un botón de Pinterest, listo para que pinees esa imagen en particular.

Crear tu propias descripciones para Pinterest

Si habilitas el botón flotante pin, Pinterest usará el texto alternativo de cada imagen como su descripción predeterminada en Pinterest.

Al modificar el texto alternativo de una imagen, puedes ayudar a garantizar que el contenido pineado resulte atractivo, lo que aumenta las posibilidades de que este sea repineado y aumentar los ratios de clics sobre ella.

Si has activado el botón flotante, vale la pena que revises el Texto alternativo adjunto a cada una de las imágenes de tu sitio web:

  • Navega a una página que contenga una imagen y ábrela para editarla, como de costumbre.
  • Selecciona la imagen en cuestión y, a continuación, haz clic en el icono Editar imagen que la acompaña.
  • En la ventana siguiente, busca el campo Texto alternativo. Este es el texto que se incluirá cada vez que alguien intente pinear esta imagen concreta, realiza los cambios que desees.
You can add Alt text to any image you upload to WordPress

Aumenta tus seguidores en redes sociales

Hay dos elementos principales en cualquier estrategia de redes sociales exitosa: animar a que las personas compartan tu contenido a través en las redes sociales, y adquirir nuevos seguidores.

Easy Social Share puede ayudarte a aumentar el número de seguidores en tus redes sociales, a través de contadores de seguidores. Estos contadores forman parte de una barra lateral, que muestra el número de personas que actualmente ya te están siguiendo en cada una de tus cuentas de redes sociales.

Add a follower counter button to your WordPress account

Cada vez que un usuario interactúe con uno de estos botones, será dirigido a la cuenta de redes sociales correspondiente, donde podrá revisar tu actividad en redes sociales, y si hay suerte, presionará ese botón Seguir.

Para añadir uno o más contadores de seguidores a tu sitio web:

  • En el menú de la izquierda de WordPress, selecciona Easy Social Share Buttons.
  • Selecciona Social Follow & Chat > Social Followers Counter.
  • Ajusta el control deslizante Activate Social Followers Counter a la posición On.
  • Desplázate hasta la sección Social Networks y selecciona todos los contadores que quieras añadir a tu sitio web.
  • Una vez estés satisfecho con tu selección, haz clic en el botón rojo Update Settings.

A continuación, debes activar cada una de las cuentas de redes sociales que acabas de seleccionar. En el menú de la izquierda de WordPress, selecciona Social Follow & Chat > Social Followers Counter > Social Networks.

En esta pantalla, verás una tarjeta representando a cada una de las cuentas de redes sociales elegidas. Haz clic en cada tarjeta y a continuación, introduce la información solicitada. Por ejemplo, si acabas de habilitar el contador de seguidores para Facebook, tendrás que proporcionar el ID de tu página de Facebook (si no estás familiarizado con los ID de página, lo veremos en la siguiente sección).

Algunas redes te dan la opción de personalizar la apariencia del contador de seguidores, por ejemplo, cambiando su texto o icono. Invierte algo de tiempo explorando las opciones disponibles, hasta que estés satisfecho con el aspecto de tu botón.

  • Cuando estés satisfecho con la información que has introducido, haz clic en Update Settings.
  • A continuación, ve a Social Follow & Chat > Social Followers Counter > Follow Me Sidebar.
  • Busca el control deslizante Display Social Followers As Sidebar y empújalo en la posición On.

Ahora puedes configurar cómo aparecerá esta barra lateral en tu sitio web. La mayoría de estas opciones se explican bastante bien por sí solas. Por ejemplo, puedes cambiar dónde aparece la barra lateral (Choose position on screen) y si el contador de seguidores se anima cuando el usuario pasa el cursor sobre ella (Apply Animation), así que dedica algún tiempo explorando estas opciones.

Cuando estés satisfecho con la configuración de la barra lateral, haz clic en el botón Update Settings. Ahora debería aparecer una barra lateral de seguidores en tu sitio web.

Cómo añadir un chat en vivo en tu sitio web

Cada vez más, las personas esperan una respuesta instantánea a sus preguntas y quejas, especialmente cuando se comunican online. Si bien los clientes potenciales podrían ponerse en contacto contigo enviando un tweet o publicando en tu página de Facebook, a menudo esto implica un retraso de tiempo que puede dar como resultado el que una sencilla interacción tipo preguntas y respuestas se demore horas, o posiblemente incluso días en completarse.

En esta sección final, cubriré dos medios para interactuar con los visitantes y clientes potenciales en tiempo real, añadiendo funcionalidad de chat en vivo a tu sitio web.

Configurar Facebook Live Chat

Facebook Messenger es un popular medio para mantenerse en contacto con amigos y familiares. Si estás frente al ordenador, puedes dejar Facebook Messenger ejecutándose en tu navegador web y responder a nuevos mensajes a medida que vayan entrando. Si necesitas alejarte de tu escritorio, puedes seguir estando al corriente de tus mensajes instalando la aplicación Facebook Messenger en tu smartphone o tablet.

Al añadir Facebook Live Chat a tu sitio web, podrás comunicarte con los visitantes y clientes potenciales con la misma facilidad con la que chateas con tus amigos de Facebook.

El principal inconveniente es que no puedes conectar Facebook Live Chat a un perfil personal, por lo que tendrás que tener una página de Facebook que puedas asociar a tu sitio web. Si aún no lo has hecho, primero puedes crear una página de Facebook (¡o podrías pasar a la siguiente sección y averiguar cómo agregar Skype a tu sitio web en su lugar!)

Crear un ID de aplicación de Facebook

Para activar Facebook Live Chat, deberás proporcionar un ID de aplicación de Facebook. Vamos a generar este ID ahora:

  • Dirígete al sitio web de Facebook for Developers.
  • Cuando te lo soliciten, inicia sesión con tu nombre de usuario y contraseña de Facebook.
  • Selecciona el botón Crear una aplicación.
Head over to the Facebook for Developers website and click Add a New App
  • Introduce el nombre que se mostrará, que es el nombre que quieras asociar a tu aplicación de Facebook.
  • Introduce tu dirección de correo electrónico.
  • Haz clic en Crear identificador de la aplicación.

Después de unos momentos, serás dirigido al panel de la aplicación que acabas de crear. Busca tu ID de aplicación en la esquina superior izquierda y anótala, ya que la necesitarás en breve.

Editar la configuración de tu página de Facebook: Añade tu sitio WordPress a la lista blanca

También necesitamos realizar algunos cambios en la configuración de nuestra página de Facebook:

  • Inicia sesión en tu cuenta de Facebook.
  • En el menú de la izquierda, selecciona Páginas.
  • Asegúrate de que la pestaña Tus páginas esté seleccionada y, a continuación, selecciona la página que quieres vincular a tu instalación de WordPress.
  • Selecciona Configuración en la barra de menús.
  • En el menú de la izquierda, haz clic en Plataforma de Messenger.
  • Desplázate a Dominios de la lista de autorizados y copia/pega tu URL de WordPress en este campo.
  • Haz clic en Guardar.

Mientras tengamos nuestra página de Facebook abierta, tomemos nota de su ID, ya que necesitaremos esta información más adelante:

  • En el menú de la izquierda de Facebook, selecciona Acerca de.
  • Desplázate hasta la parte inferior de la pantalla y verás una sección de ID de página. Toma nota de esta información.

Activar el chat en vivo de Facebook Messenger

Ahora podemos activar la función de chat en vivo:

  • Dirígete a tu instalación de WordPress.
  • Selecciona Easy Social Sharing Buttons > Social Follow & Chat en el menú izquierdo de WordPress.
  • Selecciona Facebook Messenger Live Chat.
  • Encuentra la siguiente sección: Activate Display Of Facebook Messenger Customer Live Chat. Empuja el control deslizante que lo acompaña a la posición On.
  • A continuación, introduce el ID de tu página en el campo Facebook Page ID.
  • Busca el campo Facebook Application ID e introduce el ID de la aplicación de Facebook que creaste en la consola de Facebook for Developers.

Ahora tienes la opción de ajustar la apariencia y el comportamiento de Facebook Live Chat de muchas maneras diferentes. Por ejemplo, puedes restringir la función del Chat de manera que solo aparezca en determinadas páginas de tu sitio web, utilizando Appear only on selected post types.

También es posible que desees saber si has recibido cada mensaje correctamente, incluso aunque no estés disponible para responder en persona, mediante la creación de una respuesta automatizada usando Logged in users greeting o Logged out users greeting.

La mayoría de estos ajustes son bastante auto-explicativos, por lo que vale la pena pasar algún tiempo perfeccionando la forma en la que aparecerá Facebook Live Chat y en cómo funcionará en tu sitio web en particular.

Cuando estés satisfecho con la información que has introducido, haz clic en el botón rojo Update Settings.

Poner el chat en vivo en modo de prueba

Ahora podemos probar la nueva función de chat en vivo de Facebook de nuestro sitio web:

  • Navega a cualquier parte de tu sitio web que esté configurada para mostrar Facebook Live Chat, si todo está correcto, debería aparecer en pantalla la conocida burbuja de Facebook Messenger.
  • Dale un clic a la burbuja para abrir la interfaz de usuario de Facebook Live Chat.
Engage with your customers in real time with Facebook Live Chat
  • En este punto, es posible que se te pida que Continue as... seguido del nombre asociado a tu cuenta de Facebook; haz clic en Continue as…
  • Escribe el mensaje en la ventana de chat y, a continuación, haz clic en Send.
  • En una pestaña independiente, dirígete a Facebook e inicia sesión en tu cuenta de Facebook.
  • Facebook ya debería mostrar una nueva notificación de mensaje; ábrelo y verás el texto que acabas de introducir en tu sitio web.

Para enviar una respuesta, simplemente escribe tu mensaje de forma normal y, a continuación, haz clic en Send. Vuelve a tu instalación de WordPress, y esta respuesta debería haber aparecido en la interfaz de usuario de Facebook Live Chat, exactamente como si estuvieras hablando con un tercero.

Cómo incrustar Skype en tu sitio web de WordPress

El principal inconveniente de Facebook Live Chat es que para usarlo debes tener una página de Facebook. Si quieres agregar una función de chat a tu sitio web pero no quieres configurar una página de Facebook, puedes usar Skype Live Chat en su lugar.

Para agregar Skype a tu sitio web:

  • En tu instalación de WordPress, ve a Easy Social Sharing Buttons > Social Follow & Chat.
  • En el menú de la izquierda, selecciona Skype Live Chat.
  • Lleva el control deslizante Activate Display Of Skype Live Chat a la posición On.
  • Decide si deseas que Skype Live Chat solo aparezca en determinadas páginas, utilizando la sección Appear only on selected post types.
  • Selecciona el estilo de botón de chat que deseas usar: Chat Bubble o Rounded Button with Text. Si opta por el estilo Rounded Button, podrás proporcionar un texto que se mostrará como parte de esta burbuja, utilizando el campo Custom chat button text.
  • Por último, necesitarás conectar tu sitio web de WordPress a tu cuenta de Skype, escribiendo tu ID de Skype en el campo Your Skype User ID.
  • Una vez estés satisfecho con la información que has introducido, haz clic en el botón rojo Update Settings.

Ahora, dirígete a cualquier parte de tu sitio web que admita Skype Live Chat, y deberías ver aparecer la burbuja del chat de Skype  en pantalla. Cualquier persona que esté visitando tu sitio web podrá ahora hacer clic en este botón, ingresar su nombre de usuario y contraseña de Skype, e intercambiar mensajes con el ID de Skype que esté asociado a tu instalación de WordPress.

Embed Skype in your WordPress website

Conclusión

En este tutorial, te mostré cómo ganar seguidores en las redes sociales y aumentar la participación de los usuarios en todas las principales plataformas de medios, usando Easy Social Share Buttons para WordPress. Hemos visto cómo puedes hacer que tu sitio web de WordPress sea más amigable con las redes sociales mediante la adición de botones para compartir el contenido y contadores de seguidores, y cómo puedes conectar con los visitantes de tu sitio web en tiempo real, a través de los chats en vivo de Facebook y Skype.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.