Paso a paso
🤖 Alibaba Cloud
Alibaba
📘 Paso a paso 📘 Alibaba Cloud↗ Alibaba Cloud · Sitio oficialprincipiante 💼 Negocios

Cómo añadir un chatbot de IA de Alibaba Cloud a tu web de WordPress

Crea un asistente de IA en tu web de WordPress en pocos minutos, aunque no hayas programado nunca.

6 min de lectura·28 de junio de 2026·🔄 Actualizado:

Esta guía fue escrita por IA. Pasó controles automáticos de datos y calidad, y nuestro editor comprueba cada día una muestra de las guías publicadas.

Ve primero AI World HQ en GoogleAñádenos como fuente preferida y verás nuestras noticias antes en las Noticias destacadas de Google.Añadir en Google

Cuando termines esta guía tendrás una burbuja de chat que da la bienvenida a los visitantes, responde consultas básicas y funciona en todas las páginas de tu sitio de WordPress, sin necesidad de tener experiencia en programación.

💡 Consejo: toca el número de un paso cuando lo termines — aparece una marca verde y tu navegador recuerda hasta dónde llegaste.

✅ Antes de empezar
  • Cuenta de Alibaba Cloud: regístrate en alibabacloud.com (el plan gratuito es suficiente para un chatbot sencillo).
  • Sitio de WordPress: necesitas acceso de administrador al panel de control.
  • Un navegador web en un ordenador o tablet (Chrome, Edge o Firefox funcionan bien).
  • Unos minutos: todo el proceso suele llevar entre 20 y 30 minutos.
  • Opcional: un plugin gratuito como "Insert Headers and Footers" facilita añadir código.
1
Paso 1 de 5

Crea una nueva instancia del chatbot

Abre tu navegador, entra en console.alibabacloud.com e inicia sesión. Busca el servicio de chatbot de IA o IA conversacional en la consola; normalmente lo encontrarás escribiendo "Chatbot" o "Conversation AI" en la barra de búsqueda de la esquina superior derecha. Haz clic en el botón para crear un nuevo bot o robot (puede llamarse Create Robot, Create Instance, New Bot o algo parecido). Aparecerá un formulario pidiéndote un nombre y una breve descripción. Tras escribir un nombre como "FrontDeskHelper" y confirmar, la plataforma crea un nuevo bot y lo muestra en tu lista, normalmente con el estado "Running" o un indicador que muestra que está activo.

💬 Ejemplo`FrontDeskHelper`
✅ Sabrás que funcionó cuando

la nueva entrada aparezca en tu lista de bots con un indicador de estado activo.

Siguiente paso ↓
Crea una nueva instancia del chatbot
2
Paso 2 de 5

Define el saludo de bienvenida del chatbot

En la lista de bots, haz clic en el nombre del bot que acabas de crear para abrir su página de ajustes. Busca una sección donde puedas configurar el primer mensaje que ven los visitantes; puede llamarse Greetings, Welcome Message, Chat Prompt o algo similar. Suele haber un cuadro de texto donde puedes escribir lo que dice el bot cuando alguien abre el chat por primera vez. Tras escribir una frase como "¡Hola! Soy tu asistente digital: pregúntame por los horarios o los servicios", a menudo aparece una vista previa del mensaje debajo del cuadro. Pulsa Save para guardar el cambio.

💬 Ejemplo`¡Hola! Soy tu asistente digital: pregúntame por los horarios o los servicios.`
✅ Sabrás que funcionó cuando

veas una confirmación de que los ajustes se han guardado correctamente.

Siguiente paso ↓
Alibaba CloudSave
✏️ Boceto: tu pantalla puede verse un poco distinta
3
Paso 3 de 5

Elige un estilo visual que combine con tu web

Sigue en los ajustes del bot y busca las opciones para personalizar el aspecto de la burbuja de chat; pueden estar en una pestaña llamada Appearance, Style, Customization, Theme o similar. Normalmente encontrarás opciones para elegir un color (puedes copiar el color principal de tu web como código hexadecimal, p. ej., #0066CC) y, posiblemente, subir un pequeño logo o icono para la burbuja de chat. La vista previa en pantalla debería actualizarse para mostrar cómo se verá la burbuja en tu web.

💬 Ejemplopon el color en `#0066CC` y sube `logo.png`
✅ Sabrás que funcionó cuando

la vista previa en pantalla muestre el color y el icono que has elegido.

Siguiente paso ↓
Elige un estilo visual que combine con tu web
4
Paso 4 de 5

Copia el código de incrustación del widget

Vuelve a la página principal del bot y busca un botón para publicar, desplegar o hacer el bot público; puede llamarse Publish, Deploy, Enable o similar. Una vez activado, debería aparecer un panel (puede llamarse Embed Code, Web Widget, Integration Code o algo parecido) con un fragmento de código que empieza por <script src="..."></script>. Busca un botón Copy junto al cuadro de código; si no lo hay, haz clic dentro del cuadro y pulsa Ctrl + C (o Cmd + C en un Mac) para copiarlo manualmente.

💬 Ejemplo`` — *tu código real puede variar*
✅ Sabrás que funcionó cuando

puedas pegar el fragmento en un documento de texto plano y aparezca una etiqueta <script> completa.

Siguiente paso ↓
Copia el código de incrustación del widget
5
Paso 5 de 5

Inserta el código en el pie de página de WordPress

Entra en el panel de WordPress (tu-sitio.example.com/wp‑admin). Puedes añadir el código del chatbot desde Appearance → Widgets (busca una zona de widgets como Footer o Footer 1, añade un bloque Custom HTML y pega el código) o instalando un plugin gratuito como "Insert Headers and Footers" yendo a Settings → Insert Headers and Footers y pegando el código en el cuadro "Scripts in Footer". Cualquiera de los dos métodos hace que el script se cargue en todas las páginas de tu sitio. Pulsa Update o Save para confirmar.

💬 Ejemplopega el fragmento `