{"section":"tutorials","requestedLocale":"es","requestedSlug":"como-activar-la-app-carrito-compartido","locale":"es","slug":"como-activar-la-app-carrito-compartido","path":"docs/es/tutorials/pedidos/televentas-y-servicio-al-cliente/como-activar-la-app-carrito-compartido.md","branch":"main","content":"La app [Carrito Compartido](https://apps.vtex.com/vtex-social-selling/p) permite a los vendedores seleccionar productos para sus clientes y compartir el carrito lleno por canales como WhatsApp, Facebook Messenger y correo electrónico.\n\n![Shareable Cart Demo](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pedidos/televentas-y-servicio-al-cliente/como-activar-la-app-carrito-compartido_1.gif)\n\nEste artículo explica cómo instalar la app y configurar la funcionalidad en su tienda. Una vez completados los pasos de activación, sus vendedores podrán seguir las [instrucciones de uso](/es/docs/tutorials/como-usar-la-app-carrito-compartido) para comenzar sus estrategias de Social Selling.\n\n## Instalación\n\nPara instalar la aplicación en su tienda, realice los siguientes pasos:\n\n1. Acceda a la [página de la app](https://apps.vtex.com/vtex-social-selling/p) en VTEX App Store.\n2. Haga clic en el botón **Obtener**.\n3. Introduzca el nombre de su cuenta en el campo **Información de la cuenta**.\n4. Haga clic en el botón **Confirmar pedido e iniciar instalación**.\n5. Haga clic en el botón **Instalar**. \n\nUna vez completados estos pasos, la app se instalará en la cuenta informada. El siguiente paso es revisar la configuración de la app para ajustarla a las necesidades de su tienda.\n\n> ⚠️ El nombre de su cuenta es el identificador utilizado para acceder a su Admin, en el lugar de \\{accountName\\} en la dirección: `https://{accountName}.myvtex.com/admin`\n\n## Configuración\n\nAl finalizar la instalación de la app en su tienda, será dirigido a su página de configuración. Se puede encontrar en *Apps > Mis Apps > Social Selling > Configuración*.\n\nRevise los detalles de cada configuración a continuación. Si necesita hacer algún ajuste, no olvide pulsar el botón **Guardar** para que se apliquen los cambios en su tienda.\n\n### Activar app\n\nCuando está activada, esta configuración hace que la interfaz de carrito compartible aparezca para los usuarios que acceden a su tienda a través del enlace:\n\n`https://{Dirección web de su tienda}/checkout/?socialselling=on`\n\nCuando está desactiva, la interfaz deja de aparecer para todos los usuarios.\n\n### Agregar vendedor\n\nEsta configuración permite activar la identificación de los vendedores a través de campos específicos en el pedido.\n\n- __Activo__: permite mostrar u ocultar el botón __Agregar código de vendedor__ en la interfaz de carrito compartible.\n\n- __Agregar utmiCampaign__: habilita el campo `utmiCampaign` para rellenar.\n\n- __Agregar marketingTag__: habilita el campo `marketingTag` para rellenar.\n\nLa elección del campo en el que se ingresará el código del vendedor depende de las necesidades de la tienda. En el formulario de pedido, `utmiCampaign` recibe apenas un valor, mientras que `marketingTags` permite ingresar múltiples valores.\n\nSi se seleccionan ambas alternativas, el vendedor debe indicar qué campo está rellenando en la interfaz de carrito compartible.\n\n> ℹ️ La información registrada puede encontrarse en el card **Promociones y Marketing** en los [detalles del pedido](/es/docs/tracks/ver-detalles-del-pedido) o en el objeto `marketingData` devuelto al obtener la información del pedido mediante [Orders API](https://developers.vtex.com/docs/api-reference/orders-api#get-/api/oms/pvt/orders/-orderId-).\n\n### Canales\n\nEsta configuración le permite activar los canales que desea utilizar en la interfaz para compartir el carrito.\n\n- Whatsapp\n- Facebook Messenger\n- SMS\n- Enlace \n- Gmail\n- Correo electrónico \n\n> ⚠️ Recuerde que el vendedor deberá iniciar sesión en las cuentas de las redes sociales y aplicaciones utilizadas para compartir en el dispositivo empleado para crear el carrito.\n\n## Personalización (opcional)\n\nSi desea personalizar los colores de los botones de la interfaz de carrito compartible de su tienda, esto es posible a través de la [personalización del Checkout](/es/tutorial/configurar-template-no-smartcheckout--frequentlyAskedQuestions_599).\n\nEn la siguiente imagen, la opción A muestra los colores originales y la opción B una posible personalización.\n\n![shareable-cart-ui-customization](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pedidos/televentas-y-servicio-al-cliente/como-activar-la-app-carrito-compartido_2.png)\n\nEl código que figura a continuación debe añadirse al final del archivo `checkout5-custom.css` o `checkout6-custom.css`, disponible para su personalización en *Configuración de la tienda > Checkout > Código*. El archivo que debe editarse depende de la versión de Checkout utilizada por su tienda.\n\n> ❗ **Atención:** Errores en la personalización del checkout pueden afectar el flujo de compras de sus clientes. En caso de que no entienda el siguiente código, pida ayuda a su equipo técnico.\n\nLuego, basta con cambiar las propiedades en el código CSS según sea necesario. \n\n```\n/* START Pick Color Nuevo Carrito */\n.sb-b-erasecart .sb-icon,\n.sb-b-erasecart .sb-label,\n.sb-b-erasecart a:hover .sb-icon {\n color: #fff!important;\n background-color: #ee38ed!important\n}\n/* END Pick Color Nuevo Carrito */\n/* START Pick Color Codigo Vendedor */\n.sb-b-codigovendedor .sb-icon,\n.sb-b-codigovendedor .sb-label,\n.sb-b-codigovendedor a:hover .sb-icon {\n color: #fff!important;\n background-color: #a62a9a!important\n}\n/* END Pick Color Codigo Vendedor */\n/* START Pick Color Whatsapp */\n.sb-b-whatsapp .sb-icon,\n.sb-b-whatsapp .sb-label,\n.sb-b-whatsapp a:hover .sb-icon {\n color: #fff!important;\n background-color: #ad28ac!important\n}\n/* END Pick Color Whatsapp */\n/* START Pick Color Facebook Messenger */\n.sb-b-facebook-messenger .sb-icon,\n.sb-b-facebook-messenger .sb-label,\n.sb-b-facebook-messenger a:hover .sb-icon {\n color: #fff!important;\n background-color: #8e208d!important\n}\n/* END Pick Color Facebook Messenger */\n/* START Pick Color SMS */\n.sb-b-sms .sb-icon,\n.sb-b-sms .sb-label,\n.sb-b-sms a:hover .sb-icon {\n color: #fff!important;\n background-color: #751b74!important\n}\n/* END Pick Color SMS */\n/* START Pick Color Link */\n.sb-b-link .sb-icon,\n.sb-b-link .sb-label,\n.sb-b-link a:hover .sb-icon {\n color: #fff!important;\n background-color: #5a155a!important\n}\n/* END Pick Color Link */\n/* START Pick Color GMAIL */\n.sb-b-gmail .sb-icon,\n.sb-b-gmail .sb-label,\n.sb-b-gmail a:hover .sb-icon {\n color: #fff!important;\n background-color: #480b48!important\n}\n/* END Pick Color GMAIL */\n/* START Pick Color Email */\n.sb-b-email .sb-icon,\n.sb-b-email .sb-label,\n.sb-b-email a:hover .sb-icon {\n color: #fff!important;\n background-color: #330133!important\n}\n/* END Pick Color Email */\n/* START Pick Color BUTTON OK */\n.swal2-styled.swal2-confirm {\n border: 0!important;\n border-radius: .25em!important;\n background: initial!important;\n background-color: #31c431!important;\n color: #fff!important;\n font-size: 1.0625em!important;\n}\n/* END Pick Color BUTTON OK */\n/* START Pick Color BUTTON CANCEL */\n.swal2-styled.swal2-cancel {\n border: 0!important;\n border-radius: .25em!important;\n background: initial!important;\n background-color: #a0a0a0!important;\n color: #fff!important;\n font-size: 1.0625em!important;\n}\n/* END Pick Color BUTTON CANCEL */\n```\n\n## Preguntas frecuentes (FAQ)\n\n### ¿Cómo esta funcionalidad es técnicamente posible?\n\nLa app utiliza la funcionalidad de [carrito compartido](/es/docs/tutorials/que-es-el-carrito-compartido) de VTEX, que permite que más de un cliente añada, elimine o actualice ítems e información de un mismo carrito.\n\n### ¿Cómo identificar al vendedor y a la promoción?\n\nPresentamos algunas posibilidades en la tabla de abajo. Recomendamos que el equipo de soporte técnico de la tienda evalúe la forma más sencilla de satisfacer las necesidades comerciales.\n\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
EscenarioDescripciónDetalles
**1**utmi_campaign + marketingTag\n `utmiCampaign = codigoVendedor`\n `marketingTags[1] = promo10off`\n
**2**marketingTag\n `marketingTags[1] = codigoVendedor`\n `marketingTags[2] = promo10off`\n
**3**utmi_campaign + cupón\n `utmiCampaign = codigoVendedor`\n `coupon = cuponDescuento`\n
**4**cupon`coupon = cuponDescuentoVendedor`
\n\n> ℹ️ En el escenario 4 es necesario [generar cupones masivamente](/es/tutorial/consigo-gerar-um-cupom-em-massa--frequentlyAskedQuestions_348), para que cada vendedor tenga su propio cupón para la identificación y la activación del descuento.\n\n### ¿Quién rellena los datos personales y la dirección: el vendedor o el cliente?\n\nEl vendedor no necesita iniciar sesión para empezar la navegación y seleccionar los productos. El ingreso de los datos personales y la dirección por parte del vendedor es **opcional**.\n\nPor consiguiente, tanto el vendedor como el cliente pueden ingresarlos, según la preferencia del cliente. **Los datos de pago siempre deben ser ingresados por el cliente**.\n\n### ¿Tendrá el vendedor acceso a datos confidenciales, como la dirección y el pago?\n\nNo, el vendedor no tendrá acceso a los datos confidenciales del cliente. Aunque el vendedor rellene los datos personales y de entrega, el cliente podrá cambiarlos al recibir el enlace.\n\nPor lo tanto, incluso si el cliente recibe un enlace con los datos del vendedor vinculados, **necesita** confirmar en nombre de quién y en qué dirección, de hecho, se hará la compra.\n\n### ¿Cómo puede el vendedor abordar al cliente?\n\nPara que el abordaje del vendedor sea efectivo, lo ideal es presentar condiciones promocionales diferenciadas para privilegiar las ventas asistidas en relación con las compras realizadas directamente a través del comercio electrónico.\n\n**Si el vendedor ya tiene un historial de contacto con el cliente**, puede contactar y atender la venta en tiempo real, creando el carrito mientras habla con el cliente.\n\n**Si no tiene ese contacto directo**, el vendedor puede crear opciones de carrito según la estrategia de marketing y/o el perfil del cliente. Y luego abordar al cliente de forma activa, presentando las diferencias de cada opción.\n\n### ¿Cómo puede el vendedor hacer un seguimiento de los pedidos?\n\nEl cliente siempre tendrá acceso al seguimiento de su pedido por correo electrónico. **Por eso, es esencial asegurarse de que se rellene correctamente**.\n\nPara que el vendedor también tenga acceso puede:\n\n- Utilizar el SAC de la empresa para atención a los vendedores.\n- Crear una página de consulta de ventas personalizada.\n\nLa página de consulta de ventas personalizada se desarrollaría utilizando las [APIs de VTEX](https://developers.vtex.com/docs/getting-started-list-of-rest-apis) para consultar los pedidos que utilizaron el código del vendedor, dar visibilidad al status de cada pedido y facilitar el control de la conversión, la entrega y el cálculo de la comisión.\n\n### ¿Cómo alterar un carrito que ya ha sido compartido?\n\nSolo tiene que abrir el enlace compartido para cargar el carrito y hacer las alteraciones necesarias. Todos los usuarios con acceso al enlace pueden ver los ítems, añadir y eliminar productos, e incluso pagar el pedido.\n\n### Si altero los ítems o datos de un carrito, ¿esto afecta otros carritos compartidos anteriormente?\n\nNo. Todos los cambios afectan solamente el carrito al que se accedió, identificable por el parámetro orderFormId visto en el enlace compartido.\n\n### ¿Por cuánto tiempo existe un carrito compartido?\n\nCada carrito compartido creado tiene validez hasta que se finalice la compra o por un período máximo de dos años.\n\n### ¿Por qué debo generar un nuevo carrito con cada venta?\n\nEl carrito compartido funciona como un carrito de compras normal, cada comprador debe tener el suyo. Compartir no crea varios carritos con los ítems escogidos, solo permite que más de un usuario modifique su contenido."}