{"id":19566,"date":"2025-04-16T09:00:19","date_gmt":"2025-04-16T09:00:19","guid":{"rendered":"https:\/\/elfsight.com\/es\/?p=19566"},"modified":"2025-10-31T09:23:26","modified_gmt":"2025-10-31T09:23:26","slug":"how-to-embed-floating-whatsapp-button-to-website","status":"publish","type":"post","link":"https:\/\/elfsight.com\/es\/blog\/how-to-embed-floating-whatsapp-button-to-website\/","title":{"rendered":"C\u00f3mo incrustar un bot\u00f3n flotante de WhatsApp en el sitio web html"},"content":{"rendered":"\n<div class=\"table-of-contents\">\r\n\t\t\t<div class=\"table-of-contents-title\">Contents<\/div>\r\n\t\t\t<ol class=\"table-of-contents-list\">\n<li class=\"table-of-contents-list-item\"><a href=\"#about-widget\" data-scroll-to=\"about-widget\">Acerca del plugin del bot\u00f3n flotante de WhatsApp<\/a><\/li>\n<li class=\"table-of-contents-list-item\"><a href=\"#add-widget\" data-scroll-to=\"add-widget\">Agregar bot\u00f3n flotante de WhatsApp al c\u00f3digo HTML del sitio web<\/a><\/li>\n<li class=\"table-of-contents-list-item\"><a href=\"#how-embed\" data-scroll-to=\"how-embed\">C\u00f3mo a\u00f1adir el bot\u00f3n flotante de WhatsApp al sitio web<\/a><\/li>\n<li class=\"table-of-contents-list-item\"><a href=\"#use-cases\" data-scroll-to=\"use-cases\">Bot\u00f3n flotante de WhatsApp: casos de uso geniales<\/a><\/li>\n<li class=\"table-of-contents-list-item\"><a href=\"#benefits\" data-scroll-to=\"benefits\">Ventajas del bot\u00f3n flotante de WhatsApp<\/a><\/li>\n<li class=\"table-of-contents-list-item\"><a href=\"#conclusion\" data-scroll-to=\"conclusion\">Conclusi\u00f3n<\/a><\/li>\n<\/ol>\r\n\t\t<\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"about-widget\">Acerca del plugin del bot\u00f3n flotante de WhatsApp<\/h2>\n\n\n\n<p>\u00bfQuieres ampliar la funcionalidad de tu sitio web a\u00f1adiendo un bot\u00f3n flotante de WhatsApp, pero no sabes c\u00f3mo hacerlo? Aqu\u00ed algunas soluciones listas pueden ayudarte, por ejemplo, un plugin que se puede incrustar en el c\u00f3digo HTML de cualquier sitio web, desde WordPress y Squarespace hasta Shopify y Wix. Y podemos compartir esta soluci\u00f3n contigo. Estamos hablando del <a href=\"https:\/\/elfsight.com\/whatsapp-chat-widget\/\" target=\"_blank\" rel=\"noreferrer noopener\">bot\u00f3n flotante de WhatsApp<\/a> de Elfsight. Con la ayuda del plugin, puedes crear f\u00e1cilmente una ventana de chat para cualquier prop\u00f3sito en tu sitio web.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Comienza eligiendo una plantilla adecuada para el chat.<\/li>\n<li>Conecta tu perfil y personaliza la caja de chat.<\/li>\n<li>Obt\u00e9n el c\u00f3digo de tu widget de chat de WhatsApp.<\/li>\n<li>Incrusta el c\u00f3digo en tu sitio web.<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">\u00a1Crea tu bot\u00f3n flotante de WhatsApp aqu\u00ed mismo en unos pocos clics!<\/h3>\n\n\n<section class=\"application-demo header-blind-spot section\" id=\"demo\" data-nav-section=\"demo\"><div class=\"section-content\">\n                <div class=\"application-demo-container\">\n                    <div class=\"application-demo-iframe-container\">\n                        <div class=\"application-demo-control-enter-fullscreen application-demo-control\" title=\"Full Screen\">\n                            <svg>\n                                <use xlink:href=\"#icon-maximize\"><\/use>\n                            <\/svg>\n                        <\/div>\n\n                        <div class=\"application-demo-control-exit-fullscreen application-demo-control application-demo-control-hidden\" title=\"Exit Full Screen\">\n                            <svg>\n                                <use xlink:href=\"#icon-minimize\"><\/use>\n                            <\/svg>\n                        <\/div>\n\n                        <div class=\"application-demo-iframe-wrapper\">\n                            <iframe class=\"application-demo-iframe\" data-src=\"https:\/\/dash.elfsight.com\/demo\/whatsapp-chat?language=es_ES\" title=\"Agregue  a su sitio web \u00a1solo le tomar\u00e1 un minuto!\" frameborder=\"0\" name=\"preview\" loading=\"lazy\" allow=\"autoplay; fullscreen\"><\/iframe>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"add-widget\">Agregar bot\u00f3n flotante de WhatsApp al c\u00f3digo HTML del sitio web<\/h2>\n\n\n\n<p>Puedes crear f\u00e1cilmente un bot\u00f3n flotante de WhatsApp en unos pocos clics para a\u00f1adir al c\u00f3digo HTML de tu sitio web. HTML est\u00e1 ah\u00ed para ayudarte a crear un sitio web con cualquier objetivo. Y si crear el sitio no es tan dif\u00edcil, agregar algunos elementos adicionales como un <a href=\"https:\/\/elfsight.com\/whatsapp-chat-widget\/html\/\" target=\"_blank\" rel=\"noreferrer noopener\">bot\u00f3n flotante<\/a> puede requerir la ayuda de soluciones de terceros. Esto se puede hacer f\u00e1cilmente con nuestro configurador f\u00e1cil de usar. Veamos c\u00f3mo puedes hacerlo.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Crea una cuenta en Elfsight Apps e inicia sesi\u00f3n en el panel de administraci\u00f3n.<\/li>\n<li>Elige la plantilla flotante en el configurador y personal\u00edzala.<\/li>\n<li>Guarda tu bot\u00f3n de chat flotante.<\/li>\n<li>Copia el c\u00f3digo de instalaci\u00f3n que aparecer\u00e1 en el popup.<\/li>\n<li>Incrusta el c\u00f3digo del plugin en el lugar deseado de tu sitio web.<\/li>\n<\/ol>\n\n\n\n<p>\u00bfVerdad que fue bastante f\u00e1cil? Ahora, si deseas una gu\u00eda m\u00e1s visual sobre c\u00f3mo agregar el bot\u00f3n flotante de WhatsApp en el c\u00f3digo HTML de tu sitio, mira el siguiente video:<\/p>\n\n\n\n<div class=\"video-container\">\n<iframe width=\"720\" height=\"405\" src=\"https:\/\/www.youtube.com\/embed\/KGKbZEGQ-z8?si=NOzWNYWfQBMmQ_k8\" frameborder=\"0\" allowfullscreen=\"\"><\/iframe>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"how-embed\">C\u00f3mo a\u00f1adir el bot\u00f3n flotante de WhatsApp a WordPress y otras plataformas<\/h2>\n\n\n\n<p>WordPress es uno de los creadores de sitios web m\u00e1s populares del mundo, por lo que no es de extra\u00f1ar que muchos usuarios necesiten instrucciones sobre c\u00f3mo a\u00f1adir un bot\u00f3n flotante de chat al sitio web. Es realmente f\u00e1cil a\u00f1adir un bot\u00f3n de <a href=\"https:\/\/elfsight.com\/whatsapp-chat-widget\/wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">WhatsApp Chat en WordPress<\/a>. A continuaci\u00f3n, te mostramos c\u00f3mo hacerlo usando el editor nativo de WordPress. Ver\u00e1s lo f\u00e1cil que es <a href=\"https:\/\/elfsight.com\/blog\/whatsapp-live-chat-plugin-for-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">a\u00f1adir WhatsApp a WordPress<\/a>.<\/p>\n\n\n\n<p>Una vez que hayas creado y personalizado tu bot\u00f3n flotante de chat en el panel de administraci\u00f3n de Elfsight, incrusta el c\u00f3digo de instalaci\u00f3n en el campo HTML del panel de administraci\u00f3n de WordPress. \u00a1Es muy f\u00e1cil de hacer! Normalmente, debes a\u00f1adir el c\u00f3digo en una secci\u00f3n de C\u00f3digo HTML. As\u00ed es c\u00f3mo hacerlo:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Crea tu plugin de bot\u00f3n flotante de WhatsApp en el panel de administraci\u00f3n eligiendo la plantilla adecuada.<\/li>\n<li>Guarda los resultados y copia el c\u00f3digo de instalaci\u00f3n que aparece en una ventana emergente especial.<\/li>\n<li>Inicia sesi\u00f3n en tu panel de administraci\u00f3n de WordPress.<\/li>\n<li>Ve a la secci\u00f3n \u201cP\u00e1ginas\u201d y selecciona la p\u00e1gina donde deseas incrustar el bot\u00f3n.<\/li>\n<li>A\u00f1ade un bloque HTML personalizado en la parte requerida del sitio web.<\/li>\n<li>En este bloque HTML, inserta el c\u00f3digo del bot\u00f3n flotante que obtuviste en el generador de c\u00f3digo.<\/li>\n<li>Haz clic en \u201cActualizar\u201d para guardar todos los cambios.<\/li>\n<\/ol>\n\n\n\n<p>Puedes realizar todos los ajustes que desees en el panel de Elfsight y se reflejar\u00e1n en tu bot\u00f3n flotante. No es necesario realizar ning\u00fan cambio en el c\u00f3digo HTML de tu sitio de WordPress.<\/p>\n\n\n<div class=\"tip-yellow tip\">Obt\u00e9n m\u00e1s informaci\u00f3n sobre <a href=\"https:\/\/elfsight.com\/blog\/how-to-add-whatsapp-button-on-wordpress-website\/\" target=\"_blank\" rel=\"noopener\">c\u00f3mo a\u00f1adir WhatsApp a WordPress<\/a> y sus caracter\u00edsticas \u00fatiles.<br \/>\n<\/div>\n\n\n\n<p>Nuestro chat de WhatsApp tambi\u00e9n est\u00e1 disponible en otras plataformas, por ejemplo, <a href=\"https:\/\/elfsight.com\/whatsapp-chat-widget\/wix\/\" target=\"_blank\" rel=\"noreferrer noopener\">Wix<\/a>. Aqu\u00ed hay tutoriales sencillos para <a href=\"https:\/\/elfsight.com\/blog\/how-to-add-whatsapp-chat-to-wix-for-free\/\" target=\"_blank\" rel=\"noreferrer noopener\">a\u00f1adir tu app de chat a una p\u00e1gina espec\u00edfica en Wix<\/a>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Accede al creador de sitios Wix iniciando sesi\u00f3n en tu cuenta y seleccionando el sitio donde deseas ver nuestro plugin. Luego, haz clic en \u00abEditar sitio\u00bb.<\/li>\n<li>A\u00f1ade un bloque HTML haciendo clic en el \u00edcono de m\u00e1s, ve a la secci\u00f3n Insertar y selecciona \u00abInsertar un widget\u00bb en la pesta\u00f1a \u00abIncrustaciones personalizadas\u00bb.<\/li>\n<li>Inserta el c\u00f3digo de instalaci\u00f3n. Luego haz clic en \u00abIntroducir c\u00f3digo\u00bb, pega el fragmento y haz clic en \u00abActualizar\u00bb.<\/li>\n<li>Personaliza el tama\u00f1o y posici\u00f3n del plugin. Arr\u00e1stralo a la ubicaci\u00f3n deseada y ajusta sus dimensiones hasta que se vea perfecto sin barras de desplazamiento.<\/li>\n<li>Optimiza el plugin para m\u00f3viles y publ\u00edcalo. Haz clic en el icono de m\u00f3vil para trabajar en el editor m\u00f3vil, ajusta el tama\u00f1o si es necesario, y luego haz clic en \u00abPublicar\u00bb.<\/li>\n<\/ol>\n\n\n\n<p>\u00a1Listo! Has a\u00f1adido tu app de Elfsight a una p\u00e1gina espec\u00edfica de tu sitio web en Wix.<\/p>\n\n\n\n<p>\u00bfY qu\u00e9 hay de <a href=\"https:\/\/elfsight.com\/blog\/how-to-add-whatsapp-chat-to-shopify-for-free\/\" target=\"_blank\" rel=\"noreferrer noopener\">a\u00f1adir WhatsApp Chat a Shopify<\/a>? Es muy f\u00e1cil. Mira c\u00f3mo hacerlo en unos pocos pasos:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Inicia sesi\u00f3n en tu panel de administraci\u00f3n de Shopify y navega a Canales de venta \u2192 Tienda online.<\/li>\n<li>Haz clic en el bot\u00f3n Personalizar para acceder al editor visual.<\/li>\n<li>Para cambiar de p\u00e1gina, usa el men\u00fa desplegable en la parte superior.<\/li>\n<li>Haz clic en Agregar secci\u00f3n, luego selecciona Liquid personalizado.<\/li>\n<li>Pega el c\u00f3digo de tu <a href=\"https:\/\/elfsight.com\/whatsapp-chat-widget\/shopify\/\" target=\"_blank\" rel=\"noreferrer noopener\">chat de WhatsApp para Shopify<\/a> en el campo Liquid personalizado, ajusta colores y m\u00e1rgenes si es necesario y guarda.<\/li>\n<\/ol>\n\n\n\n<p>De esta forma, puedes a\u00f1adir f\u00e1cilmente un chat de WhatsApp personalizado a las p\u00e1ginas de tu sitio en Shopify.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"use-cases\">Bot\u00f3n flotante de WhatsApp: casos de uso geniales<\/h2>\n\n\n\n<p>Entonces, cuando creas y personalizas tu bot\u00f3n flotante de WhatsApp para tu sitio en WordPress u otra plataforma, puedes encontrarte con dificultades para personalizarlo, porque a veces, especialmente si est\u00e1s haciendo una introducci\u00f3n, simplemente no sabes c\u00f3mo estilizarlo en el c\u00f3digo HTML del sitio. Para ello, hemos recopilado algunos ejemplos de dise\u00f1os de botones que pueden servirte de inspiraci\u00f3n.<\/p>\n\n\n<h3 class=\"wp-block-heading\">Ejemplo 1: bot\u00f3n de chat incrustado<\/h3>\n\n\n\n<p>Este es un ejemplo de bot\u00f3n flotante para WordPress o cualquier otro sitio web en un dise\u00f1o cl\u00e1sico con el que los usuarios est\u00e1n familiarizados. Para abrir una ventana de di\u00e1logo personalizada, el usuario solo necesita hacer clic en el bot\u00f3n. La ventana de chat est\u00e1 acompa\u00f1ada de un mensaje personalizado sobre el tiempo de respuesta, lo que definitivamente aumentar\u00e1 la confianza de tu audiencia, ya que ver\u00e1n que te importa y est\u00e1s listo para responder a sus preguntas en cualquier momento.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Ejemplo 2: bot\u00f3n de consulta<\/h3>\n\n\n\n<p>El \u00edcono flotante del chat de WhatsApp en WordPress o cualquier otro sitio web es una excelente manera de ofrecer asesoramiento a los usuarios sobre cualquier duda que puedan tener. Usando las amplias opciones de personalizaci\u00f3n del plugin, puedes cambiar f\u00e1cilmente los colores del bot\u00f3n y de la ventana de chat a los tonos que necesites, integr\u00e1ndolos f\u00e1cilmente en el concepto general del dise\u00f1o y c\u00f3digo HTML de tu sitio.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Ejemplo 3: bot\u00f3n de incorporaci\u00f3n<\/h3>\n\n\n\n<p>El soporte al cliente y la incorporaci\u00f3n son una parte importante de la gesti\u00f3n de cualquier sitio web comercial. Proporcionar estos servicios en una ventana de chat incrustada en el c\u00f3digo HTML de tu sitio WordPress u otro sitio web es una gran idea. Puedes usar el bot\u00f3n flotante de chat en todas las p\u00e1ginas del sitio web, permaneciendo en contacto constante con los clientes y mejorando as\u00ed la calidad de tu servicio.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Ejemplo 4: bot\u00f3n de comentarios<\/h3>\n\n\n\n<p>\u00bfQuieres mejorar la calidad de tus productos y servicios obteniendo retroalimentaci\u00f3n r\u00e1pida y garantizada? Entonces el bot\u00f3n flotante de chat agregado al c\u00f3digo HTML del sitio web te ayudar\u00e1, ya que cualquiera que quiera dar su opini\u00f3n puede hacer clic en \u00e9l en cualquier momento. Al igual que en los ejemplos anteriores, puedes cambiar f\u00e1cilmente los colores del chat a tu gusto para que sea un elemento de dise\u00f1o integrado.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"benefits\">Beneficios del bot\u00f3n flotante de WhatsApp para tu negocio<\/h2>\n\n\n\n<p>\u00bfPor qu\u00e9 deber\u00edas elegir un bot\u00f3n flotante de WhatsApp para agregarlo al c\u00f3digo HTML de tu sitio web? La respuesta es simple: por su facilidad de uso. Es una oportunidad para que tu audiencia inicie un di\u00e1logo con tu empresa en solo 2 clics. No hace falta rellenar formularios, introducir n\u00fameros de tel\u00e9fono ni escribir mensajes. Solo 2 clics. El primero en el sitio, el segundo en la app de WhatsApp. \u00bfQu\u00e9 puede ser m\u00e1s f\u00e1cil?<\/p>\n\n\n\n<p>La mayor\u00eda de las personas encuentra m\u00e1s conveniente comunicarse a trav\u00e9s de mensajeros instant\u00e1neos, con interfaces a las que est\u00e1n acostumbrados. Es m\u00e1s c\u00f3modo que el correo electr\u00f3nico, llamadas o chat en l\u00ednea. A continuaci\u00f3n, hablaremos de las razones por las cuales podr\u00edas considerar a\u00f1adir un bot\u00f3n de chat de WhatsApp a tu sitio web.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Aumento de popularidad con el bot\u00f3n<\/h3>\n\n\n\n<p>WhatsApp es el segundo servicio m\u00e1s grande del mundo despu\u00e9s de Facebook. Tiene m\u00e1s de 500,000 usuarios activos diarios, seg\u00fan <a href=\"https:\/\/www.statista.com\/statistics\/730306\/whatsapp-status-dau\/\" target=\"_blank\" rel=\"noreferrer noopener\">Statista<\/a>. WhatsApp es l\u00edder entre los mensajeros instant\u00e1neos en muchos pa\u00edses.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Forma r\u00e1pida de comunicaci\u00f3n con el bot\u00f3n<\/h3>\n\n\n\n<p>La gente percibe los mensajeros como una forma r\u00e1pida de comunicarse. El vendedor puede responder igual de r\u00e1pido desde cualquier fuente. Pero el usuario responde m\u00e1s r\u00e1pido en WhatsApp. \u00bfPor qu\u00e9?<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>WhatsApp genera una gran confianza en los usuarios. Incluso si no les gusta la aplicaci\u00f3n, la descargar\u00e1n. Es un canal de comunicaci\u00f3n con amigos y familiares. Por esta y otras razones, la gente responde r\u00e1pidamente a los mensajes de WhatsApp.<\/li>\n<li>WhatsApp tambi\u00e9n es un canal libre de spam. En la mayor\u00eda de los casos, recibimos mensajes de personas conocidas. Est\u00e1 libre de anuncios intrusivos, notificaciones molestas, feeds de noticias y spam masivo.<\/li>\n<li>Los usuarios se sienten obligados a revisar los mensajes no le\u00eddos. Incluso si no quieren leerlo, lo abrir\u00e1n.<\/li>\n<li>Todo esto no se aplica al correo electr\u00f3nico. Si el correo no es suficientemente importante, el destinatario puede no abrirlo inmediatamente. O nunca. Y t\u00fa no sabr\u00e1s si fue le\u00eddo o no.<\/li>\n<\/ul>\n\n\n\n<p>WhatsApp tambi\u00e9n tiene estados de mensaje. Siempre sabr\u00e1s si el cliente ley\u00f3 tu mensaje o no. M\u00e1s importante a\u00fan, el usuario sabe que t\u00fa tambi\u00e9n lo ves. Esto aumenta las posibilidades de recibir una respuesta. Incluso un simple \u00abs\u00ed\u00bb o \u00abno\u00bb te puede ayudar a planificar.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Ambiente m\u00e1s informal con el bot\u00f3n de WhatsApp<\/h3>\n\n\n\n<p>La gente percibe las conversaciones por WhatsApp como comunicaci\u00f3n informal, sin formalismos. Este tipo de di\u00e1logo pone a los usuarios a gusto. No tienen miedo de equivocarse, hacer preguntas aclaratorias o incluso bromear. El correo electr\u00f3nico sigue siendo visto como algo oficial, que requiere textos estructurados y detallados. \u00abMe tomar\u00e1 tiempo redactarlo\u00bb, pensar\u00e1 el usuario, y responder\u00e1 antes por WhatsApp a un competidor.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Bot\u00f3n con llamada a la acci\u00f3n<\/h3>\n\n\n\n<p>No se puede subestimar la importancia de una llamada a la acci\u00f3n. El logo de WhatsApp por s\u00ed solo no es una llamada a la acci\u00f3n. No todos los visitantes de tu sitio entender\u00e1n para qu\u00e9 sirve el bot\u00f3n de chat. Incluso con eso, sin una CTA adecuada, el rendimiento ser\u00e1 bajo.<\/p>\n\n\n\n<p>La conversi\u00f3n se reduce sin CTAs. Una llamada a la acci\u00f3n que aparece como tooltip tampoco es muy eficaz. La mejor opci\u00f3n es un mensaje visible todo el tiempo e integrado directamente en el plugin.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Personalizaci\u00f3n del dise\u00f1o del bot\u00f3n<\/h3>\n\n\n\n<p>Un par\u00e1metro importante que permite que el bot\u00f3n de chat se integre perfectamente con el dise\u00f1o de tu sitio. Las configuraciones flexibles permitir\u00e1n que el widget no entre en conflicto con otros elementos visuales. Es ideal si el servicio permite cambiar la fuente, el color, el tama\u00f1o y la posici\u00f3n.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"conclusion\">Conclusi\u00f3n<\/h2>\n\n\n\n<p>El plugin de WhatsApp no es una herramienta m\u00e1gica que traer\u00e1 una avalancha de pedidos. Pero si se aplica correctamente, puede mejorar significativamente la conversi\u00f3n del tr\u00e1fico m\u00f3vil en tu sitio web.<\/p>\n","protected":false},"excerpt":{"rendered":"\u00bfBuscas una manera de crear un bot\u00f3n flotante de chat de WhatsApp para tu sitio web?\n\u00a1Te ofrecemos hacerlo con la ayuda de un plugin pr\u00e1ctico! En este art\u00edculo, descubriremos c\u00f3mo crear tu propio bot\u00f3n de chat flotante y a\u00f1adirlo a tu sitio web en unos pocos pasos.","protected":false},"author":9,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"publish_to_discourse":"","publish_post_category":"","wpdc_auto_publish_overridden":"","wpdc_topic_tags":"","wpdc_pin_topic":"","wpdc_pin_until":"","discourse_post_id":"","discourse_permalink":"","wpdc_publishing_response":"","wpdc_publishing_error":"","footnotes":""},"categories":[110],"tags":[],"class_list":["post-19566","post","type-post","status-publish","format-standard","hentry","category-tutoriales"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.3.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>C\u00f3mo a\u00f1adir un bot\u00f3n flotante de WhatsApp al sitio web [ 2025 ]<\/title>\n<meta name=\"description\" content=\"Agrega un bot\u00f3n flotante de WhatsApp al c\u00f3digo HTML de tu sitio web en WordPress o cualquier otra plataforma en solo unos clics. La gu\u00eda completa y detallada.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elfsight.com\/es\/blog\/how-to-embed-floating-whatsapp-button-to-website\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"C\u00f3mo a\u00f1adir un bot\u00f3n flotante de WhatsApp al sitio web [ 2025 ]\" \/>\n<meta property=\"og:description\" content=\"Agrega un bot\u00f3n flotante de WhatsApp al c\u00f3digo HTML de tu sitio web en WordPress o cualquier otra plataforma en solo unos clics. La gu\u00eda completa y detallada.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elfsight.com\/es\/blog\/how-to-embed-floating-whatsapp-button-to-website\/\" \/>\n<meta property=\"og:site_name\" content=\"Elfsight ES\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/profile.php?id=100000717934522\" \/>\n<meta property=\"article:published_time\" content=\"2025-04-16T09:00:19+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-10-31T09:23:26+00:00\" \/>\n<meta name=\"author\" content=\"polyakova\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"polyakova\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 minutos\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"C\u00f3mo a\u00f1adir un bot\u00f3n flotante de WhatsApp al sitio web [ 2025 ]","description":"Agrega un bot\u00f3n flotante de WhatsApp al c\u00f3digo HTML de tu sitio web en WordPress o cualquier otra plataforma en solo unos clics. La gu\u00eda completa y detallada.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/elfsight.com\/es\/blog\/how-to-embed-floating-whatsapp-button-to-website\/","og_locale":"es_ES","og_type":"article","og_title":"C\u00f3mo a\u00f1adir un bot\u00f3n flotante de WhatsApp al sitio web [ 2025 ]","og_description":"Agrega un bot\u00f3n flotante de WhatsApp al c\u00f3digo HTML de tu sitio web en WordPress o cualquier otra plataforma en solo unos clics. La gu\u00eda completa y detallada.","og_url":"https:\/\/elfsight.com\/es\/blog\/how-to-embed-floating-whatsapp-button-to-website\/","og_site_name":"Elfsight ES","article_author":"https:\/\/www.facebook.com\/profile.php?id=100000717934522","article_published_time":"2025-04-16T09:00:19+00:00","article_modified_time":"2025-10-31T09:23:26+00:00","author":"polyakova","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"polyakova","Tiempo de lectura":"9 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/elfsight.com\/es\/blog\/how-to-embed-floating-whatsapp-button-to-website\/","url":"https:\/\/elfsight.com\/es\/blog\/how-to-embed-floating-whatsapp-button-to-website\/","name":"C\u00f3mo a\u00f1adir un bot\u00f3n flotante de WhatsApp al sitio web [ 2025 ]","isPartOf":{"@id":"https:\/\/elfsight.com\/es\/#website"},"datePublished":"2025-04-16T09:00:19+00:00","dateModified":"2025-10-31T09:23:26+00:00","author":{"@id":"https:\/\/elfsight.com\/es\/#\/schema\/person\/78a88bccd23a18e8966c1700efd6f806"},"description":"Agrega un bot\u00f3n flotante de WhatsApp al c\u00f3digo HTML de tu sitio web en WordPress o cualquier otra plataforma en solo unos clics. La gu\u00eda completa y detallada.","breadcrumb":{"@id":"https:\/\/elfsight.com\/es\/blog\/how-to-embed-floating-whatsapp-button-to-website\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elfsight.com\/es\/blog\/how-to-embed-floating-whatsapp-button-to-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/elfsight.com\/es\/blog\/how-to-embed-floating-whatsapp-button-to-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/elfsight.com\/es\/"},{"@type":"ListItem","position":2,"name":"C\u00f3mo incrustar un bot\u00f3n flotante de WhatsApp en el sitio web html"}]},{"@type":"WebSite","@id":"https:\/\/elfsight.com\/es\/#website","url":"https:\/\/elfsight.com\/es\/","name":"Elfsight ES","description":"Just another Elfsight Sites site","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elfsight.com\/es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/elfsight.com\/es\/#\/schema\/person\/78a88bccd23a18e8966c1700efd6f806","name":"polyakova","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/elfsight.com\/es\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/d9d214692c02d8bd1d3bd9b7eb9fee81?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d9d214692c02d8bd1d3bd9b7eb9fee81?s=96&d=mm&r=g","caption":"polyakova"},"description":"As a seasoned Content Manager with over a decade of dedicated experience, I bring to the table a rich history of shaping and refining digital narratives.","sameAs":["https:\/\/www.facebook.com\/profile.php?id=100000717934522"],"url":"https:\/\/elfsight.com\/author\/valeriya-polyakova\/"}]}},"meta_box":[],"_links":{"self":[{"href":"https:\/\/elfsight.com\/es\/wp-json\/wp\/v2\/posts\/19566","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elfsight.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elfsight.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elfsight.com\/es\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/elfsight.com\/es\/wp-json\/wp\/v2\/comments?post=19566"}],"version-history":[{"count":2,"href":"https:\/\/elfsight.com\/es\/wp-json\/wp\/v2\/posts\/19566\/revisions"}],"predecessor-version":[{"id":19988,"href":"https:\/\/elfsight.com\/es\/wp-json\/wp\/v2\/posts\/19566\/revisions\/19988"}],"wp:attachment":[{"href":"https:\/\/elfsight.com\/es\/wp-json\/wp\/v2\/media?parent=19566"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elfsight.com\/es\/wp-json\/wp\/v2\/categories?post=19566"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elfsight.com\/es\/wp-json\/wp\/v2\/tags?post=19566"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}