<?xml version="1.0" encoding="UTF-8"?>
<page lang="es" url="https://spoki.com/es/blog/widget-chat-whatsapp-wordpress-shopify-cms">
  <meta>
    <title>Cómo añadir un widget de chat WhatsApp gratuito a WordPress, Shopify y otros CMS</title>
    <page>blog/widget-chat-whatsapp-wordpress-shopify-cms</page>
    <language>es</language>
    <generated_at>2026-04-18T21:44:51.496Z</generated_at>
    <formats>
      <html>https://spoki.com/es/blog/widget-chat-whatsapp-wordpress-shopify-cms</html>
      <markdown>https://spoki.com/es/blog/widget-chat-whatsapp-wordpress-shopify-cms.md</markdown>
      <json>https://spoki.com/es/blog/widget-chat-whatsapp-wordpress-shopify-cms.json</json>
      <xml>https://spoki.com/es/blog/widget-chat-whatsapp-wordpress-shopify-cms.xml</xml>
    </formats>
  </meta>
  <sections>
    <section level="1" heading="Cómo añadir un widget de chat WhatsApp gratuito a WordPress, Shopify y otros CMS">
      <text><![CDATA[**Author:** Spoki | **Published:** 18/2/2026

*Añade un widget de chat WhatsApp a WordPress, Shopify u otro CMS. Click-to-chat, plantillas y cumplimiento. Guía paso a paso con Spoki.*

---

Un **widget** de **chat** **WhatsApp** en tu **web** permite a los **visitantes** iniciar una **conversación** con un **clic**, sin guardar tu número ni salir de la página. Añadir un **widget** **WhatsApp** a **WordPress**, **Shopify** u otros **CMS** es sencillo si usas una **plataforma** que ofrece **click-to-chat** y primeros **mensajes** basados en **plantillas** para mantener el **cumplimiento** con la **API de WhatsApp Business**.

Esta guía explica cómo añadir un **widget** de **chat** **WhatsApp** **gratuito** a **WordPress**, **Shopify** y otras **webs** **CMS**: qué necesitas (acceso **API**, **plantillas**), cómo instalar el **widget** (plugin, script o **enlace**) y cómo gestionar el primer **mensaje** y las **conversaciones**. Para **soluciones** que incluyen **widget** y **API** **WhatsApp**, consulta [soluciones Spoki](https://spoki.com/es/solutions) y [funcionalidades](https://spoki.com/es/features).]]></text>
    </section>
    <section level="2" heading="Qué necesitas antes de añadir el widget">
      <text><![CDATA[Para mostrar un **widget** de **chat** **WhatsApp** que inicie **conversaciones** reales (no solo un **enlace** **click-to-chat** que abre la app con texto prefijado), normalmente necesitas:

- **Acceso a la API de WhatsApp Business:** Directo o vía **BSP** (Business Solution Provider). La **API** es necesaria para los primeros **mensajes** basados en **plantillas** y la gestión de **conversaciones** a escala.

- **Plantilla aprobada:** El primer **mensaje** a un **contacto** debe ser una **plantilla** **aprobada**. Usarás una **plantilla** (ej. **bienvenida**, “Hola, ¿cómo podemos ayudarte?”) para los **clics** en el **widget** y que la **conversación** empiece de forma **compliant**.

- **Widget o plugin:** Un **widget** (botón flotante, **enlace** **click-to-chat** o **plugin**) que abra **WhatsApp** con la **plantilla** o texto **prefijado** correcto y, si aplica, conecte las **respuestas** a tu **inbox** o **CRM**.

**Plataformas** como Spoki ofrecen acceso **API**, gestión de **plantillas** y opciones de **widget**/integración para **WordPress** y otras **webs**. Para [casos de uso](https://spoki.com/es/use-cases) y [soporte al cliente](https://spoki.com/es/customer-support), consulta los enlaces.

**Gratuito vs de pago:** Un **widget** “**gratuito**” suele significar que no hay coste extra por el **widget** en sí; puede que sigas necesitando acceso a la **API de WhatsApp Business** (a menudo mediante **BSP** o **plataforma** que cobra por uso **API** o **conversaciones**). Algunas **plataformas** ofrecen plan **gratuito** o **prueba** para probar **widget** y **plantillas** antes de escalar. Comprueba si el **widget** solo añade un **enlace** **click-to-chat** (abre **WhatsApp** con texto prefijado) o también conecta **respuestas** a **inbox** o **CRM**; lo segundo es mejor para gestión de **conversaciones** y **automatización**.]]></text>
    </section>
    <section level="2" heading="Añadir el widget WhatsApp a WordPress">
      <text><![CDATA[En **WordPress** puedes añadir un **widget** de **chat** **WhatsApp** de dos formas principales:

**Plugin o integración:** Muchas **plataformas** **API** **WhatsApp** ofrecen un **plugin** **WordPress** o **integración** que añade un **botón** flotante o **widget**. Conectas tu cuenta **API**, eliges una **plantilla** **aprobada** (o texto **prefijado** que encaje con tu **plantilla**) y el **plugin** muestra el **botón** en tu **sitio**. Los **clics** abren **WhatsApp** y envían el primer **mensaje** vía **plantilla** cuando corresponda. Comprueba que el **plugin** soporte primeros **mensajes** basados en **plantillas** si usas la **API**.

**Inserción manual:** Si no usas **plugin**, puedes añadir un **enlace** **click-to-chat** o un **script** que muestre un **botón**. El **enlace** suele ser tipo `https://wa.me/NUMERO?text=TEXTO_PREFIJADO`. El texto **prefijado** debe coincidir con lo que espera tu **plantilla** (ej. **plantilla** de **bienvenida** con un **botón** que inicia la **conversación**). Las **respuestas** van a tu **inbox** **WhatsApp** o a la **plataforma** que uses.

Tras la instalación, prueba el **widget**: **haz clic** desde **móvil** o **escritorio** y confirma que el primer **mensaje** se envía bien y que las **respuestas** llegan a tu **inbox**. Para [FAQ](https://spoki.com/es/faq) y [contacto](https://spoki.com/es/contact), consulta los enlaces.]]></text>
    </section>
    <section level="2" heading="Añadir el widget a Shopify y otros CMS">
      <text><![CDATA[**Shopify** y otros **CMS** (ej. **Wix**, **Squarespace**, **sitios** custom) siguen la misma lógica:

- **Shopify:** Usa una **app** del **Shopify** **App** **Store** que se conecte a la **API de WhatsApp Business** y añada un **botón** de **chat**, o añade un **snippet** **liquid** o **script** custom en tu tema que inserte un **enlace** o **widget** **click-to-chat**. Asegúrate de que el primer **mensaje** use una **plantilla** **aprobada** si estás en la **API**.

- **Otros CMS:** La mayoría permiten un bloque **HTML** o **script** custom en el pie o la cabecera. Pega el **script** o **enlace** del **widget** que te dé tu **plataforma** (ej. Spoki). El **widget** se mostrará en cada página donde se cargue el **código**.

En todos los casos usa una **plantilla** **aprobada** para los **clics** en el **widget** para que las **conversaciones** empiecen dentro de la política de **WhatsApp**. Para [precios](https://spoki.com/es/pricing) y [registro](https://spoki.com/es/landing-registration), consulta los enlaces; puedes [reservar una demo](https://spoki.com/es/book) para ver **widget** y **API** juntos.]]></text>
    </section>
    <section level="2" heading="Gestionar conversaciones tras el primer clic">
      <text><![CDATA[Cuando un **visitante** **hace clic** en el **widget**:

- El primer **mensaje** se envía con tu **plantilla** **aprobada** (ej. **bienvenida**).

- Comienza una **sesión** de **24 horas**; puedes **responder** con **mensajes** **free-form** o usar **automatización** (ej. **chatbot**, **FAQ**).

- Las **respuestas** pueden gestionarse en el **inbox** de la **plataforma** o en el **CRM** para que los **agentes** vean **contexto** e **historial**.

Mantener las **conversaciones** en un solo hilo **WhatsApp** y usar **plantillas** solo cuando exija la norma (primer **mensaje**, tras fin de **sesión**) te mantiene **compliant** y mejora los tiempos de **respuesta**. Para [soluciones](https://spoki.com/es/solutions) e [inteligencia artificial](https://spoki.com/es/artificial-intelligence), consulta los enlaces.

**Colocación y diseño:** Coloca el **botón** del **widget** donde los **visitantes** lo vean sin tapar contenido (ej. esquina inferior derecha). Usa una **etiqueta** clara (ej. “Chatea con nosotros”) y comprueba que funcione en **móvil** y **escritorio**. Algunos **widgets** permiten **colores** o **iconos** custom para tu **marca**; mantén el **botón** visible pero no molesto para una **conversión** de **web** a **WhatsApp** alta.]]></text>
    </section>
    <section level="2" heading="Conclusión">
      <text><![CDATA[Añadir un **widget** de **chat** **WhatsApp** **gratuito** a **WordPress**, **Shopify** u otras **webs** **CMS** requiere acceso a la **API de WhatsApp Business** (o **BSP**), una **plantilla** **aprobada** para el primer **mensaje** y un **widget** o **plugin** que muestre el **botón** y abra **WhatsApp** correctamente. Instala vía **plugin** o **script**, prueba **clics** y primer **mensaje** y gestiona las **respuestas** en tu **inbox** o **CRM**. Explora [funcionalidades Spoki](https://spoki.com/es/features) y [soluciones](https://spoki.com/es/solutions), [regístrate](https://spoki.com/es/landing-registration) o [reserva una demo](https://spoki.com/es/book) para añadir un **widget** **WhatsApp** a tu **web** con **API** y **cumplimiento** en mente.]]></text>
    </section>
    <section level="3" heading="Categories">
      <text><![CDATA[- Blog-es]]></text>
    </section>
    <section level="3" heading="Tags">
      <text><![CDATA[- AI & Automation
- Shopify
- WhatsApp API

---]]></text>
    </section>
    <section level="2" heading="About Spoki">
      <text><![CDATA[Utiliza la plataforma sencilla, rápida e intuitiva de Spoki para impulsar conversiones, automatizar tareas y hacer crecer tu negocio.]]></text>
    </section>
    <section level="3" heading="Soluciones">
      <text><![CDATA[- Marketing
- Ventas
- Atención al Cliente
- Desarrolladores]]></text>
    </section>
    <section level="3" heading="Programas Especiales">
      <text><![CDATA[- Agencias
- Afiliación
- Revendedor
- Start up]]></text>
    </section>
    <section level="3" heading="Quick Links">
      <text><![CDATA[- [Features](https://spoki.com/es/features)
- [Pricing](https://spoki.com/es/pricing)
- [About](https://spoki.com/es/about)
- [FAQ](https://spoki.com/es/faq)
- [Blog](https://spoki.com/es/blog)
- [Case Studies](https://spoki.com/es/case-studies)
- [Integrations](https://spoki.com/es/integrations)

© 2026 Spoki. Todos los derechos reservados.]]></text>
    </section>
  </sections>
</page>