Añade un agente de voz con IA a Xperience by Kentico

Cómo añadir AnveVoice a Xperience by Kentico

En Xperience by Kentico, el lugar más limpio para la etiqueta de AnveVoice es el layout Razor compartido, _Layout.cshtml, de modo que cada página renderizada a través de él cargue el agente de voz. Si el equipo de marketing debe controlar la etiqueta sin una nueva versión del código, el paquete Kentico.Xperience.TagManager permite añadirla como fragmento de código personalizado desde la interfaz de administración. Pasos comprobados con la documentación oficial el 2026-10-14.

En resumen

• Dónde va el código: ~/Views/Shared/_Layout.cshtml (o un registro de Tag Management con un fragmento de código personalizado)
• Programación necesaria: Una edición de Razor y un nuevo despliegue; ninguna después de la configuración si usas Tag Manager
• Nota de versión: El paquete Tag Manager 6.1.0 se dirige a Xperience 31.4.0 o posterior y a .NET 8
• Tiempo: Unos 2 minutos de edición más tu despliegue habitual

Qué cubre esta guía

Los pasos siguen la documentación de Xperience by Kentico, donde un sitio es una aplicación ASP.NET Core cuyas páginas se renderizan mediante vistas Razor y un layout. Las guías de Kentico colocan los scripts de todo el sitio en ese layout. Las versiones antiguas de Kentico y los sitios creados con el Portal Engine heredado quedan fuera de las páginas que revisamos, así que confirma la ubicación del archivo de layout en tu propio proyecto antes de copiar las rutas. Necesitas un embed ID de AnveVoice. Crea una cuenta gratuita en app.anvevoice.app, configura tu bot de voz y copia el ID del panel. Sustituye YOUR_EMBED_ID por él en la etiqueta de abajo.

• 1. Prepara la etiqueta — Ten a mano esta línea. El atributo async hace que nunca bloquee el renderizado, y el script ignora una segunda copia si acaban dos en la misma página. <script src="https://anvevoice.app/embed.js?embedId=YOUR_EMBED_ID" async></script>

Método 1: edita el layout compartido

La guía de seguimiento de actividad de Kentico edita ~/Views/Shared/_Layout.cshtml y añade su componente de vista de seguimiento al final del elemento head. La etiqueta de AnveVoice puede seguir el mismo patrón o ir justo encima de la etiqueta de cierre body. Como la etiqueta es asíncrona, cualquiera de las dos posiciones funciona; la posición en body la mantiene alejada de tu marcado del head. El script de seguimiento propio de Kentico depende del consentimiento del visitante: su componente de vista solo se renderiza cuando el contacto actual puede ser rastreado. La etiqueta de AnveVoice no se condiciona automáticamente. Si tu política de cookies exige consentimiento antes de los scripts de terceros, renderízala dentro de la misma comprobación de consentimiento o usa el Método 2 con un consentimiento asociado.

• 1. Abre el layout — En tu proyecto web, abre Views/Shared/_Layout.cshtml. Si tu sitio usa varios layouts, por ejemplo uno para páginas de aterrizaje y otro para artículos, anota cada archivo que renderice un documento HTML completo.
• 2. Pega la etiqueta — Añade la línea del script de AnveVoice justo encima de </body>. Si prefieres mantener los scripts de terceros junto al componente de seguimiento de Kentico, colócala justo antes de </head>.
• 3. Compila y despliega — Los cambios en Razor se publican con tu aplicación, así que compila y despliega mediante tu flujo habitual. No hace falta configurar nada dentro de la administración de Xperience.

Método 2: paquete Tag Manager

El paquete Kentico.Xperience.TagManager, publicado en NuGet, añade una aplicación Tag Management a la administración. Su ficha describe el registro de los servicios en Program.cs y la creación de registros que se renderizan en posiciones elegidas de la página. Esta vía encaja en equipos en los que deben añadir o quitar etiquetas los editores, no los desarrolladores.

