# Navegar ## Resumen La interacción Navegar te permite definir acciones de navegación cuando los usuarios interactúan con componentes, como hacer clic en un botón. Esta función posibilita la redirección sin problemas a varios tipos de páginas, mejorando el compromiso del usuario y creando una experiencia de navegación fluida en tu sitio.
### **Características clave** * Admite múltiples tipos de referencia de página * Acciones de navegación personalizables * Mejora el flujo de navegación del sitio ### Casos de uso * **Página de producto:** Redirigir a una página con especificaciones detalladas del producto. * **Página de soporte:** Navegar a un artículo de ayuda o formulario de contacto. * **Página de la comunidad:** Vincular a un perfil de miembro o hilo de discusión. * **Página de evento:** Dirigir a un formulario de registro del evento. * **Página de aterrizaje:** Guiar a una página de detalles de la campaña. * **Página de perfil:** Navegar a registros de contacto relacionados. ## Configuración Agrega la interacción Navegar a un componente (por ejemplo, Botón) en una página del sitio Experience Cloud y configúrala a través de la pestaña Interacciones en Experience Builder. ### **Tipos de navegación disponibles** Estos tipos de referencia de página especifican hacia dónde se dirigen los usuarios. | Tipo de navegación | Descripción | Ejemplo de caso de uso | | ------------------------------------------------- | --------------------------------------------------------------------------------- | ---------------------------------------------------- | | **Aura - Página de registro externa** | Vincula a una página de registro específica usando el framework Aura. | Ver los detalles de un Contacto. | | **Aura - Página de relación de registro externa** | Vincula a registros relacionados (p. ej., Contactos de una Cuenta). | Ver Oportunidades de una Cuenta. | | **Aura - Página de inicio de sesión** | Activa acciones de inicio de sesión o cierre de sesión. | Iniciar sesión para acceder a contenido restringido. | | **Artículo de Knowledge** | Dirige a un artículo específico de Knowledge. | Acceder a un artículo de soporte. | | **Página de contenido administrado** | Vincula a una página de contenido administrada por el CMS. | Ver un artículo de noticias. | | **Página nombrada** | Redirige a una página interna de Experience Builder. | Ir a una página nombrada "Soporte". | | **Página de objeto** | Navega a una vista de lista o a la página de crear nuevo registro para un objeto. | Abrir la vista de lista de Contactos. | | **Página de registro** | Vincula a la página de detalles de un registro específico. | Ver un registro de Cuenta. | | **Página de relación de registro** | Navega a una lista relacionada (p. ej., Oportunidades de un Contacto). | Ver Casos de una Cuenta. | | **Página web** | Redirige a una página web externa o interna. | Enlace a un sitio de un socio. | ***Mejor práctica**:* Elige el tipo según el objetivo (p. ej., Página de registro para registros); prueba la navegación en vista previa. **Configurar la navegación a una página específica** Para configurar la navegación a una página o recurso específico, sigue estos pasos según tu caso de uso: ### **Navegar a una página nombrada** 1. Agrega un componente Botón y ve a la **Interacciones** Pestaña. 2. Selecciona **Navegar** y elige **Página nombrada**. 3. **Nombre de la página:** Introduce el nombre API de la página de destino (p. ej., Content\_Document\_\_c). 4. *¿Por qué esto?* Dirige a los usuarios a una página interna (p. ej., una página de documento de contenido) definida en Experience Builder.
### **Navegar a una página de registro** Usa esta opción cuando quieras que un botón o componente abra la página de detalles de un registro específico en tu sitio Experience Cloud #### Pasos de configuración 1. Selecciona **Navegar** y elige **Página de registro**. 2. **Nombre API del objeto:** Introduce el objeto (p. ej., Contact). 3. **ID de registro:** Selecciona el campo de ID de registro correcto para la redirección; generalmente, es “**`Registro: Id`**”. 4. **Nombre de la acción:** Configurar en Ver (predeterminado para detalles). *¿Por qué esto?* Lleva a los usuarios a la página de detalles de un registro específico (p. ej., un registro de Contacto).
{% hint style="warning" %} #### Importante Para garantizar que la navegación a una página de registro funcione correctamente, primero crea la Página de Objeto en tu sitio Experience donde debe aterrizar la interacción Navegar. Si esta página no existe, la interacción Navegar a Página de Registro no funcionará. {% endhint %} ### **Navegar a una página web externa** Usa esta opción cuando quieras que un botón o componente abra un sitio externo u otro recurso web, como tu sitio principal, un portal de socios o una página de documentación #### Pasos de configuración 1. Elige la **Navegar** interacción y selecciona la **Página web** opción. 2. **URL de destino:** Puedes ya sea: * Seleccionar un campo (p. ej., un campo fórmula en el registro que almacene la URL) para establecer dinámicamente el destino de la redirección. * O, elegir **Personalizado** y escribir manualmente una URL externa (p. ej., ). 3. **¿Por qué esto?** Esta opción redirige a los usuarios a un sitio web o recurso externo, mejorando la conectividad del sitio. 4. **Solución de problemas:** Si la navegación no funciona, verifica que la URL o el valor del campo seleccionado sea válido y asegúrate de que el usuario tenga los permisos necesarios para acceder al sitio de destino. ### **Pasar parámetros de URL con Navegar a página nombrada** Esta función te permite enviar datos dinámicos (p. ej., un ID de registro) a una página de destino, personalizando su contenido según el contexto del usuario. Es perfecto para crear experiencias personalizadas, como mostrar detalles específicos de un registro en una nueva página.
{% stepper %} {% step %} #### **Configurar la página de destino** Agrega un componente como Avonni Record Detail a la página de destino (p. ej., CustomerDetails). En su atributo "Record ID", usa la expresión {!Route.recordId} para capturar un parámetro de URL llamado recordId.
{% endstep %} {% step %} #### **Configurar el botón** En la página origen (p. ej., la página principal), agrega un Avonni Button. En la **Navegar** configuración, elige **Página nombrada** y escribe el nombre API (p. ej., CustomerDetails). {% endstep %} {% step %} #### **Agregar parámetros** * **Nombre:** Introduce recordId (coincidiendo con el atributo del componente de destino). * **Valor:** Selecciona un campo (p. ej., {!Record.Id}) o introduce un ID de registro específico para pasar.
{% endstep %} {% step %} *Por qué es útil* Esta función te permite enviar datos dinámicos (p. ej., un ID de registro) a la página de destino, personalizando su contenido. Por ejemplo, hacer clic en un botón en la página principal puede llevar a los usuarios a una página CustomerDetails que muestre la información de un Contacto específico basada en el recordId pasado. {% endstep %} {% step %} *Analogía* Piénsalo como dirigir una carta: Navegar a una página nombrada es el sobre, y el parámetro de URL (p. ej., recordId) es la dirección, indicando al sistema a dónde ir y qué datos traer {% endstep %} {% step %} *Solución de problemas* Si la página de destino no carga correctamente, asegúrate de que el parámetro recordId coincida con el atributo del componente de destino y que el ID sea válido. {% endstep %} {% endstepper %} ### **Navegar a un artículo de Knowledge** 1. Selecciona **Navegar** y elige **Artículo de Knowledge**. 2. **Nombre de URL:** Introduce la expresión `{{Record.UrlName}}` para vincular dinámicamente al artículo de Knowledge asociado con el registro actual. 3. *¿Por qué esto?* Dirige a los usuarios a una página específica de artículo de Knowledge basada en el `UrlName` del registro actual, simplificando el acceso al contenido de soporte. 4. *Consejo:* La `{{Record.UrlName}}` expresión utiliza la sintaxis LWR para extraer el nombre de URL único del artículo de Knowledge (p. ej., desde un registro relacionado). Asegúrate de que el registro tenga un `UrlName` campo válido rellenado. 5. *Solución de problemas:* Si la navegación falla, verifica que el `UrlName` campo exista y contenga un segmento de URL válido del artículo de Knowledge (p. ej., article-title); comprueba los permisos de usuario para acceder al artículo. *** ## Ejemplos ### **Ejemplo 1: Navegar a la página de soporte** Este ejemplo añade un botón para navegar a una página de soporte en un sitio Experience Cloud. 1. **Configurar botón:** * **Etiqueta:** "Obtener soporte" * **Nombre del icono:** utility:help * **Variante:** neutral * *¿Por qué esto?* Crea un botón de ayuda para la asistencia al usuario. 2. **Establecer enlace a interacción:** * **Navegar:** * **Tipo:** Página nombrada * **Nombre de la página:** Customer\_Support\_\_c * *¿Por qué esto?* Redirige a la página CustomerSupport definida en Experience Builder. **Resultado:** Los usuarios hacen clic en el botón desde cualquier página y navegan a la página de soporte.
*** ## Consideraciones clave * **Precisión del objetivo:** Asegúrate de que los nombres de página o IDs coincidan exactamente. * **Rendimiento:** Mantén los destinos de navegación ligeros. * **Accesibilidad:** Prueba el enfoque del botón y el contraste. * **Seguridad:** Valida las URL externas para prevenir problemas. *** ## Solución de problemas comunes * **Navegación que no funciona:** Revisa el tipo y el objetivo seleccionados (p. ej., Nombre de página correcto o ID de registro); verifica los permisos. * **Página no encontrada:** Asegúrate de que la página nombrada u objeto exista en Experience Builder. * **Fallo de ID dinámico:** Confirma que la fuente del ID de registro (p. ej., {!Record.Id}) sea válida. * **Si los problemas persisten:** Contacta a nuestro equipo de soporte en para obtener ayuda. *** ## Resumen El componente Avonni Navigate mejora los sitios Experience Cloud con acciones de navegación personalizables. Es perfecto para guiar a los usuarios a páginas o recursos --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-es/panel-de-propiedades/interacciones/navegar.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.