Cómo añadir un chatbot a WordPress con bloque, widget o shortcode

Abre el panel de administración de WordPress → WebChatAgent → General. Pega el UUID completo en Chatbot ID, activa el widget solo si deseas un botón flotante en todo el sitio y selecciona Save Settings. El título de solo lectura y la vista previa deberían actualizarse con el asistente previsto.

El panel informativo azul es importante: la apariencia, la posición, los mensajes, el conocimiento y el comportamiento de las respuestas se gestionan en el panel de WebChatAgent. WordPress no debe convertirse en una segunda fuente conflictiva de configuración.

Guardar los cambios correctamente demuestra que el almacenamiento local funciona. Que se carguen el título y la vista previa del asistente demuestra además que el ID, la solicitud de configuración pública y la entrada en Allowed websites coinciden.

Usa el widget flotante para soporte en todo el sitio que deba permanecer disponible mientras los usuarios navegan entre páginas. Usa un chat integrado cuando la conversación pertenezca a una página concreta de soporte, precios, incorporación o base de conocimiento.

Abre Inline Embed para ver los dos métodos del editor. Los usuarios de Gutenberg deberían preferir WebChatAgent Inline Chat porque los editores pueden encontrarlo visualmente y configurar un ID específico por página opcional. Los usuarios del editor clásico, Elementor, Divi y widgets de texto pueden pegar `[webchatagent_inline]` en cualquier elemento compatible con shortcodes.

Ambos métodos integrados reutilizan por defecto el Chatbot ID general. Esto centraliza los cambios posteriores del asistente y reduce el mantenimiento.

Abre una página normal del front-end y confirma que el botón del chat permanece dentro del área segura inferior derecha sin tapar avisos de cookies, botones de compra o menús móviles. Ábrelo una vez y revisa el título del asistente, el texto de bienvenida, los colores y la navegación por teclado.

El widget flotante se carga dondequiera que el tema activo ejecute `wp_footer()`. Si aparece en la vista previa del panel pero no en el sitio, inspecciona el pie de página del tema y los plugins de optimización antes de modificar el Chatbot ID.

Prueba la página de inicio, una página interna en caché y una sesión privada del navegador. Una sesión de administrador iniciada puede ocultar problemas de consentimiento, caché y persistencia.

Crea o edita la página de destino, abre el insertador de bloques y busca “chat”. Selecciona WebChatAgent Inline Chat dentro de Incrustados. Añade antes del bloque un encabezado claro y una frase que indique a los visitantes qué pueden preguntar.

El editor muestra un marcador de posición en lugar de cargar el widget remoto en vivo. Esto es intencionado: evita iniciar sesiones de visitantes o consumir tráfico de chat mientras un editor reorganiza el contenido.

Publica primero en un entorno de pruebas. Abre la URL pública y verifica la altura completa del chat en ordenadores y móviles; no juzgues el diseño final solo por el marcador de posición del editor.

Deja vacío el campo Chatbot ID en la barra lateral del bloque para heredar los ajustes generales. Introduce un UUID completo solo cuando esta página necesite intencionadamente un asistente especializado; por ejemplo, ayuda para el alta dentro del portal de incorporación mientras el bot flotante sigue ofreciendo soporte general.

Registra la URL de la página, el nombre del asistente y el responsable de la modificación en tu documentación interna. De lo contrario, si un asistente se elimina o se sustituye, estas modificaciones individuales son fáciles de pasar por alto.

Si el chat integrado y el flotante responden de forma distinta, compara sus nombres e IDs públicos de asistente antes de depurar el conocimiento o los ajustes del modelo.

Añade un módulo de Shortcode o compatible con HTML y pega `[webchatagent_inline]`. Esta es la opción más segura para el editor clásico, Elementor, Divi, widgets reutilizables y plantillas que ejecuten shortcodes mediante WordPress.

Para utilizar deliberadamente un asistente especializado, usa `[webchatagent_inline chatbot-id="UUID"]`. El alias `chatbot_id="UUID"` existe para maquetadores que eliminan los guiones de los nombres de atributos.

No pegues el fragmento de instalación JavaScript sin procesar en la misma página si el plugin está activo. El plugin ya se encarga de cargar el recurso integrado únicamente donde se renderiza el bloque o el shortcode.

Si una página con chat integrado debe contener solo un chat, desactiva el interruptor flotante global para todo el sitio o retira el bloque integrado de esa página. Dado que el plugin no ofrece una exclusión flotante por página, las estrategias combinadas deben planificarse antes del despliegue.

Carga el almacenamiento opcional de chat o analítica solo tras obtener el consentimiento exigido por tu política. El widget de WebChatAgent admite el estado de consentimiento, pero tu gestor de consentimiento en WordPress sigue decidiendo cuándo pueden ejecutarse los scripts opcionales. Documenta la base jurídica, los plazos de conservación y los datos del encargado del tratamiento para tu instalación.

Excluye `web-chat-agent.js` y `chat-widget-inline.js` del retraso en la carga, la combinación de scripts y la minificación agresiva. Vacía las cachés de WordPress, maquetadores visuales, proxies inversos y CDN tras cambiar la ubicación o el ID.

Abre la página publicada en una sesión de visitante limpia. Confirma que haya un único widget integrado, el estado flotante esperado, los controles en inglés, un ancho legible en móviles y ausencia de desbordamiento horizontal. Después, haz una pregunta cuya respuesta exacta se encuentre en una fuente indexada.

Pregunta verificada: “What is the exact onboarding code for the WordPress embed lab?” Resultado esperado y obtenido: `WP-EMBED-47`. El widget integrado real respondió: “The exact onboarding code for the WordPress embed lab is WP-EMBED-47.”

Repite la misma pregunta tras realizar cambios en plugins, temas, caché, consentimiento, asistentes o fuentes de conocimiento. Prueba también una pregunta no contemplada y exige una respuesta honesta que indique la falta de información, en lugar de una suposición verosímil.