{"section":"tutorials","requestedLocale":"es","requestedSlug":"configurar-pago-con-easypay","locale":"es","slug":"configurar-pago-con-easypay","path":"docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay.md","branch":"main","content":"En VTEX, puedes realizar la integración con el proveedor de servicios de pago easypay. A través de este proveedor, tu tienda puede vender utilizando easypay, MB Way y Multibanco.\n\nPara utilizar easypay, debes:\n\n- [Instalar la aplicación easypay](#instalar-la-aplicacion-easypay)\n- [Configurar la aplicación easypay](#configurar-la-aplicacion-easypay)\n- [Configurar el webhook de easypay](#configurar-el-webhook-de-easypay)\n- [Configurar la afiliación de easypay](#configurar-la-afiliacion-de-easypay)\n- [Configurar el pago con Apple Pay en easypay (opcional)](#configurar-el-pago-con-apple-pay-en-easypay-opcional) \n\n> ⚠️ Si eres marketplace o seller, consulta los artículos [Configurar pago con easypay en marketplace](/es/docs/tutorials/configurar-pago-con-easypay-marketplace) o [Configurar pago con easypay seller account](/es/docs/tutorials/configurar-pago-con-easypay-seller).\n\n## Instalar la aplicación easypay\n\nPara instalar la aplicación easypay, sigue los pasos que se indican a continuación:\n\n1. En [VTEX IO CLI](https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-install), ejecuta el comando `vtex login nombredelacuenta` para iniciar sesión.\n2. Instala la aplicación easypay ingresando el comando `vtex install easypaypartnerpt.payment-provider-easypay`. \n\n## Configurar la aplicación easypay\n\nUna vez instalada la aplicación easypay, debes configurarla. Para acceder a la pantalla de configuración, sigue estos pasos:\n\n1. En el Admin VTEX, accede a __Hub de extensiones > Gestión de aplicaciones__, o ingresa __Gestión de aplicaciones__ en la barra de búsqueda en la parte superior de la página. \n2. Busca la aplicación __Easypay Payment Provider__ y haz clic en __Configuración__.\n\nLa información de configuración se divide en cuatro secciones:\n\n- [Credenciales de easypay (obligatorio)](#Credenciales-de-easypay)\n- [Pago (obligatorio)](#pago)\n- [Personalización del checkout de easypay (opcional)](#personalizacion-del-checkout-de-easypay)\n- [Modo sandbox](#modo-sandbox)\n\n![easypay_pt_1](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay_1.png)\n\n> ⚠️ Debes realizar la configuración en [el entorno easypay](https://backoffice.easypay.pt/). El control de estas configuraciones es responsabilidad de easypay, por lo tanto, VTEX no garantiza que los pasos a continuación estén siempre actualizados. Utiliza este documento como referencia y consulta tu cuenta en el [entorno de easypay](https://backoffice.easypay.pt/) para obtener información actualizada.\n\n### Credenciales de easypay\n\nLa información solicitada en esta sección es obligatoria.\n\n__Key ID y Key Value__: valor e ID de la clave easypay.\n\n
1. En el [entorno easypay](https://backoffice.easypay.pt/), haz clic en el logotipo de easypay situado en la parte superior izquierda de la pantalla, y en el ícono de la flecha que señala la cuenta deseada.\n\n![easypay_pt_2](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay_2.PNG)\n\n
2. Accede a **Web Services > Configuración API 2.0 > Keys**.\n\n![easypay_es_3](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay_3.png)\n\n
3. Copia y guarda la información **ID** y **Key**.\n\n![easypay_es_4](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay_4.png)\n\n__Merchant account UID__: identificación de la cuenta del comerciante en la que se abonarán los valores de la compra de productos adquiridos en la tienda. Si no dispones de una cuenta comerciante independiente, puedes utilizar el \"Account UID\" de la cuenta donde recibirás los pagos.\n\n
1. En el [entorno easypay](https://backoffice.easypay.pt/), haz clic en el logotipo de easypay situado en la esquina superior izquierda de la pantalla y, a continuación, en la cuenta \"COMERCIANTE 1\", haz clic en la flecha.\n\n![easypay_pt_5](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay_5.PNG)\n\n
2. Copia y guarda la información del **Account UID**.\n\n![easypay_es_6](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay_6.png)\n\n__Margin account UID__: identificación de la cuenta de margen.\n\n> ℹ️ Este campo solo debe rellenarse cuando la tienda es un marketplace y realiza split de pagos. Para más información, consulta el artículo [Configurar pago con easypay en marketplaces](/es/docs/tutorials/configurar-pago-con-easypay-marketplace).\n\n__Refund account ID e Refund account key__: si no existe una cuenta específica para reembolso, el valor de __Key ID__ deberá rellenarse en el campo __Refund account ID__, y el valor de __Key value__ en __Refund account key__.\n\n### Pago\n\nEn esta sección, debes indicar si tu tienda utilizará pagos asíncronos, síncronos o ambos. Accede a la documentación de easypay para consultar los [medios de pagos](https://docs.quality-utility.aws.easypay.pt/concepts/payment-methods) disponibles y sus respectivas [siglas](https://docs.quality-utility.aws.easypay.pt/checkout/reference) de identificación.\n\n![easypay_es_7](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay_7.png)\n\n__Tipos de pago asíncronos aceptados__: medios de pago asíncronos disponibles para el cliente. Ingresa solamente las siglas de los tipos de asíncronos, separadas por comas, sin puntos ni espacios.\n\nEjemplo:\n\n| Correcto | Incorrecto |\n| ---------------- | ---------------- |\n| mb,dd,vi | mb, dd, vi |\n\n> ⚠️ Si se rellena este campo, también será obligatorio rellenar el campo **Días para que expiren los pagos asíncronos**.\n\n__Tipos de pago síncronos aceptados__: medios de pago síncronos disponibles para el cliente. Ingresa solamente las siglas de los tipos de pago síncronos, separados por comas, sin puntos ni espacios.\n\nEjemplo:\n\n| Correcto | Incorrecto |\n| ---------------- | ---------------- |\n| cc,mbw | cc, mbw |\n\n__Días de expiración de los pagos asíncronos__: tiempo de vencimiento (en días) de los pagos asíncronos. Ingresa solo el número de días deseados. \n\nEjemplo:\n\n| Correcto | Incorrecto |\n| ---------------- | ---------------- |\n| 10 | 10 días, Dic o 10/05/2023 |\n\n### Personalización del checkout de easypay\n\neasypay tiene un diseño de checkout nativo configurado en la aplicación, como se muestra a continuación:\n\n![easypay_es_8](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay_8.png)\n\nSi deseas realizar algún tipo de personalización en el checkout nativo de easypay, rellena uno o más campos de esta sección:\n\n- __Checkout logo URL__: ogotipo que debe mostrarse en el checkout de easypay. Ingresa el link con la dirección de la imagen que deseas utilizar.\n- __Checkout background color__: color del fondo. Ingresa el código HEX del color deseado. Predeterminado nativo: #ffffff.\n- __Checkout accent color__: color de los elementos destacados, botones predeterminados y bordes de los inputs. Ingresa el código HEX del color deseado. Predeterminado nativo: #0d71f9.\n- __Checkout error color__: color de los mensajes de error. Ingresa el código HEX del color deseado. Predeterminado nativo: #ff151f.\n- __Checkout input background color__: color de fondo de los inputs. Ingresa el código HEX del color deseado. Predeterminado nativo: transparente.\n- __Checkout input border color__: color del borde de los inputs. Ingresa el código HEX del color deseado. Predeterminado nativo: el mismo color utilizado en __accent color__.\n- __Checkout input border radius__: permite definir el redondeado de los bordes de los inputs. Ingresa el valor deseado en píxeles (solo números). Predeterminado nativo: 50 píxeles.\n\nEjemplo:\n\n| Correcto | Incorrecto |\n| ---------------- | ---------------- |\n| 35 | 35px |\n\n- __Checkout button background color__: color de fondo de los botones. Ingresa el código HEX del color deseado. Predeterminado nativo: el mismo color utilizado en __accent color__.\n- __Checkout button border radius__: permite definir el redondeado de los bordes de los botones. Ingresa el valor deseado en píxeles (solo números). Predeterminado nativo: 50 píxeles.\n\nEjemplo:\n\n| Correcto | Incorrecto |\n| ---------------- | ---------------- |\n| 30 | 30px |\n\n- __Checkout button box shadow__: opción que permite activar o desactivar la sombra de los botones.\n- __Checkout font family__: fuentes utilizadas en textos. Ingresa el _generic family name_, _web safe font_ o link de la fuente. Predeterminado nativo: Overpass. Ejemplo correcto: sans-serif, verdana, ou https://fonts.gstatic.com/s/overpass/v12/qFda35WCmI96Ajtm83upeyoaX6QPnlo6_PPbM5qKl8Kuo8AzesE.woff2\n\n- __Checkout base font size__: permite definir el tamaño de la fuente en el elemento raíz. Ingresa el valor deseado en píxeles (solo números). Predeterminado nativo: 10 píxeles.\n\nEjemplo:\n\n| Correcto | Incorrecto |\n| ---------------- | ---------------- |\n| 11 | 11px |\n\n> ⚠️ No utilices fuentes de más de 12 píxeles, ya que pueden distorsionar la visualización del layout.\n\n### Modo Sandbox\n\nPara activar el entorno de pruebas de desarrollo, selecciona la opción __Enable sandbox mode__. Debes utilizar credenciales de prueba.\n\nUna vez rellenados los campos de configuración, haz clic en __Save__.\n\n## Configurar el webhook de easypay\n\nPara configurar el webhook de easypay, sigue los pasos que se indican a continuación:\n\n
1. En el [entorno easypay](https://backoffice.easypay.pt/), haz clic en el logotipo de easypay situado en la parte superior izquierda de la pantalla, y en el ícono de la flecha que señala la cuenta deseada.\n\n![easypay_pt_2](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay_9.PNG)\n\n
2. Accede a **Web Services > URL Configuration**.\n\n
3. En **URL: Notify**, ingresa el link a continuación, modificando solamente la información del nombre real de tu tienda marketplace.\n\n`https://{nombre-de-tu-cuenta}.myvtex.com/_v/easypaypartnerpt.payment-provider-easypay/webhook`\n\n![easypay_es_9](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/es/tutorials/pagos/configuración-de-pagos/configurar-pago-con-easypay_10.png)\n\n
4. Haz clic en **Submit**.\n\n## Configurar la afiliación easypay\n\nPara configurar la afiliación easypay, sigue los pasos a continuación:\n\n1. En el Admin VTEX, accede a __Configuración de la tienda > Pago > Proveedores__, o escribe __Proveedores__ en la barra de búsqueda en la parte superior de la página.\n2. En la pantalla de proveedores, haga clic en el botón `Nuevo proveedor`.\n3. Escriba el nombre __easypay__ en la barra de búsqueda y haga clic en el nombre del proveedor.\n4. Rellena los campos __Clave de aplicación__ y __Token de aplicación__ con los datos de tu cuenta easypay.\n5. Si desea modificar el nombre de identificación que se mostrará para el proveedor easypay en la pantalla VTEX Admin, ingrese la información en el campo __Nombre__ en __Información general__.\n6. En __Control de pago__, seleccione si desea activar el proveedor en un entorno de prueba haciendo clic en __Activar modo de prueba__.\n7. Si desea utilizar [Split de pagos](/es/docs/tutorials/split-de-pagos) en su tienda, seleccione la opción __Activar split de cobros y enviar destinatarios de pago__ e indique el __Responsable de cargos de procesamiento de pagos__ y el __Responsable de contracargos__ (marketplace, sellers o marketplace y sellers).\n8. Haz clic en `Guardar`.\n\n## Configurar el pago con Apple Pay en easypay (opcional) \n\nPara procesar pagos con Apple Pay en easypay, primero debes realizar configuraciones para habilitar tu tienda en el entorno de Apple Pay. Obtenga más información en [Setting up Merchant ID in Apple Pay](https://developers.vtex.com/docs/guides/setting-up-merchant-id-in-apple-pay). \n\nPara configurar otros medios de pago que easypay procesará, accede a [Configurar condiciones de pago](/es/docs/tutorials/condiciones-de-pago).\n\nPara establecer condiciones especiales en los medios de pago, accede a [Configurar condiciones especiales de pago](/es/docs/tutorials/condiciones-especiales).\n\nas seguir los pasos indicados, el conector easypay puede demorar hasta 10 minutos en aparecer en el checkout de tu tienda como medio de pago."}