{"section":"tutorials","requestedLocale":"pt","requestedSlug":"configurar-pagamento-com-easypay","locale":"pt","slug":"configurar-pagamento-com-easypay","path":"docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay.md","branch":"main","content":"Na VTEX, você pode integrar com o provedor de pagamento easypay. Por meio deste provedor, sua loja pode efetuar vendas utilizando a easypay, MBWay e MultiBanco.\n\nPara utilizar easypay, é necessário:\n\n- [Instalar o app easypay](#instalar-o-app-easypay)\n- [Configurar o app easypay](#configurar-o-app-easypay)\n- [Configurar Webhook easypay](#configurar-webhook-easypay)\n- [Configurar afiliação easypay](#configurar-afiliacao-easypay)\n- [Configurar pagamento com Apple Pay na easypay (opcional)](#configurar-pagamento-com-apple-pay-na-easypay-opcional)    \n\n> ⚠️ Caso você seja um marketplace ou seller, acesse os artigos [Configurar pagamento com easypay no Marketplace](/pt/docs/tutorials/configurar-pagamento-com-easypay-marketplace) ou [Configurar pagamento com easypay seller](/pt/docs/tutorials/configurar-pagamento-com-easypay-seller).\n\n## Instalar o app easypay\n\nPara instalar o app easypay, siga os passos abaixo:\n\n1. No [VTEX IO CLI](https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-install), execute o comando `vtex login nomedaconta` para realizar o login em sua conta.\n2. Instale o app easypay por meio do comando `vtex install easypaypartnerpt.payment-provider-easypay`. \n\n## Configurar o app easypay\n\nApós realizar a instalação do App easypay, você precisa configurá-lo. Para acessar a tela de configurações, siga os passos abaixo:\n\n1. No Admin VTEX, acesse __Hub de Extensões > Gerenciamento de Aplicativos__, ou digite __Gerenciamento de Aplicativos__ na barra de busca no topo da página.\n2. Localize o app __Easypay Payment Provider__ e clique em __Configurações__.\n\nAs informações de configuração estão divididas em quatro seções:\n\n- [Credenciais easypay (obrigatório)](#credenciais-easypay)\n- [Pagamento (obrigatório)](#pagamento)\n- [Personalização do Checkout easypay (opcional)](#personalizacao-do-checkout-easypay)\n- [Modo sandbox](#modo-sandbox)\n\n![easypay_pt_1](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay_1.png)\n\n> ⚠️ Você deve realizar as configurações abaixo no [ambiente easypay](https://backoffice.easypay.pt/). O controle destas configurações é de responsabilidade da easypay, e portanto, a VTEX não garante que os passos abaixo estejam atualizados permanentemente. Utilize este documento como uma referência e consulte sua conta no [ambiente easypay](https://backoffice.easypay.pt/) para informações atualizadas.\n\n### Credenciais easypay\n\nAs informações desta seção devem ser preenchidas obrigatoriamente.\n\n__Key ID e Key Value__: valor e ID da chave easypay.\n\n<blockquote><ui>1. No [ambiente easypay](https://backoffice.easypay.pt/), clique no logotipo da easypay localizado no canto superior esquerdo da tela, e na seta da conta desejada.</ui>\n\n![easypay_pt_2](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay_2.PNG)\n\n<blockquote><ui>2. Acesse **Web Services > Configuração API 2.0 > Chaves**.</ui>\n\n![easypay_pt_3](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay_3.PNG)\n\n<blockquote><ui>3. Copie e salve as informações **ID** e **Chave**.</ui>\n\n![easypay_pt_4](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay_4.PNG)\n\n__Merchant account UID__: identificação da conta do comerciante onde serão depositados os valores das compras dos produtos efetuados na loja. Caso não haja uma conta comerciante separada, é possível utilizar o “Account UID” da conta de pagamentos.\n\n<blockquote><ui>1. No [ambiente easypay](https://backoffice.easypay.pt/), clique no logotipo da easypay localizado no canto superior esquerdo da tela, e depois na conta “COMERCIANTE 1”, clique na seta.</ui>\n\n![easypay_pt_5](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay_5.PNG)\n\n<blockquote><ui>2. Copie e salve as informações do **Account UID**.</ui>\n\n![easypay_pt_6](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay_6.PNG)\n\n__Margin account UID__: identificação da conta de margens. \n\n> ℹ️ Este campo somente deverá ser preenchido quando a loja for um marketplace e realizar split de pagamentos. Saiba mais em [Configurar pagamento com easypay no Marketplace](/pt/docs/tutorials/configurar-pagamento-com-easypay-marketplace).\n\n__Refund account ID e Refund account key__: caso não exista conta específica de reembolso, o valor do __Key ID__ deverá ser preenchido no campo __Refund account ID__, e o valor de __Key value__ em __Refund account key__.\n\n### Pagamento\n\nNesta seção, você deve indicar se a sua loja utilizará pagamentos assíncronos, síncronos ou ambos. Acesse a documentação easypay para verificar os [métodos de pagamentos](https://docs.quality-utility.aws.easypay.pt/concepts/payment-methods) disponíveis e suas respectivas [siglas](https://docs.quality-utility.aws.easypay.pt/checkout/reference) de identificação.\n\n![easypay_pt_7](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay_7.png)\n\n__Tipos de pagamento assíncronos aceites__: métodos de pagamento assíncronos disponíveis para o cliente. Preencha apenas com as siglas dos tipos de Assíncronos, separados por vírgula, sem pontos e sem espaços.\n\nExemplo:\n\n| Correto | Incorreto |\n| ---------------- | ---------------- |\n| mb,dd,vi | mb, dd, vi |\n\n> ⚠️ Caso este campo seja preenchido, será obrigatório o preenchimento do campo **Dias para expiração de pagamentos assíncronos**.\n\n__Tipos de pagamento síncronos aceites__: métodos de pagamento síncronos disponíveis para o cliente. Preencha apenas com as siglas dos tipos de Síncronos, separados por vírgula, sem pontos e sem espaços.\n\nExemplo:\n\n| Correto | Incorreto |\n| ---------------- | ---------------- |\n| cc,mbw | cc, mbw |\n\n__Dias para expiração de pagamentos assíncronos__: tempo de expiração (em dias) de pagamentos assíncronos. Preencha apenas o número de dias desejados. \n\nExemplo:\n\n| Correto | Incorreto |\n| ---------------- | ---------------- |\n| 10 | 10 dias, Dez ou 10/05/2023 |\n\n### Personalização do Checkout easypay\n\nA easypay possui um layout de Checkout nativo configurado no app. Veja abaixo:\n\n![easypay_pt_8](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay_8.png)\n\nCaso deseje realizar algum tipo de personalização no Checkout nativo da easypay, preencha um ou mais dos campos nesta seção:\n\n- __Checkout logo URL__: logotipo a ser exibido no Checkout easypay. Preencha com o link do endereço da imagem a ser utilizada.\n- __Checkout background color__: cor do background. Preencha o código HEX da cor desejada. Padrão nativo: #ffffff.\n- __Checkout accent color__: cor dos destaques, padrão de botões e bordas dos inputs. Preencha o código HEX da cor desejada. Padrão nativo: #0d71f9.\n- __Checkout error color__: cor das mensagens de erros. Preencha o código HEX da cor desejada. Padrão nativo: #ff151f.\n- __Checkout input background color__: cor do background dos inputs. Preencha o código HEX da cor desejada. Padrão nativo: transparent.\n- __Checkout input border color__: cor da borda dos inputs. Preencha o código HEX da cor desejada. Padrão nativo: a mesma cor utilizada no __accent color__.\n- __Checkout input border radius__: permite definir o arredondamento das bordas dos inputs. Preencha com o valor desejado em pixels (apenas números). Padrão nativo: 50 pixels.\n\nExemplo:\n\n| Correto | Incorreto |\n| ---------------- | ---------------- |\n| 35 | 35px |\n\n- __Checkout button background color__: cor do background dos botões. Preencha o código HEX da cor desejada. Padrão nativo: a mesma cor utilizada no __accent color__.\n- __Checkout button border radius__: permite definir o arredondamento das bordas dos botões. Preencha com o valor desejado em pixels (apenas números). Padrão nativo: 50 pixels.\n\nExemplo:\n\n| Correto | Incorreto |\n| ---------------- | ---------------- |\n| 30 | 30px |\n\n- __Checkout button box shadow__: opção que permite ativar ou desativar a sombra nos botões.\n- __Checkout font family__: fontes utilizadas em textos. Preencha com o _generic family name_, _web safe font_ ou link da fonte . Padrão nativo: Overpass. Exemplo correto: sans-serif, verdana, ou https://fonts.gstatic.com/s/overpass/v12/qFda35WCmI96Ajtm83upeyoaX6QPnlo6_PPbM5qKl8Kuo8AzesE.woff2\n\n- __Checkout base font size__: permite definir o tamanho da fonte no elemento raíz. Preencha com o valor desejado em pixels (apenas números). Padrão nativo: 10 pixels.\n\nExemplo:\n\n| Correto | Incorreto |\n| ---------------- | ---------------- |\n| 11 | 11px |\n\n> ⚠️ Não utilize fontes acima de 12 pixels, pois poderão distorcer a visualização do layout.</b>\n\n### Modo Sandbox\n\nPara habilitar o ambiente de testes de desenvolvimento, selecione a opção __Ativar modo sandbox__. Você deve utilizar credenciais de teste.\n\nApós concluir o preenchimento dos campos de configuração, clique em __Salvar__.\n\n## Configurar webhook easypay\n\nPara configurar o webhook da easypay, sig os passos abaixo:\n\n<blockquote><ui>1. No [ambiente easypay](https://backoffice.easypay.pt/), clique no logotipo da easypay localizado no canto superior esquerdo da tela, e depois clique na seta da conta desejada.</ui>\n\n![easypay_pt_2](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay_9.PNG)\n\n<blockquote><ui>2. Acesse **Web Services > Configuração URL**.</ui>\n\n<blockquote><ui>3. Em **URL: Notificar**, preencha com o link abaixo, modificando apenas a informação do nome real de sua loja.</ui>\n\n`https://{nome-da-sua-conta}.myvtex.com/_v/easypaypartnerpt.payment-provider-easypay/webhook`\n\n![easypay_pt_9](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/pagamentos/configurações-de-pagamentos/configurar-pagamento-com-easypay_10.PNG)\n\n<blockquote><ui>4. Clique em **Submeter**.</ui>\n\n## Configurar afiliação easypay\n\nPara configurar a afiliação easypay, siga os passos abaixo:\n\n1. No Admin VTEX, acesse __Configurações da loja > Pagamentos > Provedores__, ou digite __Provedores__ na barra de busca no topo da página.\n2. Na tela de provedores, clique no botão `Novo provedor`.\n3. Digite o nome __easypay__ na barra de busca e clique sobre o nome do provedor.\n4. Preencha os campos __Chave de aplicação__ e __Token de aplicação__ com as informações da sua conta easypay.\n5. Caso deseje modificar o nome de identificação a ser exibido para o provedor easypay na tela do Admin VTEX, insira a informação no campo __Nome__ em __Informações básicas__.\n6. Em __Controle de pagamento__, selecione se deseja ativar o provedor em ambiente de teste clicando em __Ativar modo de teste__.\n7. Caso deseje utilizar o [split de pagamento](/pt/docs/tutorials/split-de-pagamento) em sua loja, selecione a opção __Ativar split de recebíveis e enviar recebedores de pagamento__ e indique o __Responsável pelas tarifas de processamento de pagamentos__ e __Responsável pelos estornos__ (marketplace, sellers ou marketplaces e sellers).\n8. Clique em `Salvar`.\n\n## Configurar pagamento com Apple Pay na easypay (opcional) \n\nPara processar pagamentos com Apple Pay na easypay você precisa primeiramente realizar configurações para habilitar sua loja no ambiente da Apple Pay. Saiba mais em [Setting up Merchant ID in Apple Pay](https://developers.vtex.com/docs/guides/setting-up-merchant-id-in-apple-pay).\n\nPara configurar outros métodos de pagamento a serem processados pela easypay, acesse [Condições de Pagamento](/pt/docs/tutorials/condicoes-de-pagamento).\n\nPara definir condições especiais sobre os métodos de pagamento, acesse [Configurar condições especiais de Pagamento](/pt/tutorial/condicoes-especiais--tutorials_456#).\n\nDepois de seguir os passos indicados, o conector easypay pode demorar até 10 minutos para aparecer no checkout da sua loja como uma opção de pagamento."}