• 1. Instala y registra — Añade el paquete Kentico.Xperience.TagManager y llama a builder.Services.AddKenticoTagManager(builder.Configuration) en Program.cs. La ficha asocia el paquete 6.1.0 con Xperience 31.4.0 o posterior sobre .NET 8, así que revisa la matriz de versiones en proyectos anteriores.
• 2. Crea el registro — Abre la aplicación Tag Management, crea un registro, ponle un nombre, elige el canal y selecciona Custom code snippet (fragmento de código personalizado). Pega la etiqueta de AnveVoice como código completo.
• 3. Elige la ubicación y el consentimiento — Elige Bottom of the body (final del body) como posición de renderizado. Asocia un consentimiento si tu sitio lo requiere, y deja vacío el filtro de tipo de contenido para renderizar en todas las páginas, o selecciona tipos de contenido concretos para limitarlo.
• 4. Activa el renderizado — Marca Enable tag rendering (activar renderizado de etiquetas) y guarda. La ficha indica que los fragmentos se muestran en las páginas en vivo una vez aceptado su consentimiento; por defecto no se muestran en la vista previa de administración ni en Page Builder.

Vista previa, Page Builder y comportamiento del consentimiento

Los registros de Tag Manager tienen un ajuste que indica dónde aparecen: vista previa de administración, Page Builder, ambos o ninguno, siendo ninguno el valor predeterminado. Ese valor explica que los editores a veces digan que el botón de voz falta mientras editan, aunque el sitio en vivo sí lo muestre. Para un agente de voz, normalmente quieres que los visitantes lo vean solo en el canal en vivo, así que el valor predeterminado suele ser el adecuado. Cuando un visitante cambia su consentimiento, la página no se vuelve a renderizar por sí sola. El paquete documenta una llamada de JavaScript, window.xperience.tagManager.updateCodeSnippets(), que actualiza los fragmentos renderizados tras un cambio de consentimiento. Conecta esa llamada a tu banner de consentimiento si condicionas la etiqueta.

Comprueba que funciona

• 1. Carga una página en vivo — Abre una página pública en una ventana privada para no llevar una sesión de administración, y acepta el consentimiento si aparece tu banner.
• 2. Localiza el botón — Debería aparecer un botón redondo de micrófono abajo a la derecha. Haz clic en él, permite el micrófono y pregunta algo que tu sitio responda.
• 3. Confirma un único script — En las herramientas de desarrollo del navegador, busca anvevoice.app/embed.js en la página. Debería aparecer una sola vez. Si aparece dos veces, el layout y un registro de Tag Management la contienen ambos.

Problemas habituales

• No se renderiza nada tras editar el layout: el cambio aún no llegó al servidor en ejecución, o la página usa un archivo de layout distinto del que editaste.
• Registro de Tag Manager guardado pero invisible: Enable tag rendering no está marcado, el consentimiento no está aceptado o el filtro de tipo de contenido excluye la página que estás probando.
• El botón aparece en las páginas pero no en el editor: es lo esperado, porque la visualización en vista previa y en Page Builder está desactivada por defecto en los registros de Tag Manager.
• El aviso del micrófono nunca aparece: el sitio debe servirse por HTTPS, incluido tu nombre de host de staging.

Fuentes

• Documentación de Xperience by Kentico: activar el seguimiento de actividad (ubicación en layout y head) (https://docs.kentico.com/guides/development/activities-and-marketing/enable-activity-tracking) — consultado el 2026-10-14
• Kentico.Xperience.TagManager, paquete (ficha de NuGet) (https://www.nuget.org/packages/Kentico.Xperience.TagManager) — consultado el 2026-10-14

Relacionado

• Cómo añadir AnveVoice a un sitio de DNN
• Cómo añadir AnveVoice a un sitio Grav
• Cómo añadir AnveVoice a un sitio ProcessWire
• Cómo añadir AnveVoice a un sitio web HTML sencillo

Prueba AnveVoice en tu sitio

Plan gratuito: 0 US$, 50.000 tokens al mes, sin tarjeta. Obtén tu ID de inserción en el panel y pega una etiqueta.