{"section":"tutorials","requestedLocale":"es","requestedSlug":"extensibilidad-en-vtex-sales-app","locale":"es","slug":"extensibilidad-en-vtex-sales-app","path":"docs/es/tutorials/vtex-sales-app/extensibilidad-en-vtex-sales-app.md","branch":"main","content":"> ℹ️ Esta funcionalidad se encuentra en fase beta, lo que significa que estamos trabajando para mejorarla. Si tienes alguna duda, ponte en contacto con [nuestro Soporte](https://help.vtex.com/es/support).\n\nLa **extensibilidad** es una funcionalidad que permite personalizar la jornada de ventas predeterminada en VTEX Sales App mediante la inclusión de recursos alineados con el modelo de negocio de la tienda. Esta funcionalidad permite integrar experiencias personalizadas en puntos específicos de la interfaz sin necesidad de crear una solución desde cero.\n\nEn este artículo encontrarás información general sobre la extensibilidad, casos de uso de las extensiones y orientaciones para su implementación.\n\n> ❗ La implementación de la extensibilidad de VTEX Sales App es responsabilidad de los retailers y partners. Por este motivo, te recomendamos consultar nuestra [documentación para desarrolladores](https://developers.vtex.com/docs/guides/sales-app-extensions-implementation).\n\n## Funcionamiento de la extensibilidad\n\nLa extensibilidad es una solución nativa para que las tiendas se integren con APIs externas e interactúen con datos de otras aplicaciones, con seguridad y estabilidad. La funcionalidad utiliza puntos de extensión predefinidos, en los cuales se pueden renderizar componentes y agregar recursos sin alterar el flujo principal de VTEX Sales App.\n\nExisten ocho puntos de extensión en VTEX Sales App:\n\n- `cart.cart-list.after`\n- `cart.cart-item.after`\n- `cart.order-summary.after`\n- `pdp.sidebar.before`\n- `pdp.sidebar.after`\n- `pdp.content.after`\n- `menu.item`\n- `menu.drawer-content`\n\n> ℹ️ Consulta más información sobre los puntos de extensión en [Exploring Sales App extensions](https://developers.vtex.com/docs/guides/exploring-sales-app-extensions).\n\nCada punto de extensión permite la interacción de los usuarios con datos y funciones específicas y están disponibles en los siguientes contextos de la jornada de venta:\n\n- Carrito de compras (`cart.cart-item.after`, `cart.cart-list.after`) y checkout (`cart.order-summary.after`):\n\n  ![extensibilidade_vtex_sales_app_1_cart_checkout_ES](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/vtex-sales-app/extensibilidade_vtex_sales_app_1_cart_checkout_ES.png)\n\n- Página de detalles del producto (`pdp.sidebar.before`, `pdp.sidebar.after`, `pdp.content.after`):\n\n  ![extensibilidade_vtex_sales_app_4_pdp_ES](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/vtex-sales-app/extensibilidade_vtex_sales_app_4_pdp_ES.png)\n\n- Menú (`menu.item`) y modal lateral (`menu.drawer-content`):\n\n  ![extensibilidade_vtex_sales_app_2_menu_ES](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/vtex-sales-app/extensibilidade_vtex_sales_app_2_menu_ES.png)\n\n  ![extensibilidade_vtex_sales_app_3_drawer_ES](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/vtex-sales-app/extensibilidade_vtex_sales_app_3_drawer_ES.png)\n\n  > ℹ️ Cuando la persona usuaria hace clic en el componente de la extensión del menú, VTEX Sales App abre un modal a la izquierda de la interfaz. Este comportamiento permite crear múltiples flujos de navegación internos.\n\n## Seguridad y estabilidad de extensiones\n\nAl ser una solución nativa, la extensibilidad evita comportamientos inesperados y contribuye a la continuidad de las operaciones de la tienda. Algunos de los principales objetivos de la funcionalidad son:\n\n- **Seguridad:** aumentar la seguridad para desarrolladores en la implementación de código.\n- **Estabilidad:** promover la estabilidad de la aplicación, incluso en escenarios de fallas en personalizaciones.\n- **Compatibilidad:** preservar la compatibilidad de las extensiones con las personalizaciones, de forma que las actualizaciones de VTEX Sales App no comprometan las modificaciones realizadas por la tienda.\n\n## Casos de uso de extensiones\n\nLa siguiente tabla presenta ejemplos en los que el retailer se beneficia de la extensibilidad:\n\n| Contexto | Descripción |\n| :--- | :--- |\n| Integración con servicios o datos externos | Integración con programas de fidelidad, venta de servicios adicionales (como garantías o seguros), aplicación de descuentos asociados a cambios de producto, comisión o financiamiento internos, entre otros. En general, son integraciones con datos y servicios externos que ya se utilizan en la tienda de ecommerce o en la tienda física. |\n| Integración con datos de VTEX | Integración con soluciones de VTEX que no forman parte de la jornada predeterminada de VTEX Sales App, como el ecosistema de marketplace o algunas soluciones de pago. |\n| Centralización de tareas de vendedores | Centralización de las tareas cotidianas de los vendedores, como la captura de leads y la consulta de datos de gestión de la tienda, en una única plataforma para aumentar la agilidad y la eficiencia. |\n\n## Antes de empezar\n\nRecomendamos que los desarrolladores instalen la skill de extensiones de VTEX Sales App, que ayuda en las etapas de definición e implementación del proyecto. Consulta más información en [VTEX Sales App Extensions Skill](https://developers.vtex.com/docs/guides/vtex-sales-app-extensions-skill).\n\n## Planificar el ámbito del proyecto\n\nEl primer paso es la planificación, en la cual el retailer o el partner debe delimitar el ámbito de lo que se implementará.\n\n**Ejemplo:** una tienda vende material para construcción y el ámbito de su proyecto será agregar a la página de producto (PDP) una calculadora que mide la cantidad de material necesaria por metro cuadrado (m²) construido. Así, el cliente de la tienda podrá saber que necesita comprar 4 kilogramos (kg) de mortero por cada metro cuadrado.\n\n## Mapear la experiencia del usuario y los requisitos técnicos\n\nEl segundo paso es mapear de forma detallada los flujos de la experiencia del usuario (UX) y los requisitos técnicos para esta implementación.\n\n> ⚠️ Si el proyecto tiene flujos y requisitos muy complejos, te recomendamos asignar para esta etapa a un profesional especializado, como un diseñador o un gestor de producto, por ejemplo.\n\n**Ejemplo:** en la tienda de materiales para construcción, el mapeo incluiría, de forma simplificada, el acceso del usuario a la calculadora en el flujo de compra, su visualización en la interfaz y los cálculos que permite realizar. El mapeo de los requisitos técnicos implicaría detallar la relación entre las operaciones de esa calculadora y los datos de los sistemas de checkout, catálogo y stock de la tienda durante la implementación.\n\n> ℹ️ Cuando el recurso ya está implementado en la tienda de ecommerce, la experiencia del usuario en VTEX Sales App debe ser lo más similar posible para mantener la coherencia de la experiencia en los canales de venta de la tienda.\n\n## Verificar la viabilidad técnica\n\nEl tercer paso es validar la viabilidad técnica del proyecto. Para ello, el desarrollador debe verificar si los requisitos y las integraciones mapeados son compatibles con las especificaciones de los puntos de extensión, como se indica en la [documentación de extensibilidad para desarrolladores](https://developers.vtex.com/docs/guides/sales-app-extensions-implementation).\n\n> ⚠️ Si se identifica la inexistencia de alguna función o configuración obligatoria, te recomendamos ponerte en contacto con nuestro [Soporte](https://help.vtex.com/es/support), describiendo el caso de uso y las limitaciones encontradas.\n\n## Implementar el proyecto\n\nPor último, el desarrollador implementa las extensiones, como se indica en la [documentación técnica de extensibilidad](https://developers.vtex.com/docs/guides/sales-app-extensions-implementation). Te recomendamos validar la implementación con pruebas locales antes de poner a disposición las extensiones para los clientes de la tienda.\n\n> ℹ️ **Extensions Skill** puede ayudar en la etapa de implementación del proyecto. Consulta más información en [VTEX Sales App Extensions Skill](https://developers.vtex.com/docs/guides/vtex-sales-app-extensions-skill)."}