# Introdução

Aqui você poderá conferir materiais de apoio, tutoriais e referências que podem ser utilizadas em integrações em meios de pagamento para websites, e-commerces, aplicativos e softwares.

Mantemos todas as documentações de integração e de apoio sempre atualizadas.\
\
**Último update** 06.10.2022 00:43h

## Acesso Rápido

{% content-ref url="/pages/-MVqdStXPwUYHEUXvLD2" %}
[Introdução](/)
{% endcontent-ref %}

{% content-ref url="/pages/-Ma-Q2MQT5lA\_2KN7zHS" %}
[Credenciais de Acesso](/credenciais-de-acesso)
{% endcontent-ref %}

{% content-ref url="/pages/-MVsRnlLoAYopkGhBIMK" %}
[Botão de Pagamentos](/products/botao-de-pagamentos-1)
{% endcontent-ref %}

{% content-ref url="/pages/-MVxt7LNCa88TNIkf0fX" %}
[API de Pagamentos](/products/api-de-pagamentos)
{% endcontent-ref %}

{% content-ref url="/pages/-MVxmrTniMZ75cL\_pCHr" %}
[Checkout Transparente](/products/modulos-para-ecommerce/modulos-para-opencart/checkout-transparente-para-opencart)
{% endcontent-ref %}

{% content-ref url="/pages/-MVxoqoP2L9Wn8Izo6PU" %}
[WebHooks & Notificações](/atualizacao-de-status/configurando-webhook-e-notificacoes-de-transacoes-iopay)
{% endcontent-ref %}

## Suporte

A IO conta com time de integração preparado para auxiliar nas suas integrações. \
Entre em contato sempre que precisar com <suporte@iopay.com.br> ou através dos telefones:

(11) 3816-6837

de segunda à sexta, das 09:00 às 17h


# Credenciais de Acesso

O que são, como obtê-las e para quê servem

Nesta sessão você encontrará todas as informações necessárias para obter e implementar as credenciais de acesso para meios de pagamento online da IOPAY.

As Credenciais de Acesso são as chaves que habilitam a sua integração de meios de pagamento em e-commerces e aplicativos para realizar transações de vendas.

É muito importante manter todas as informações que compõem uma Credencial de Acesso em segurança para garantir a proteção do seu e-commerce ou aplicativo.

### Como obter as Credenciais de Acesso

As Credenciais de Acesso podem ser obtidas na sessão "Vendas > Pagamentos Online" da Conta Digital IO, como mostra a ilustração abaixo:

![](/files/MiWTV7y2O6hCCr9OG5Ef)

Após clicar em "Habilitar Pagamento online", as credenciais serão geradas e serão apresentadas na sessão seguinte. Confira a seguir cada parte da sessão das credenciais e sua função.

## Credenciais de Integração

Compostas de um endereço de **E-mail**, um ***IO\_Seller\_ID***, um código ***Secret*** e o ***Antifraud\_ID*** da conta, estas são as credenciais que devem ser inseridas de acordo com o tipo de integração desejado.

{% hint style="warning" %}
Caso seu cadastro não possua plano antifraude ativo, você não precisará informar a credencial AntiFraud\_ID em nenhuma integração
{% endhint %}

\
\
Cada tipo de integração, entre API, Botões de Pagamento ou Módulos, irá requerer uma relação de credenciais diferentes, conforme especificado adiante, nesta página da Documentação.

Confira abaixo o formato em que as Credenciais de Integração são dispostas:

![](/files/vBc3YLAPMHFZWGH1yZbi)

**Atenção:** o Secret só poderá ser visualizado quando for gerado. Caso precise visualizar depois será necessário gerar uma nova chave Secret, e as chaves anteriores serão imediatamente invalidadas.

## Inserindo credenciais na API

*\[To do: explicar procedimento]*&#x20;

Em uma integração de API, as credenciais necessárias irão variar de acordo com os recursos utilizados para integrar.

## Inserindo credenciais em um Botão de Pagamentos

Para integrar Botão de Pagamento você fará uso de apenas 2 das credenciais:

| Chave            | Required |
| ---------------- | -------- |
| *email*          | yes      |
| *io\_seller\_id* | yes      |

Aplicar as credenciais em uma integração com botão de pagamentos é simples e basta informá-las nos respectivos campos hidden conforme documentação do Botão.\
\
**Clique no botão abaixo para acessar a documentação para integrar Botão de Pagamentos**

{% content-ref url="/pages/-MVsRnlLoAYopkGhBIMK" %}
[Botão de Pagamentos](/products/botao-de-pagamentos-1)
{% endcontent-ref %}

## Inserindo credenciais em um Módulo para E-commerce

A inserção de credenciais em módulos para ecommerces geralmente acontece na interface administrativa do seu ecommerce e varia de acordo com a plataforma e versão.\
\
Você pode conferir detalhes para cada módulo em sua respectiva documentação acessando o menu "Módulos para Ecommerce" nessa documentação.

**Configurando o módulo para OpenCart (clique no botão abaixo)**

{% content-ref url="/pages/-MVxmrTniMZ75cL\_pCHr" %}
[Checkout Transparente](/products/modulos-para-ecommerce/modulos-para-opencart/checkout-transparente-para-opencart)
{% endcontent-ref %}

### Outras Configurações

Após gerar e inserir as Credenciais de Integração, é possível também configurar o meio de pagamento online da IOPAY na sessão seguinte. Aqui será possível escolher os meios de recebimento, entre Crédito, Pix e Boletos, além de configurar a quantidade de parcelas aceitas na loja virtual, de acordo com a imagem abaixo:

![](/files/lu9ke1iLATfBv57CRqiA)

### Configurações de Integração com Checkout

Por fim, mas não menos importante, você poderá configurar as opções em Configurações de Integração com Checkout no último passo da sessão de Pagamentos Online da Conta Digital IO. É neste momento que serão configurados:

* URL da Notificação (HTTPS), ou seja, o webhook para retorno de notificações
* Restrição de Domínio (HTTPS), para restringir as integrações a um único domínio
* URL do logotipo (HTTP ou HTTPS), para associar o logotipo que deverá aparecer nas integrações

Basta inserir as informações nas boxes e salvar as alterações para finalizar o procedimento. Confira a imagem abaixo para verificar como as informações são dispostas na Conta Digital IO:

![](/files/Gchx2M3bnTPvM6GmSMoi)

### Suporte e Ajuda na Integração

Ficou com alguma dúvida quanto a esta parte da sua integração? \
Abra seu ticket enviando um e-mail para <integracao@iopay.com.br> com o detalhamento sobre a sua dúvida e nossa equipe responderá com orientações para ajudá-lo(a).


# Botão de Pagamentos

A integração rápida, robusta e segura

Através dos botões de pagamento da IOPAY você pode integrar o seu website ou loja em minutos, através de um código HTML simples que deve ser inserido na sua página.

&#x20;O botão de pagamentos da IO permite que você obtenha uma integração simples, rápida e segura. A página de pagamento customizada com o seu logo será aberta de forma segura e automática dentro do seu site, garantindo maior conversão das vendas.

&#x20;Todas as nossas integrações estão em conformidade com as entidades reguladoras de meios de pagamento e seguem o mais alto grau de segurança desse mercado.

&#x20;Através do botão de pagamento da IOPAY você será capaz de receber pagamentos nas seguintes modalidades:<br>

![](/files/-MVwoA5eSMcouxzlYXeO)

O guia abaixo lhe orientará sobre aspectos importantes e como integrar o botão de pagamento IOPAY em seu projeto.

## Setup

Para utilizar o botão de pagamento da IOPAY você deve:

1. **Possuir uma conta de vendedor na IOPAY** ([saiba como obter](https://onboarding.iopay.com.br/register)).
2. **Habilitar a sua conta para recebimento por botões de pagamento** (entre em contato com <integracao@iopay.com.br>). Você receberá informações extras como o ***io\_seller\_id**.*
3. Inserir o `<form>` abaixo em seu HTML

## Código do Botão de Pagamento

Após seguir as orientações da seção 'Setup' acima, copie e cole o código abaixo na sua página.

O código abaixo é responsável por renderizar o botão de pagamentos vinculando ele à sua conta de vendedor na IOPAY

{% tabs %}
{% tab title="Ambiente de testes (Sandbox)" %}

```html
<!-- Botão de Pagamento IOPay -->
<form id="_iopay_checkout" name="_iopay_checkout" action="https://sandbox.checkout.iopay.dev/app/pay/85a6c41f63bb533c3cd157ea4df91a72" method="post" target="_iopay_frame" onSubmit="return false;">
    
    <!-- modalidade de integração -->
    <input type="hidden" name="integration" value="transparent"/>

    <!-- Identificador da loja (email cadastrado na IOPAY) -->
    <input type="hidden" name="business" value="seuemail@dominiodaempresa.com.br"/>
  
    <!-- Identificador da pedido na sua loja (Exemplo: id do pedido) | Campo do tipo string podendo conter até 64 caracteres -->
    <input type="hidden" name="reference_id" value="112233445566778899"/>
  
    <!-- Produtos do carrinho de compras -->
    <input type="hidden" name="product_name[]" value="Camiseta XYZ Masculina, M"/>
    <input type="hidden" name="product_number[]" value="7127372"/>
    <input type="hidden" name="product_amount[]" value="99.0"/>
    <input type="hidden" name="product_quantity[]" value="1"/>
    <input type="hidden" name="product_weight[]" value="0.5"/>
  
    <input type="hidden" name="currency_code" value="BRL"/>
  
    <!-- Informações do cliente comprador -->
    <input type="hidden" name="first_name" value="João"/>
    <input type="hidden" name="last_name" value="da Silva"/>
    <input type="hidden" name="cpf" value="684.470.230-28"/>
    <input type="hidden" name="phone_number" value="(11)98765-4321"/>
    <input type="hidden" name="address1" value="RUA XPTO"/>
    <input type="hidden" name="address2" value="200"/>
    <input type="hidden" name="city" value="São Paulo"/>
    <input type="hidden" name="state" value="SP"/>
    <input type="hidden" name="zip" value="05466030"/>
    <input type="hidden" name="country" value="Brasil"/>
    <input type="hidden" name="email" value="emailcliente@gmail.com"/>
    <input type="hidden" name="invoice" value="Anotação que deve ser inserida na fatura do cliente"/>

    <!-- Configure -->
    <input type="hidden" name="return" value="https://site.com/transaction_result"/>
 
    <!-- Porcentagem de desconto para boleto pago no mesmo dia (apenas numeros) -->
    <input type="hidden" name="io_config_primary_color" value="#cc0000"/>
    <input type="hidden" name="io_config_secondary_color" value="#FEA40E"/>

    <!-- Montante total a ser cobrado -->
    <input type="hidden" name="amount" value="199.00"/>
    
    <button onclick="iopay()" name="payWithIO" style="background-color: #6d000b; color: #fff">PAGAR</button>

</form>
<!-- Fim botão de pagamentos IOPAY -->

<!-- Folha de estilos para o Checkout Transparente IOPAY -->
<link href="https://sandbox.checkout.iopay.dev/checkout/assets/css/front.checkout.transparent.iopay.css" rel="stylesheet">

<!-- Script responsável pelas funcionalidades de frontend do chekout transparente IOPAY -->
<script src="https://sandbox.checkout.iopay.dev/checkout/assets/js/front.checkout.transparent.iopay.min.js"></script>

<!-- Script de análise de comportamento do usuário [Verifique o tópico "Antifraude"] -->
<script>
    window.iopayAntifraudPublicKey = 'ABCDEXXX0000000';
    window.iopaySecurityPlan = 'with_anti_fraud';
    (function() {
        var iopay = document.createElement('script');
        iopay.id = 'iopayjs'; iopay.type = 'text/javascript';iopay.async = true;
        iopay.src = 'https://sandbox.checkout.iopay.com.br/assets/js/checkout_behaviour_security.js';
        var s = document.getElementsByTagName('body')[0];
        s.parentNode.insertBefore(iopay, s);
    })();
</script>
```

{% endtab %}

{% tab title="Ambiente de Produção" %}

```html
<!-- Botão de Pagamento IOPay -->
<form id="_iopay_checkout" name="_iopay_checkout" action="https://checkout.iopay.dev/app/pay/85a6c41f63bb533c3cd157ea4df91a72" method="post" target="_iopay_frame" onSubmit="return false;">
    
    <!-- modalidade de integração -->
    <input type="hidden" name="integration" value="transparent"/>

    <!-- Identificador da loja (email cadastrado na IOPAY) -->
    <input type="hidden" name="business" value="seuemail@dominiodaempresa.com.br"/>
  
    <!-- Identificador da pedido na sua loja (Exemplo: id do pedido) | Campo do tipo string podendo conter até 64 caracteres -->
    <input type="hidden" name="reference_id" value="112233445566778899"/>
  
    <!-- Produtos do carrinho de compras -->
    <input type="hidden" name="product_name[]" value="Camiseta XYZ Masculina, M"/>
    <input type="hidden" name="product_number[]" value="7127372"/>
    <input type="hidden" name="product_amount[]" value="99.0"/>
    <input type="hidden" name="product_quantity[]" value="1"/>
    <input type="hidden" name="product_weight[]" value="0.5"/>
  
    <input type="hidden" name="currency_code" value="BRL"/>
  
    <!-- Informações do cliente comprador -->
    <input type="hidden" name="first_name" value="João"/>
    <input type="hidden" name="last_name" value="da Silva"/>
    <input type="hidden" name="cpf" value="684.470.230-28"/>
    <input type="hidden" name="phone_number" value="(11)98765-4321"/>
    <input type="hidden" name="address1" value="RUA XPTO"/>
    <input type="hidden" name="address2" value="200"/>
    <input type="hidden" name="city" value="São Paulo"/>
    <input type="hidden" name="state" value="SP"/>
    <input type="hidden" name="zip" value="05466030"/>
    <input type="hidden" name="country" value="Brasil"/>
    <input type="hidden" name="email" value="emailcliente@gmail.com"/>
    <input type="hidden" name="invoice" value="Anotação que deve ser inserida na fatura do cliente"/>

    <!-- Configure -->
    <input type="hidden" name="return" value="x"/>
    <input type="hidden" name="notify" value="y"/>
    <input type="hidden" name="cancel_return" value="z"/>
 
    <!-- Porcentagem de desconto para boleto pago no mesmo dia (apenas numeros) -->
    <input type="hidden" name="io_config_primary_color" value="#cc0000"/>
    <input type="hidden" name="io_config_secondary_color" value="#FEA40E"/>

    <!-- Montante total a ser cobrado -->
    <input type="hidden" name="amount" value="199.00"/>
    
    <button onclick="iopay()" name="payWithIO" style="background-color: #6d000b; color: #fff">PAGAR</button>

</form>
<!-- Fim botão de pagamentos IOPAY -->

<!-- Folha de estilos para o Checkout Transparente IOPAY -->
<link href="https://checkout.iopay.dev/checkout/assets/css/front.checkout.transparent.iopay.css" rel="stylesheet">

<!-- Script responsável pelas funcionalidades de frontend do chekout transparente IOPAY -->
<script src="https://checkout.iopay.dev/checkout/assets/js/front.checkout.transparent.iopay.min.js"></script>

<!-- Script de análise de comportamento do usuário [Verifique o tópico "Antifraude"] -->
<script>
    window.iopayAntifraudPublicKey = 'ABCDEXXX0000000';
    window.iopaySecurityPlan = 'with_anti_fraud';
    (function() {
        var iopay = document.createElement('script');
        iopay.id = 'iopayjs'; iopay.type = 'text/javascript';iopay.async = true;
        iopay.src = 'https://checkout.iopay.com.br/assets/js/checkout_behaviour_security.js';
        var s = document.getElementsByTagName('body')[0];
        s.parentNode.insertBefore(iopay, s);
    })();
</script>
```

{% endtab %}
{% endtabs %}

{% hint style="info" %}
Repare que a única mudança para diferenciar o ambiente de produção e testes (sandbox) é o prefixo da URI utilizada:\
\
**sandbox.checkout.iopay.dev** \[testes]

**checkout.iopay.dev** \[produção]
{% endhint %}

{% hint style="success" %}
Você pode utilizar um **botão com estilos CSS personalizados**, contudo lembre-se de inseri-lo dentro do form e adicionar o atributo **`onclick="iopay()"`**, conforme demonstrado ac
{% endhint %}

## Parâmetros

Abaixo relação de parâmetros esperados pelo formulário.\
Cada pagamento pode conter um ou mais itens, que representam produtos ou serviços que estão sendo vendidos.

| PARÂMETRO         | DESCRIÇÃO                                                                                                            | OBRIGATÓRIO |
| ----------------- | -------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`integration`** | Esse parâmetro especifica qual o tipo de integração em uso. Valor aceito para botão de pagamentos: **`transparent`** | Sim         |

| PARÂMETRO      | DESCRIÇÃO                                                                                                                  | OBRIGATÓRIO |
| -------------- | -------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`business`** | Identifica a conta de vendedor cadastrada na IOPAY. Este parâmetro deve ser do tipo email, exemplo: **`john@example.com`** | Sim         |

| PARÂMETRO          | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                                                                                                                          | OBRIGATÓRIO |
| ------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`reference_id`** | <p>Neste parâmetro você pode informar o identificador único do pedido da sua loja, como por exemplo o ID do pedido atual. Este campo pode conter uma cadeia de até 64 caracteres. Exemplo de reference\_id: <strong><code>1234</code></strong><br>Ao informar esse parâmetro, você pode usá-lo para recuperar posteriormente o status desse pagamento (aprovado, cancelado, rejeitado etc) e atualizar na sua base de pedidos.</p> | Não         |

| PARÂMETRO            | DESCRIÇÃO                                                                                                                                                                                                                                      | OBRIGATÓRIO |
| -------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`product_name[]`** | <p>Este parâmetro é utilizado para informar os nomes dos itens que estão sendo vendidos.<br><br>Para adicionar mais de um item, basta inserir mais um parâmetro <strong><code>product\_name\[]</code></strong>, conforme o exemplo abaixo:</p> | Sim         |

```markup
<input type="hidden" name="product_name[]" value="Produto 1"/>
<input type="hidden" name="product_name[]" value="Produto 2"/>
...etc
```

| PARÂMETRO              | DESCRIÇÃO                                                                                                                           | OBRIGATÓRIO |
| ---------------------- | ----------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`product_number[]`** | Utilize esse parâmetro para informar o identificador único desse produto ou serviço na sua loja ou site, conforme o exemplo abaixo: | Não         |

```markup
<!-- ID do Produto 1 (opcional) -->
<input type="hidden" name="product_number[]" value="55555"/>
<!-- ID do Produto 2 (opcional) -->
<input type="hidden" name="product_number[]" value="99999"/>
...etc
```

| PARÂMETRO              | DESCRIÇÃO                                                                                                                                                                                                                                                                                 | OBRIGATÓRIO |
| ---------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`product_amount[]`** | <p>Parâmetro utilizado para informar o preço individual de cada produto ou serviço comercializado,<br>Este parâmetro aceita valores numéricos do tipo float. Dessa forma, para informar o valor de R$199,00 deve-se informar <strong><code>199.00</code></strong> conforme o exemplo:</p> | Sim         |

```markup
<!-- Valor unitario do produto 1  -->
<input type="hidden" name="product_amount[]" value="199.00"/>
<!-- Valor unitario do produto 2  -->
<input type="hidden" name="product_amount[]" value="350.00"/>
...etc
```

| PARÂMETRO                | DESCRIÇÃO                                                                                                                                                                                            | OBRIGATÓRIO |
| ------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`product_quantity[]`** | Parâmetro utilizado para informar a quantidade de cada produto comercializado. Apenas números inteiros são aceitos. O exemplo abaixo indica que o cliente está adquirindo 3 Produto 1 e 1 Produto 2. | Sim         |

```markup
<!-- Quantidade do produto 1  -->
<input type="hidden" name="product_quantity[]" value="3"/>
<!-- Quantidade do produto 2  -->
<input type="hidden" name="product_quantity[]" value="1"/>
...etc
```

| PARÂMETRO              | DESCRIÇÃO                                                                                                                                                                                                          | OBRIGATÓRIO |
| ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- |
| **`product_weight[]`** | <p>Esse parâmetro é utilizado para informar o peso individual de determinado produto.</p><p>O valor desse parâmetro é baseado no tipo numérico float representado em Kg, ou seja, para informar 200g, use: 0.2</p> | Não         |

```markup
<!-- Peso do produto 1  -->
<input type="hidden" name="product_weight[]" value="0.2"/>
<!-- Peso do produto 2  -->
<input type="hidden" name="product_weight[]" value="0.6"/>
...etc
```

| PARÂMETRO           | DESCRIÇÃO                                                                                                                                                   | OBRIGATÓRIO |
| ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`currency_code`** | Define a moeda utilizada nessa venda. Até o momento o único valor aceito pela IO para esse parâmetro é **`BRL`** que representa o Real Brasileir&#x6F;**.** | Não         |

| PARÂMETRO        | DESCRIÇÃO                                                                                                                                                                                                                         | OBRIGATÓRIO |
| ---------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`first_name`** | Este campo é opcional e representa o primeiro nome do cliente que iniciou a compra. Você pode usá-lo para enviar o nome do cliente, evitando assim que o cliente precise preencher novamente ao acessar o formulário de pagamento | Não         |

| PARÂMETRO       | DESCRIÇÃO                                                                                                                                                                                                                                                                              | OBRIGATÓRIO |
| --------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`last_name`** | Este campo é opcional e representa o último nome/sobrenome do cliente que iniciou a compra. Ao usar esse parâmetro na sua integração você melhor a experiência de compra do seu cliente, evitando assim que o cliente precise preencher novamente ao acessar o formulário de pagamento | Não         |

| PARÂMETRO | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                                                                                                               | OBRIGATÓRIO |
| --------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`cpf`** | <p>Este campo é opcional e representa o CPF do cliente que iniciou a compra.<br>Ao usar esse parâmetro na sua integração você melhora a experiência de compra do seu cliente, evitando assim que o cliente precise preencher novamente ao acessar o formulário de pagamento<br><br>Este parâmetro permite que você envie o CPF com pontos e traços, conforme o padrão: <strong><code>XXX.XXX.XXX-XX</code></strong></p> | Não         |

| PARÂMETRO          | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | OBRIGATÓRIO |
| ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`phone_number`** | <p>Este parâmetro é utilizado para informar o número de telefone com DDD do seu cliente.<br>Ao usar esse parâmetro na sua integração você melhor a experiência de compra do seu cliente, evitando assim que o cliente precise preencher novamente ao acessar o formulário de pagamento<br><br>Este parâmetro permite que você envie o DDD entre parêntesis, conforme o padrão: <strong><code>(XX)XXXXX-XXXX</code></strong><br>O valor pode ser composto de um número de celular com DDD ou número de telefone fixo com DDD</p> | Não         |

| PARÂMETRO      | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                                        | OBRIGATÓRIO |
| -------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- |
| **`address1`** | <p>Utilize esse parâmetro para informar a primeira linha do endereço do cliente. Exemplo: <strong><code>Rua da Consolação</code></strong><br><br>Ao usar esse parâmetro na sua integração você melhora a experiência de compra do seu cliente, evitando assim que o cliente precise preencher novamente ao acessar o formulário de pagamento</p> | Não         |

| PARÂMETRO      | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                     | OBRIGATÓRIO |
| -------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`address2`** | <p>Utilize esse parâmetro para informar o número do endereço do seu cliente. Exemplo: <strong><code>750</code></strong><br><br>Ao usar esse parâmetro na sua integração você melhor a experiência de compra do seu cliente, evitando assim que o cliente precise preencher novamente ao acessar o formulário de pagamento</p> | Não         |

| PARÂMETRO      | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                                     | OBRIGATÓRIO |
| -------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`address3`** | <p>Utilize esse parâmetro para informar o complemento do endereço do seu cliente. Exemplo: <strong><code>Fundos, Casa 2</code></strong><br><br>Ao usar esse parâmetro na sua integração você melhor a experiência de compra do seu cliente, evitando assim que o cliente precise preencher novamente ao acessar o formulário de pagamento</p> | Não         |

| PARÂMETRO  | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                                    | OBRIGATÓRIO |
| ---------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`city`** | <p>Utilize esse parâmetro para informar a cidade à partir do endereço do seu cliente. Exemplo: <strong><code>São Paulo</code></strong><br><br>Ao usar esse parâmetro na sua integração você melhor a experiência de compra do seu cliente, evitando assim que o cliente precise preencher novamente ao acessar o formulário de pagamento</p> | Não         |

| PARÂMETRO   | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                                                                                                                           | OBRIGATÓRIO |
| ----------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`state`** | <p>Utilize esse parâmetro para informar a unidade federativa/estado a partir do endereço do seu cliente.<br><br>Ao usar esse parâmetro na sua integração você melhor a experiência de compra do seu cliente, evitando assim que o cliente precise preencher novamente ao acessar o formulário de pagamento<br><br>Esse parâmetro deve ser composto pela sigla do estado com 2 letras. Exemplo: <strong><code>SP</code></strong></p> | Não         |

| PARÂMETRO     | DESCRIÇÃO                                                                                                                                                                                 | OBRIGATÓRIO |
| ------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`country`** | <p>Utilize esse parâmetro para informar o país de origem do seu cliente.<br><br>Atualmente o único valor aceito para esse parâmetro pela IOPAY é <strong><code>Brasil</code></strong></p> | Não         |

| PARÂMETRO | DESCRIÇÃO                                                                                                                                                                                                                                                          | OBRIGATÓRIO |
| --------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- |
| **`zip`** | <p>Se informado, esse parâmetro é utilizado para fornecer o endereço completo no formulário de pagamento, evitando assim que o seu cliente precise preencher todos os campos<br><br>O formato para esse valor deve ser <strong><code>XXXXX-XXX</code></strong></p> | Não         |

| PARÂMETRO   | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                                                              | OBRIGATÓRIO |
| ----------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`email`** | <p>Parâmetro utilizado para informar o e-mail do cliente comprador. Ao integrar e enviar esse parâmetro (opcional), você melhora a experiência de compra do seu cliente, pois o valor desse campo virá preenchido no formulário de pagamento.<br><br>O formato de dados aceito segue o padrão e-mail, por exemplo <strong><code><john@example.com></code></strong></p> | Não         |

| PARÂMETRO     | DESCRIÇÃO                                                                                                                                                                                                                                                                                    | OBRIGATÓRIO |
| ------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`invoice`** | <p>Este parâmetro, se usado, informa a descrição da compra na fatura do cliente.<br>Você pode usá-lo para facilitar a identificação pelo seu cliente da compra efetuada na fatura do cartão.<br>Exemplo de uso: <strong><code>Loja de Sapatos XYZ (lojadesapatosxyz.com)</code></strong></p> | Não         |

| PARÂMETRO    | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | OBRIGATÓRIO |
| ------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`return`** | <p>Este parâmetro define a URL da sua loja, que será usada para redirecionar o seu cliente após sucesso na geração do pagamento<br>Exemplo de uso: <strong><code><https://site.com/transaction_result></code></strong></p><p></p><p>A URL receberá parâmetros GET informando o ID da Transação (transaction\_id) e o Status (status), o usuário será redirecionado ao Fechar a tela de pagamento. Exemplo:</p><p><https://site.com/transaction_result><strong>?transaction\_id=xx\&status=pending</strong></p><p><br><strong>ATENÇÃO:</strong> Não utilize essa rota para confirmar o pagamento na sua base de dados. Para confirmação utilize o serviço de WebHooks da IOPAY.</p> | Não         |

Possíveis '**status**' retornados na URL:&#x20;

* **pending** : pendente, comum para pagamentos por boleto
* **succeeded** : pago com sucesso
* **pre\_authorized** : apenas pré-autorizado, ainda estão em análise antifraude

| PARÂMETRO    | DESCRIÇÃO                                                                                                                                                                                                                                                                    | OBRIGATÓRIO |
| ------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| **`amount`** | <p>Parâmetro obrigatório, utilizado para informar o montante total dessa venda através de um tipo numérico float.<br>Por exemplo, se a somatória de preços dos produtos + custo de frete para envio é de R$485,70, deve-se utilizar <strong><code>485.70</code></strong></p> | Sim         |

## Antifraude

Para prevenir ações suspeitas de fraude, insira o script de monitoramento do comportamento do usuário no rodapé do seu site.

Ao inserir esse trecho de código estaremos monitorando o comportamento do usuário em seu site; É altamente recomendável que este script seja carregado globalmente (em todo site).

{% tabs %}
{% tab title="Ambiente de testes (Sandbox)" %}

```markup
<!-- Script de análise de comportamento do usuário -->
<script>
    window.iopayAntifraudPublicKey = 'ABCDEXXX0000000';
    window.iopaySecurityPlan = 'with_anti_fraud';
    (function() {
        var iopay = document.createElement('script');
        iopay.id = 'iopayjs'; iopay.type = 'text/javascript';iopay.async = true;
        iopay.src = 'https://sandbox.checkout.iopay.com.br/assets/js/checkout_behaviour_security.js';
        var s = document.getElementsByTagName('body')[0];
        s.parentNode.insertBefore(iopay, s);
    })();
</script>
```

{% endtab %}

{% tab title="Ambiente de Produção" %}

```markup
<!-- Script de análise de comportamento do usuário -->
<script>
    window.iopayAntifraudPublicKey = 'ABCDEXXX0000000';
    window.iopaySecurityPlan = 'with_anti_fraud';
    (function() {
        var iopay = document.createElement('script');
        iopay.id = 'iopayjs'; iopay.type = 'text/javascript';iopay.async = true;
        iopay.src = 'https://checkout.iopay.com.br/assets/js/checkout_behaviour_security.js';
        var s = document.getElementsByTagName('body')[0];
        s.parentNode.insertBefore(iopay, s);
    })();
</script>
```

{% endtab %}
{% endtabs %}

{% hint style="success" %}
**Não se preocupe com o desempenho da sua página**&#x20;

Este será o ultimo script a ser carregado em sua página, sem afetar a performance e experiência do usuário; Para que isso ocorra, recomendamos que este script seja inserido, globalmente, antes do fechamento da tag \</body> ou \</footer> no corpo do site.
{% endhint %}

{% hint style="warning" %}
**Não faça nenhuma alteração na estrutura deste script**

Este script foi cuidadosamente desenvolvido para monitorar as ações do usuário, e lhe proteger de possíveis fraudes, sem afetar o desempenho do seu site. Não altere a estrutura do script, apenas atribua os valores necessários para configura-lo (Vide o tópico abaixo **"Configure o script de monitoramento**")
{% endhint %}

### **Configure o script de monitoramento**

As informações solicitadas para configuração do script de monitoramento podem ser obtidas na sua [Conta Digital](https://minhaconta.iopay.com.br/) em: **Conta Digital > Pagamentos Online**

| <p>LINHA</p><p>SCRIPT</p> |             PROPRIEDADE             | TIPO   | DESCRIÇÃO                                                                                                                                                                                                                                                                                                                                                     |
| ------------------------- | :---------------------------------: | ------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 3                         | **window\.iopayAntifraudPublicKey** | string | <p><a href="https://minhaconta.iopay.com.br/"><em>Conta Digital</em></a> <em>> Pagamentos Online > Chave Pública Antifraude</em></p><p>Sua Chave Pública para utilização do sistema antifraude;</p>                                                                                                                                                           |
| 4                         |    **window\.iopaySecurityPlan**    | string | <p><a href="https://minhaconta.iopay.com.br/"><em>Conta Digital</em></a> <em>> Pagamentos Online > Plano Antifraude</em></p><p>Seu plano antifraude contratado junto a IOPAY: </p><ul><li><strong>"with\_anti\_fraud"</strong>: Plano antifraude padrão</li><li><strong>"with\_anti\_fraud\_insurance"</strong>: Plano antifraude com seguro</li></ul><p></p> |

{% hint style="warning" %}
**Verifique com atenção a configuração do script**

* **window\.iopaySecurityPlan:** apenas os valores exibidos na descrição são permitidos; Certifique-se de que o tipo do plano foi indicado corretamente para que o script de monitoramento funcione.
  {% endhint %}

## Notificações & WebHooks

Webhooks (também conhecidos como HTTP Callbacks) são uma forma de se registrar para receber informações úteis em uma URL específica de sua escolha. Quando ocorre uma alteração no estado de um recurso dentro das plataformas da IOPAY (por exemplo, uma transação é aprovada com sucesso), um evento é gerado por essa ocorrência e enviado para os webhooks cadastrados.

**Para utilizar a notificação de eventos você precisa:**\
\
&#x20;\- Implementar o seu sistema de recebimento de notificações\
&#x20;\- Cadastrar as URLs desse sistema na IOPAY, através da sua conta digital IO.\
&#x20;\- Quando ocorrer uma ação ou atualização de status nas transações enviadas para a IO, as notificações serão disparadas de acordo com os webhooks cadastrados

**Beta** Caso não encontre essa opção em sua conta digital IO, envie uma solicitação de ativação desse recurso para <integracao@iopay.com.br>

## Customização e Cores

Com o botão de pagamentos IOPAY você pode customizar as cores e logotipo da página checkout.

Você pode definir a cor primária e secundária em hexadecimal. Essas duas cores são usadas para compor o layout do checkout que será aberto após o clique no botão de pagamentos.

Para definir as cores do seu checkout, informe o código hexadecimal (com #) nos seguintes input hiddens.                           &#x20;

```markup
<!-- Definição das cores primária e secundária da página de checkout -->
<input type="hidden" name="io_config_primary_color" value="#cc0000"/>
<input type="hidden" name="io_config_secondary_color" value="#FEA40E"/>
```

Se esses parâmetros não forem configurados no seu form, o checkout atribuirá automaticamente as cores padrão da página de checkout, conforme imagem abaixo

## Customização de Logotipo

Com o checkout e botão de pagamento IOPAY você pode facilmente adicionar o logotipo da sua empresa.

Dessa forma você aumenta a conversão de vendas do seu site ou loja virtual, ao customizar com a mesma marca e cores da sua loja virtual.

&#x20;Para inserir o logotipo, faça login na sua conta digital IOPAY e clique em 'Configurações' > 'Pagamentos Online' para especificar a URL da imagem, como ilustrado abaixo:

![](/files/F5wzVjVI1c2Mogd5xNZG)

\
**Padrão de imagens aceitas**\
Width: **`171px`**\
Max Height: **`72px`**\
Formatos: **`png, jpg ou svg`**


# API de Pagamentos

A IO disponibiliza uma API completa e de fácil implementação para integrações customizadas em aplicativos, lojas virtuais e softwares, seguindo o padrão REST de funcionamento.

**Para acessar a documentação e referência clique no link abaixo**

#### <https://docs-api.iopay.com.br>


# Módulos para e-commerce


# OpenCart

Confira abaixo todos os módulos disponíveis para lojas virtuais construídas sob em OpenCart

{% content-ref url="/pages/-MVxmrTniMZ75cL\_pCHr" %}
[Checkout Transparente](/products/modulos-para-ecommerce/modulos-para-opencart/checkout-transparente-para-opencart)
{% endcontent-ref %}

{% content-ref url="/pages/-MVxn7dfwfZUPvU5iSw-" %}
[Broken mention](broken://pages/-MVxn7dfwfZUPvU5iSw-)
{% endcontent-ref %}


# Checkout Transparente

Essa extensão foi desenvolvida para integrar o OpenCart com a solução Checkout Transparente da IOPAY e tem como principal funcionalidade permitir que seu cliente faça pagamentos sem sair da sua loja

## Introdução

Aceite pagamentos através de cartões de crédito de várias bandeiras, boleto registrado e PIX (de qualquer banco).

Através do módulo checkout transparente da IO, você obtém uma forma rápida e prática de integrar seu ecommerce com as APIs e tecnologias da IOPAY para processamento de transações on-line.

A IOPAY conta ainda com duas opções em antifraude para que as suas vendas tenham a segurança adequada ao seu mercado.

O checkout transparente da IO possui UX e UI aprimoradas para garantir maiores taxas de conversão além de permitir que o seu cliente faça pagamentos sem sair da sua loja ou fazer login em plataformas externas.

## Compatibilidade

O módulo de checkout transparente para OpenCart, é homologado para instalações do OpenCart cuja versão:

**`OpenCart 3.x.x`**

## Recursos

* Análise antifraude com seguro contra fraude (plano opcional, consulte)
* Análise antifraude com análise de comportamento de navegação
* Processe pagamentos dentro do seu ecommerce de forma 100% transparente
* Checkout otimizado para maior conversão de vendas
* Receba Atualização do status das transações de forma automática (via webhooks)
* Otimizado para OpenCart 3.x
* Extensão segura e de acordo com o compliance PCI (Payment Card Industry)
* Permita pagamentos com cartão de crédito em até 12x com as menores taxas do mercado
* Aceite as 9 principais bandeiras de cartão do mundo
* Aceite PIX com QRCode ou Copia e Cola em seu e-commerce e converta mais vendas ainda!
* Gere boletos dentro da sua loja sem enviar o seu cliente para outro site
* Processe cartões de crédito dentro da sua loja. Gere mais conversões ao não exigir que o cliente saia da sua loja para fazer login ou se cadastrar em alguma de pagamentos.
* Módulo 100% responsivo e adequado à qualquer tela: smartphones, tablets e desktops
* Módulo totalmente gratuito
* Time de especialistas pronto e disponível sem custo para auxiliar nas suas integrações
* Instalação simples e rápida
* Suporte Premium

#### Modalidades de pagamentos aceitas

![](/files/-MVwoA5eSMcouxzlYXeO)

{% hint style="info" %}
O tempo estimado para implementação desse tutorial é inferior a 10 minutos
{% endhint %}

## Download & Instalação

{% hint style="success" %}
&#x20;**Para baixar a última versão \[1.5.1]** do módulo "Checkout Transparente para OpenCart 3.x" , acesse\
\
<https://downloads.iopay.dev/modules/opencart/io-checkout-transparente-v1.5.1-for-opencart3.x.ocmod>
{% endhint %}

Após download, siga os passos:

### 1. Faça login na interface de administração do OpenCart

Faça login na administração do OpenCart acessando /admin

### 2. Instalação do módulo

**2.1** Dentro da plataforma administrativa do OpenCart, navegue no menu principal  e clique na opção: "**Extensions > Installer**", conforme ilustrado abaixo:

![Menu principal da administração do OpenCart 3.x](/files/-MVwMZHyHltYBOfjQyep)

**2.2** Clique em 'Upload' e selecione o arquivo compactado baixado para o seu computador no passo **1**\
***Arquivo zip:** io-checkout-transparente.opencart.3.x.zip*

![](/files/-MVwNC_ljg2Xu_JGF0NH)

\
**2.3** Aguarde o processo de instalação (alguns segundos) e verifique se o módulo foi instalado corretamente e é listado em 'Install History', conforme demonstrado na imagem abaixo:

![Instalação bem sucedida](/files/-MVwT7zhkzFAhxTqaRp4)

### 3. Custom Fields

As transações processadas com IOPAY contam com sistema antifraude e para que a integração funcione corretamente precisamos inserir 4 campos customizados no OpenCart, pois o OpenCart não possui estes campos em sua instalação nativa.

1. CPF (*Customer*)
2. Telefone de Entrega (*Shipping*)
3. CPF (*Shipping*)
4. Número do endereço (Shipping)

Antes de partirmos para as configurações do módulo checkout transparente certifique-se que a sua instalação do OpenCart contenha os 4 campos citados acima. Caso a sua instalação atual contenha campos similares aos citados acima, pule para o passe 4.

Se a sua instalação não contém este campos, será necessário inseri-los e  este é um processo simplificado e facilitado pelo recurso *Custom Fields* do OpenCart. Para adicionar os 4 Custom Fields necessários para o funcionamento do módulo checkout transparente, siga os passos descritos abaixo na seção 3.1 Custom Fields

#### 3.1 Adicionando Custom Fields

{% hint style="info" %}
Caso o seu commerce já possua campos similares à: \
\
CPF (cliente), \
Telefone de entrega\
CPF (de quem receberá a entrega) \
Número do endereço

pule para o passo 4
{% endhint %}

Para a inserção de custom fields, acesse a opção 'Customers > Custom Fields' no menu principal da administração do OpenCart<br>

![Menu principal da administração do OpenCart](/files/-MVwZ8kAD7lZ-iC4HgWy)

\
Clique em "+" para inserir cada Custom Field.

![](/files/-MW0FUGqCAQ5pc8YGi-5)

\
Confira abaixo como proceder para cada um dos três CustomFields:

**1. CPF (Customer)**

|             **Opção** | Valor                                                                                                     |
| --------------------: | --------------------------------------------------------------------------------------------------------- |
| **Custom Field Name** | CPF                                                                                                       |
|          **Location** | account                                                                                                   |
|              **Type** | Text                                                                                                      |
|             **Value** | 000.000.000-00                                                                                            |
|        **Validation** | /^(\[0-9]{3}.?\[0-9]{3}.?\[0-9]{3}-?\[0-9]{2}\|\[0-9]{2}.?\[0-9]{3}.?\[0-9]{3}\\/?\[0-9]{4}-?\[0-9]{2})$/ |
|    **Customer Group** | default (selecione os demais grupos de clientes, caso possua)                                             |
|          **Required** | true                                                                                                      |
|            **Status** | Enabled                                                                                                   |
|        **Sort Order** | 3                                                                                                         |

![Demonstração da inserção para o Campo CPF (Customer)](/files/-MVw_5IbPJ7wsofIN6uU)

Clique no botão salvar para efetivar a adição desse Custom Field.

\
Agora, precisamos repetir o processo para a adição do segundo custom field exigido. Portanto, novamente clique na opção + Add New disponível na página principal da seção Customers > Custom Field para adicionar um novo campo.

![](/files/-MW0FUGqCAQ5pc8YGi-5)

**2. Telefone de Entrega (Address)**

| **Opção**             | **Valor**                                                     |
| --------------------- | ------------------------------------------------------------- |
| **Custom Field Name** | Telefone de Entrega                                           |
| **Location**          | Address                                                       |
| **Type**              | Text                                                          |
| **Value**             | (00)0000-0000                                                 |
| **Validation**        | /(\\(?\d{2}\\)?\s)?(\d{4,5}\\-\d{4})$/                        |
| **Customer Group**    | default (selecione os demais grupos de clientes, caso possua) |
| **Required**          | true (selecione os demais grupos de clientes, caso possua)    |
| **Status**            | Enabled                                                       |
| **Sort Order**        | 10                                                            |

![Demonstração para inserção do campo Telefone (endereço de entrega)](/files/-MVwdYKm0HLeMWki9UK6)

Clique em Save para salvar esse campo.\
\
\
Agora partiremos para inserção o último custom field, para isso, clique novamente em + Add New, para adicionar um novo campo.<br>

**3. CPF (Address)**

| **Opção**             | Valor                                                                                                     |
| --------------------- | --------------------------------------------------------------------------------------------------------- |
| **Custom Field Name** | CPF (de quem receberá a entrega)                                                                          |
| **Location**          | Address                                                                                                   |
| **Type**              | Text                                                                                                      |
| **Value**             | 000.000.000-00                                                                                            |
| **Validation**        | /^(\[0-9]{3}.?\[0-9]{3}.?\[0-9]{3}-?\[0-9]{2}\|\[0-9]{2}.?\[0-9]{3}.?\[0-9]{3}\\/?\[0-9]{4}-?\[0-9]{2})$/ |
| **Customer Group**    | default (selecione os demais grupos de clientes, caso possua)                                             |
| **Required**          | true (selecione os demais grupos de clientes, caso possua)                                                |
| **Status**            | Enabled                                                                                                   |
| **Sort Order**        | 1                                                                                                         |

![Inserção do campo customizado CPF (de quem receberá a entrega) localizado em "Address"' ](/files/-MW07qY35VQfb3nl20uN)

**4. Número (Shipping)**

* Por padrão, instalações do OpenCart não contam com campo separado para número do endereço. Dessa forma, precisamos adicionar o CustomField 'Numero' para que o cliente possa utilizá-lo para preenchimento correto do endereço e para que a integração com a IOPAY possa receber as informações necessárias.

{% hint style="info" %}
Caso, não deseje adicionar esse CustomField, selecione a opção: "Não usar campo separado para Número". Ao marcar essa opção, o módulo vai extrair automaticamente o número a partir da string informada no campo padrão de endereço.
{% endhint %}

|             **Opção** | Valor                                                         |
| --------------------: | ------------------------------------------------------------- |
| **Custom Field Name** | Número                                                        |
|          **Location** | address                                                       |
|              **Type** | Text                                                          |
|             **Value** |                                                               |
|        **Validation** |                                                               |
|    **Customer Group** | default (selecione os demais grupos de clientes, caso possua) |
|          **Required** | true (selecione os demais grupos de clientes, caso possua)    |
|            **Status** | Enabled                                                       |
|        **Sort Order** | 3                                                             |

####

#### 4. Confirme se os 4 campos acima foram inseridos com o "Location" correto

![](/files/-M_SDWCBFBaDyaRLvHHH)

### &#x20;4. Configurando o Módulo

### 4.1 Ativação

Agora que já temos o módulo de checkout instalado, campos custom inseridos, precisaremos realizar algumas configurações no módulo.\
\
Para isso, ainda na interface de administração do OpenCart, navegue até a opção **Extensions > Extensions** no menu principal, conforme imagem abaixo:

![](/files/-MW0Hfs5gwZybBvyjf7l)

\
Selecione a opção **Payments** na listagem, conforme demonstrado abaixo:

![](/files/-MW0IRaskxPlNR4q8DH0)

\
O OpenCart exibirá uma listagem dos módulos de pagamentos disponíveis para o seu ecommerce, localize "**IOPAY Checkout**" e clique em + Install *(botão verde) para adicionar IOPAY ao seu ecommerce.*<br>

![](/files/-MW0Jk33Lik7j5V7XavN)

\
Depois de clicar em Install, o módulo deve aparecer na listagem conforme imagem abaixo.\
Clique na opção Edit para abrir as configurações do módulo.

![](/files/-MW0KtGc_qf-4N6vXi1p)

### 4.2 Configurações Gerais

A página de configurações do módulo tem o seguinte formato:

![](/files/-MWQKtChUrKWFgD8Afft)

Primeiro, na aba General, forneça as configurações básicas de acordo com a sua loja:

| **Campo**              | **Descrição**                                                                                                                                                                                                                                                                                                                                                                                                                                  |
| ---------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **E-MAIL**             | Email credenciado na conta IOPAY                                                                                                                                                                                                                                                                                                                                                                                                               |
| **IO SELLER ID**       | ID da sua loja na IOPAY *(você recebe esse dado no seu processo de onboard e credenciamento ou pode gerá-lo a qualquer momento através da sua Conta Digital)*                                                                                                                                                                                                                                                                                  |
| **API SECRET**         | Token de acesso à API *(você recebe esse dado no seu processo de onboard e credenciamento ou pode gerá-lo à qualquer momento através da sua Conta Digital)*                                                                                                                                                                                                                                                                                    |
| **IO ANTIFRAUDE TYPE** | <p>Selecione a opção de acordo com o seu plano na IOPAY. As opções disponíveis são:</p><p></p><p><strong>without\_antifraud</strong> --> sem antifraude</p><p><strong>with\_antifraud</strong> --> antifraude convencional</p><p><strong>with\_antifraud\_insurrance</strong> --> antifraude com seguro</p>                                                                                                                                    |
| **IO ANTIFRAUD\_ID**   | <p>Chave pública do antifraude. Insira de acordo com o seu plano na IO. </p><p><em>(você obtém essa informação na sua Conta Digital em Vendas > Pagamentos Online)</em></p>                                                                                                                                                                                                                                                                    |
| **Sandbox Mode**       | <p>O 'sandbox'  setado como <strong>Yes</strong> conecta na API de testes da IO, ou seja, nenhuma transação de pagamentos é efetivada no mundo real e nenhum debito é processado. Esse modo é útil para realizar testes de integração.</p><p></p><p>No modo sandbox '<strong>No</strong>', as transações passam pelas APIs de produção e efetivam o processamento dos pagamentos junto a cadeia do sistema de pagamentos brasileiro (SPB).</p> |
| **Debug Mode**         | Habilitando este modo, informações adicionais serão incluídas nos logs em caso de falhas                                                                                                                                                                                                                                                                                                                                                       |
| **Transaction Method** | Configure para 'Autorização' caso o seu plano possua antifraude.                                                                                                                                                                                                                                                                                                                                                                               |
| **Total**              | Valor mínimo de um pedido para que o módulo de pagamento da IO seja habilitado. Recomenda-se deixar esse campo vazio.                                                                                                                                                                                                                                                                                                                          |
| **GeoZone**            | Caso o seu ecommerce possua varias zonas geográficas, selecione a zona em que o módulo IO será ativado. Ou selecione 'All Zones' para ativar em todas as zonas geográficas.                                                                                                                                                                                                                                                                    |
| **Status**             | Define se o módulo de pagamentos está habilitado ou não. Selecione Enabled para ativar                                                                                                                                                                                                                                                                                                                                                         |
| **SortOrder**          | <p>Ordem de exibição dos módulos.</p><p>Caso seu ecommerce possua diversos meios de pagamentos configurados, esse campo é utilizado para ordenar a exibição.</p><p></p><p>Quanto maior for esse número, mais para baixo na lista de opções aparecerá.</p><p></p><p><strong>Valor recomendado</strong>: 1</p>                                                                                                                                   |

#### 4.3 Configurando Status

Quando uma transação é gerada ou é atualizada, o modulo da IO atribui automaticamente a identificação de status mais apropriada.\
\
Acesse a aba 'Order Status' para configurar os status das transações com os status disponíveis na sua instalação do OpenCart.

![](/files/-MWQM11CZl82_bxAF4gZ)

{% hint style="warning" %}
**Atenção:** para o correto funcionamento, o seu OpenCart deve possuir status cadastrados para os diferentes estágios de uma transação e você deve vinculá-los de acordo com a imagem acima.\
\
Para confirmar que a sua instalação do OpenCart possui "Order Status" cadastrados, acessando a seção:\
**System > Localization > Order Status**<br>
{% endhint %}

| **Status**               | **Cartão de Crédito**                                                                                                                                                                                                                                                                                                                      | **Boleto**                                                                                                                                                                                                                                                                                                             |
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Cancelado**            | O pagamento foi cancelado                                                                                                                                                                                                                                                                                                                  | O boleto foi cancelado                                                                                                                                                                                                                                                                                                 |
| **Pagamento Processado** | <p>O pagamento foi processado e aprovado na análise antifraude, O débito foi realizado junto ao banco emissor e bandeira do cartão.<br><br>O valor da venda já se encontra como recebível na sua conta IO de acordo com o seu plano de recebimento.</p>                                                                                    | Boleto compensado com sucesso. O valor estará disponível na sua conta IO em até 48h.                                                                                                                                                                                                                                   |
| **Negado**               | O pagamento foi negado pelo banco emissor o cartão ou negado pela análise antifraude                                                                                                                                                                                                                                                       | N/D                                                                                                                                                                                                                                                                                                                    |
| **Expirado**             | N/D                                                                                                                                                                                                                                                                                                                                        | Pagamentos do tipo boleto cujo prazo limite de pagamento não foram atingidos                                                                                                                                                                                                                                           |
| **Falhado**              | <p>Houve falha na captura do pagamento.</p><p><br>Dados de pagamento incorretos ou inválidos.<br><br>Também pode indicar problema temporário de conectividade entre o datacenter do ecommerce e o datacenter da IOPAY, ou problema temporário de comunicação entre IOPAY e demais participantes da cadeia de pagamentos.</p><p></p><p></p> | <p>Houve falha ao gerar o boleto.</p><p><br>Dados de pagamento incorretos ou inválidos.<br><br>Também pode indicar problema temporário de conectividade entre o datacenter do ecommerce e o datacenter da IOPAY, ou problema temporário de comunicação entre IOPAY e demais participantes da cadeia de pagamentos.</p> |
| **Pendente**             | <p>Uma transação com cartão de crédito com status <strong>Pendente</strong> simboliza que a transação foi pré autorizada pelo banco emissor  e se encontra atualmente em <strong>análise antifraude.</strong> <br><br>Obs: Após a análise antifraude, o status da transação pode mudar para Pagamento Processado ou Negado.</p>            | Aguardando pagamento do boleto                                                                                                                                                                                                                                                                                         |
| **Pagamento Estornado**  | <p>Indica que o pagamento foi cancelado pela loja ou pelo cliente consumidor (chargeback).<br><br>Quando um pagamento é estornado o valor da compra é devolvido para o cliente seguindo critérios estabelecidos pelas bandeiras e bancos emissores.</p><p></p>                                                                             | N/D                                                                                                                                                                                                                                                                                                                    |

#### 4.4 Mapeando os Campos

O último passo para configurar o módulo de checkout transparente é mapear os custom fields disponíveis no seu OpenCart com os 4 tipos especiais necessários para correta integração com a IO.\
\
Se você seguiu os passo 3.1 dessa documentação, basta selecionar conforme a imagem abaixo

![](/files/-M_SGd59slpVcg5qhY9T)

Se você pulou o passo 3.1, pois já possui campos similares em sua instalação, basta escolher para quais campos personalizados o módulo IO vai estar vinculado.

Clique em salvar alterações.\
\
**Pronto**, o módulo de checkout transparente já está disponível para uso.\
Preview da interface de pagamentos:

### 4.3 Final

#### Interface para pagamento por cartão de crédito à vista ou em até 12x

![](/files/jHhp4Xdaf2uTeWtYXrpl)

####

#### Gere boletos com facilidade

Permita que o seu cliente gere boletos sem deixar sua loja e acessar plataformas externas. \
Aumente a sua conversão de vendas com essa simplificação de processos.<br>

![](/files/QQ7fOp2GxnwIs0KrybfB)

#### &#x20;PIX: VENDA POR PIX VIA CÓDIGO QR OU PIX COPIA E COLA

![Interface de escolha para pagamento via PIX](/files/Ks9fVlThaOq0ykLPvEFy)

![Transação PIX gerada. A interface possibilita pagamentos por PIX via Código QR ou pagamentos PIX Copia e Cola](/files/GFFtmClVMsrPrf36GhY0)

\ <br>

#### Interface responsiva

Os módulos de pagamento da IO contam com interface responsiva, permitindo que seus clientes possam pagar acessando e qualquer dispositivo: smartphones, tablets e desktops.

## Webhooks / Callbacks

Após a instalação e configuração do módulo Checkout Transparente para OpenCart, segundo o tutorial acima, você deve especificar a URL na qual a IOPAY realizará requisições para informar sobre mudança de status em transações de pagamento ocorridas para a sua conta.

Através dos webhooks, notificamos o seu ecommerce toda vez que uma nova transação for gerada, paga, cancelada ou sofrer qualquer outra mudança de status, mantendo assim todas as informações referentes à pagamentos sempre atualizadas na sua loja.

O módulo para opencart fornecido pela IOPAY já conta com este recurso (webhook client) e você precisará apenas informar a URL da sua loja na sua conta digital IOPAY, conforme o padrão abaixo:

```
https://domain.com/index.php?route=extension/payment/iopay_checkout_transparente/callback
```

Para inserir a URL acima, acesse a sua conta digital da IOPAY, navegue até a opção **Vendas > Pagamentos Online > Configurações de Integração com Checkout**

Conforme exemplificado abaixo:

![Troque https://domain.com/ pelo endereço correto da sua instalação OpenCart](/files/57yvgbjHQDUAlhGvWnqw)

## Segurança & Compliance

O módulo checkout transparente para OpenCart utiliza a API oficial de pagamentos da IOPAY, que conta com compliance PCI-DSS para garantir segurança máxima em todo seu pool tecnológico para transações de pagamento.&#x20;

![](/files/-MVqkR-9OidFdlMjTUGP)

{% embed url="<https://onboarding.iopay.com.br>" %}
Abra a sua conta hoje mesmo e comece a lucrar mais\ <br>
{% endembed %}

{% content-ref url="/pages/-MVxmrTniMZ75cL\_pCHr" %}
[Checkout Transparente](/products/modulos-para-ecommerce/modulos-para-opencart/checkout-transparente-para-opencart)
{% endcontent-ref %}


# WordPress / WooCommerce

Checkout Transparente para WooCommerce - Plugin grátis para PIX, Boleto e Cartão de Crédito via IOPAY

&#x20;**Instalando o checkout transparenteIOPAY no WooCommerce**

Guia para  a instalação de todos os componentes necessários para utilizar o plugin do IOPAY para WooCommerce.&#x20;

Vamos lá:

### Brazilian Market on WooCommerce

O primeiro plugin que precisa ser instalado — e que é um requisito básico — chama-se Brazilian Market on WooCommerce. Ele é necessário por conta dos campos obrigatórios de Customer, como CPF, Endereço e Telefone, que a API IOPAY pede no momento da criação de uma transação.

Para instalar esse plugin é necessário acessar o Painel Wordpress > Plugins > Adicionar Novo. Em seguida, digite no campo de pesquisa, no canto superior direito o seguinte: Brazilian Market on WooCommerce. Veja esses passos na imagem a seguir

&#x20;

Excelente! Como mostra o passo, clique no botão "Instalar agora", neste primeiro resultado do lado esquerdo. O processo de instalação deve demorar alguns segundos — assim que ele for finalizado, clique em "Ativar".

Este módulo gera alguns campos que são de envio obrigatório para a API na hora da finalização da transação. São eles:

&#x20;<img src="/files/l4YfQAnXVd2I7PuHN3YX" alt="" data-size="original">

&#x20;

Campos de cobrança, será usado para entrega se o de entrega não for fornecido

| Nome                | Id                    |
| ------------------- | --------------------- |
| Primeiro nome:      | billing\_first\_name  |
| Último nome:        | billing\_last\_name   |
| CPF:                | billing\_cpf          |
| Sexo:               | billing\_sex          |
| Data de Nascimento: | billing\_birth\_date  |
| Telefone:           | billing\_phone        |
| Celular:            | billing\_cellphone    |
| E-mail:             | billing\_email        |
| Rua:                | billing\_address\_1   |
| Número:             | billing\_number       |
| Complemento:        | billing\_address\_2   |
| Bairro:             | billing\_neighborhood |
| Cidade:             | billing\_city         |
| Estado:             | billing\_state        |
| País:               | billing\_country      |
| CEP:                | billing\_postcode     |

&#x20;

Campos de entrega, se não for fornecido, será usado o de cobranca

| Primeiro nome:      | shipping\_first\_name  |
| ------------------- | ---------------------- |
| Último nome:        | shipping\_last\_name   |
| Sexo:               | shipping\_sex          |
| Data de Nascimento: | shipping\_birth\_date  |
| Telefone:           | shipping\_phone        |
| Celular:            | shipping\_cellphone    |
| E-mail:             | shipping\_email        |
| Rua:                | shipping\_address\_1   |
| Número:             | shipping\_number       |
| Complemento:        | shipping\_address\_2   |
| Bairro:             | shipping\_neighborhood |
| Cidade:             | shipping\_city         |
| Estado:             | shipping\_state        |
| País:               | shipping\_country      |
| CEP:                | shipping\_postcode     |

### &#x20;

### Instalando o Plugin de Pagamentos IOPAY para  Woocommerce

O próximo passo é instalar o plugin da IOPAY para WooCommerce. Para isso você deve seguir os seguintes passos:

1 - Você deve baixar o arquivo woocommerce-IOPAY-X.X.X.zip da última versão do módulo&#x20;

2 - Acessar o menu Plugins > Adicionar Novo em seu painel admin do wordpress.

3 - Nesta mesma página, clique em Enviar Plugin > Browse...:

<img src="https://lh4.googleusercontent.com/8g-PTEG7buYyALietfkBcJ2kocU0u2GbPqF_g8vhZbwMLNemjOPkpnUlFaotakigA7pmAROSO99G-hrUsG4DrRG-kXS5YtRLkBpJczF1GXE0PE1ibtw9oqHEX3y12ktHoNUDIWmYv-SpDG7MULKd_xuhLpwedeSrhyyvRD1rjC4S1B7Gls33qwVUCKgXHsOjLZCxdg" alt="1284" data-size="original">

![1284](https://lh4.googleusercontent.com/8g-PTEG7buYyALietfkBcJ2kocU0u2GbPqF_g8vhZbwMLNemjOPkpnUlFaotakigA7pmAROSO99G-hrUsG4DrRG-kXS5YtRLkBpJczF1GXE0PE1ibtw9oqHEX3y12ktHoNUDIWmYv-SpDG7MULKd_xuhLpwedeSrhyyvRD1rjC4S1B7Gls33qwVUCKgXHsOjLZCxdg)

4 - Após fazer o upload do arquivo, você deve clicar em Instalar agora.

5 - Após isso, poderá ativar o módulo da IOPAY em sua loja e então fazer suas configurações:

Pronto! O plugin IOPAY para WooCommerce está instalado no seu WooCommerce. Assim que esse plugin é ativado, você é direcionado à página de configuração dos plugins, que é nosso próximo passo.

&#x20;

**Configurando o Plugin IOPAY**

Agora que você já tem o plugin instalado no seu WooCommerce, vamos então configurar este complemento para aceitar transações por Boleto, Cartão de crédito e PIX.

### Configurações de Boleto bancário

Primeiro é preciso que você encontre o plugin IOPAY. Faça isso em: Plugins > Plugins Instalados > WooCommerce IOPAY e clique em Configurações de boleto, assim como é mostrado nos passos 1 de 3:

&#x20;

![](https://lh3.googleusercontent.com/GlJ_BamU81xvJ2VvRANxqnj-7BsOlt2tmxy4hglpVWxDCRhz8Oci4ow9fI1Vc40OHKlHxczVY5ZhkWTWkM3Y0qzwvBGzIoXJ63E80DIMV8T8hN1i62_A9H0l1j8bgSntKcHfgU5OJLbHFEqhqP93PxY8cqXNBIvHgyK-_u6sD_eqlDVEm0TfdcMAfFdTlzppU_ZD0A)

&#x20;

Ao clicar em Configurações de boleto, a tela a seguir é mostrada. É preciso configurar esses campos, então veja o que cada um significa e como fazer isso nas explicações abaixo.

&#x20;

![](https://lh3.googleusercontent.com/_hyguBf_bBDvvtAJrFYHxKBDgJBHBwZ8Bn1wP4XKljILhgH1XQ00ofx9OAR9FDSjEOHLt-gtwGIvT2IzeWf_FUkjZ-EdoOpA4yQ0KtMdZuSqI3qBNnBsAHKKZY8xdc2FMtuantJYKh0Kh6w91QbH12if7FNV5ytBooqsyw_GjmepClVz0PL0ml-tklVkSd1rT9H66w)

![](https://lh3.googleusercontent.com/ef8-gJXnEbqVuFJMi2FFf3ScCEbLgvqN0kan_J2xVToBOJWBpDp1M6dQeX-fHoaPyY6McQ-cHhGybMFOBqUEY28pTqL8GuTnOqaSj36OgNT-8VdWW6lNltaHLsJVYCMtdbdEheCrzMemfJCjFfBgyx9IKtSoifH0VISAEAZs_h3rus0dYkHtTI2XSGJRGfTncy4qXA)

&#x20;

&#x20;

### Explicando os campos da imagem acima:

#### Habilitar/Desabilitar:

Ativa ou desativa a opção de oferecer o boleto do IOPAY na sua página de finalização de pedido.

#### Ativar Sanbox IOPAY:

Ativa ou desativa a opção de testes junto a IOPAY

#### Título:

Neste campo é necessário indicar o nome que será mostrado para a opção de Boleto bancário na página de finalização de compra no seu site.

#### Descrição:

Ao lado do título você pode também fornecer uma descrição para esta opção, também na página de finalização de compra no seu site.

&#x20;

#### E-mail Auth:&#x20;

Neste campo você deve colocar seu e-mail da API IOPAY.

&#x20;

#### IO\_SELLER\_ID:

Neste campo você coloca a sua IO\_SELLER\_ID, que é uma chave utilizada para autenticar o seu negócio junto à API do IOPAY.

#### SECRET

Preste atenção sempre em qual chave você está usando, se é a de teste ou a de produção.

&#x20;

#### Log de depuração:

Habilita a opção de que eventos sejam registrados em um arquivo de Log. Isso é essencial para investigar possíveis questões que interfiram no funcionamento do plugin.

Uma vez inseridas todas essas informações, agora é só clicar em Salvar alterações para que o boleto do IOPAY esteja habilitado em sua loja.

&#x20;

### Configurações de Cartão de crédito

Assim como na configuração anterior, para fazer as alterações de Cartão você precisa seguir o caminho: Plugins > Plugins Instalados > WooCommerce IOPAY e então clicar em Configurações de Cartão de crédito, como mostra a imagem abaixo:

![](https://lh3.googleusercontent.com/CKtgWJ6Up8kkDDHHNqWL42ocjOgS_OGqR1kXQPK3c7CC0EdjqnVT6N-GPFA2ZW5PMYtwojuVVexnOxGSeCZ6ehnkmpEZVCpcPEyZ_3ZmmAzCXVbCHXeW0JK6IbuLWRa5tdzOUrljsu96ZyCkOMQLR8c_EnEahlkkPAIiKP4_LMCGESm0o3cF8DkWK4j0LsMPF_vsAQ)

&#x20;

Ao clicar em Configurações de Cartão de crédito, a tela a seguir é mostrada. É preciso configurar esses campos, então veja o que cada um significa e como fazer isso nas explicações abaixo.

&#x20;

![](https://lh4.googleusercontent.com/2GGe2MoSoaz31YsZmpVLFdTrk-Mx-fQvYqGwHsjjEEUf6fCfoIIR1QZQiSVbUXYTnwbQVSTzuDvUnl7jydtsEJfMA_UJMldiKZHot6qFnrTK3fZGQkBdspgXibSwkxLeRbXT-PoVSkzlIdiuIv0do_5ZyI2l3HcR0hy0n2gWUk57ocLXjhN18x8F2jMZIqN1--sqyw)

![](https://lh4.googleusercontent.com/HT6_Z2tgj0FVa1bqs0QSVkTugMWdMNc5H9qqmpxAvBiCp4JiYmtvEQ2jFty0ttggiaubxtl5r6_ilOeYGFcHqFtG3v965hf-dYVbS7MSTwyWm60ltaGGFazHmo4ai_gZh7fc0WPx0G3nVCHHjvguLTFxGNAK2uHKJfLdrDg0aNFZPGsJuwSzQ8mGDuYsd-hAlJBjTg)![](https://lh5.googleusercontent.com/IAY0PQ_VHGit48mpIWUB5NwkHkcdE3jRRcvmyIvpZrhiPrq8i-n3riP8eEySjf4nY6NBvYxeK8pIfdZm6HlvfNHPnuGHwb_Bs6lwjzbpsJj8vq_SoKeiOzDoFnXdpG3b5XsUjMXactHtDp92jlrN8rVVps7bDu66C9dJHVljGMX2HHNCqRQK90SeVttLcTyD5PJQ-g)

&#x20;

&#x20;

Explicando os campos da imagem acima:

#### Habilitar/Desabilitar:

Ativa ou desativa a opção de pagamento com Cartão de crédito na sua página de finalização de pedido.

&#x20;

#### Ativar Sanbox IOPAY:

Ativa ou desativa a opção de testes junto a IOPAY

&#x20;

#### Título:

Neste campo é necessário indicar o nome que será mostrado para a opção de Cartão de crédito na página de finalização de compra no seu site.

#### Descrição:

Ao lado do título você pode também fornecer uma descrição para esta opção, também na página de finalização de compra no seu site.

#### E-mail Auth:&#x20;

Neste campo você deve colocar seu e-mail da API IOPAY.

&#x20;

#### IO\_SELLER\_ID:

Neste campo você coloca a sua IO\_SELLER\_ID, que é uma chave utilizada para autenticar o seu negócio junto à API do IOPAY.

#### SECRET

Preste atenção sempre em qual chave você está usando, se é a de teste ou a de produção.

&#x20;

#### Número de parcelas:

Este campo define em até quantas vezes será possível parcelar um pedido.

#### Valor da menor parcela:

Caso queira, você pode definir um valor mínimo para as parcelas de compras feitas no seu site. O módulo mostra sempre o maior número até que o valor seja atingido. Por exemplo: Um produto A tem um valor de R$100,00, mas foi configurado no módulo que a parcela mínima seria R$70,00, então a única opção disponível é o pagamento à vista.

#### Taxa de juros:

O módulo IOPAY oferece a conveniência de calcular (via juros simples) o valor das parcelas de acordo com um valor de juros passado neste campo. Configure este valor usando ponto, e não vírgula. Caso a sua aplicação não cobre juros, é preciso deixar o campo como 0.

#### Antifraude:

Se voce contratou o plano antifraude, deixe esse campo marcado, atençao se ficar desmarcado e voce utiliza o plano, o sistem ficara com erro.

<br>

#### Parcelas sem juros:

Alinhado diretamente com o ponto de juros, esta opção define em até quantas parcelas aquele pedido não será cobrado juros. Exemplo: Digamos que o campo esteja configurado com 3, ou seja, caso o cliente opte por comprar em 1x, 2x ou 3x, seu pedido não será cobrado juros, mas caso escolha 4x, todas as parcelas terão juros aplicados.

#### Log de depuração:

Habilita a opção de que eventos sejam registrados em um arquivo de Log. Isso é essencial para investigar possíveis questões que interfiram no funcionamento do plugin.

&#x20;

Agora tudo o que precisa ser feito é clicar em "Salvar Alterações" e a sua loja estará pronta para transacionar com a opção de Cartão de crédito do IOPAY. Viu como é simples?

<br>

### Configurações do PIX

Primeiro é preciso que você encontre o plugin IOPAY. Faça isso em: Plugins > Plugins Instalados > WooCommerce IOPAY e clique em Configurações de PIX, assim como é mostrado nos passos 1 de 3:

&#x20;

![](https://lh3.googleusercontent.com/GlJ_BamU81xvJ2VvRANxqnj-7BsOlt2tmxy4hglpVWxDCRhz8Oci4ow9fI1Vc40OHKlHxczVY5ZhkWTWkM3Y0qzwvBGzIoXJ63E80DIMV8T8hN1i62_A9H0l1j8bgSntKcHfgU5OJLbHFEqhqP93PxY8cqXNBIvHgyK-_u6sD_eqlDVEm0TfdcMAfFdTlzppU_ZD0A)

&#x20;

Ao clicar em Configurações de PIX, a tela a seguir é mostrada. É preciso configurar esses campos, então veja o que cada um significa e como fazer isso nas explicações abaixo.

&#x20;

![](https://lh6.googleusercontent.com/YMI2Z3aP0M5oeW_3nyvzUJTLtiE18PCIpligsv4SsU1fgtM72r6cPiI1oZ2XgqtfcjLqBD3VaOOfvk9GKQFbtJKABMaqIRQIoLc0lfy5Mp2-ZoZPm5UCkaIG4ucDpWHzV769-scQv0Cb5Ox5zZzwBKUka6LNzVwJhcc5dywiBPyjwYo9eiMNlePFywgU-Zv5kkA4Tw)

&#x20;

![](https://lh4.googleusercontent.com/34jF9n2zqzJACfTYLIclbR7AAKf5MBfVtPYzFfmmOyEADaW0hi6OSU_kNrx6JX8n9kSj3ryY_tKzhIMTHIP37H2pQk6KzwrTcQ_2Ztlt-SdDTqY8vf24RSlH3C3RgoQQgnLXdCd-xP9mGpunJFpvh2yVD2jaOaf-qoSkwplYcuI0oJoGGOJ-Jm4yyVSsfnZDsesQiA)

&#x20;

&#x20;

&#x20;

### Explicando os campos da imagem acima:

#### Habilitar/Desabilitar:

Ativa ou desativa a opção de oferecer o boleto do IOPAY na sua página de finalização de pedido.

#### Ativar Sanbox IOPAY:

Ativa ou desativa a opção de testes junto a IOPAY

#### Título:

Neste campo é necessário indicar o nome que será mostrado para a opção de Boleto bancário na página de finalização de compra no seu site.

#### Descrição:

Ao lado do título você pode também fornecer uma descrição para esta opção, também na página de finalização de compra no seu site.

#### E-mail Auth:&#x20;

Neste campo você deve colocar seu e-mail da API IOPAY.

#### IO\_SELLER\_ID:

Neste campo você coloca a sua IO\_SELLER\_ID, que é uma chave utilizada para autenticar o seu negócio junto à API do IOPAY.

#### SECRET

Preste atenção sempre em qual chave você está usando, se é a de teste ou a de produção.

#### Log de depuração:

Habilita a opção de que eventos sejam registrados em um arquivo de Log. Isso é essencial para investigar possíveis questões que interfiram no funcionamento do plugin.

Uma vez inseridas todas essas informações, agora é só clicar em Salvar alterações para que o boleto do IOPAY esteja habilitado em sua loja.


# Magento

Para obter detalhes entre em contato com <integracao@iopay.com.br>


# Checkout Transparente Magento 1.x

Módulo de Pagamentos Checkout Transparente grátis para lojas baseadas em Magento 1 (1.6.x a 1.9.x)

## Documentação

Esse módulo para Magento 1.x permite integrar sua loja com a IOPAY API.

Métodos de pagamento disponíveis:

* PIX
* Boleto
* Cartão de Crédito (à vista e parcelado até 12x)

## Requerimentos para integração

* [PHP 5.6+](https://www.php.net)
* [Magento 1.x](https://magento.com/tech-resources/download)
* [OpenMage](https://www.openmage.org/)

## Compatibilidades com OneStep Checkouts

* Inovarti Onestep Checkout
* Firecheckout
* Moip Checkout
* Onepage

## Instalação via Composer

```
$ composer require iopay-payments/magento1
```

## Instalação via GIT

```
$ git clone https://github.com/iopay-payments/magento1 ~/iopay
$ cp -r ~/iopay/* /dir/magento1x/
```

### Manual

1. Clique [aqui](https://github.com/iopay-payments/magento1/archive/refs/heads/master.zip) e baixe o arquivo `.zip` de nossa versão mais recente. O arquivo será semelhante a `iopay-payments-magento1-main.zip`
2. Descompacte o arquivo **zip** e copie as pastas `app` e `skin` na pasta raiz da sua instalação do Magento
3. Limpe o cache em `Sistema > Gerenciamento de Cache`

## Configuração

1. Acesse o painel administrativo da sua loja Magento 1.x
2. Vá em `Sistema > Configuração > Métodos de Pagamento > IOPAY- Preferências`
3. Escolha o **Ambiente** de atuação (Sandbox ou Production)
4. Em **Campo CPF** selecione de qual campo será enviado o CPF do usuário (Caso o seu checkout não possua o campo CPF nativo, selecione a opção IOPAY Taxvat), consulte seu desenvolvedor
5. Em **Gerar Invoice** informe se você deseja criar uma fatura automaticamente quando o pedido for aprovado pela IoPay
6. Informe os dados para **IOPay E-mail**, **IOPay Secret** e seu **IOPay Seller Id**
7. Salve as configurações

Para que o Magento receba as atualizações dos status dos pedidos pela API da IOPAY, é necessário configurar a url de webhook na sua conta IOPAY com a seguinte rota:

## Webhook Url

```
$ https://domain.com.br/iopay/webhook
```

## API

<https://docs-api.iopay.dev/>


# Magento 2

Tutorial de instalação de checkout transparente para Magento 2 com IOPAY

### Plugin IOPAY para Magento 2

Este módulo para Magento 2.x permite integrar sua loja com a IOPAY API.

Métodos de pagamento disponíveis:

* Pix
* Boleto
* Cartão de Crédito

### Requerimentos para integração

* [PHP 7.1+](https://www.php.net)
* [Magento 2.x](https://magento.com/tech-resources/download)

### Instalação via Composer

```
$ composer require iopay-payments/magento2
```

### Instalação via GIT

```
$ git clone https://github.com/iopay-payments/magento2 ~/iopay
$ cp -r ~/iopay/* /dir/magento2x/app/code/IoPay/Core
```

#### Manual <a href="#user-content-manual" id="user-content-manual"></a>

1. Clique [aqui](https://github.com/iopay-payments/magento2/archive/refs/tags/v1.0.0.zip) e baixe o arquivo `.zip` de nossa versão mais recente. O arquivo será semelhante a `iopay-payments-magento2-master.zip`
2. Descompacte o arquivo **zip** e copie todo o conteúdo na pasta raiz da sua instalação do Magento em `app`/`code`/`IoPay`/`Core` (essa pasta deverá ser criada manualmente)
3. Limpe o cache em `Sistema > Gerenciamento de Cache`

**Após a instalação execute os comandos a seguir:**

```
$ rm -rf pub/static/*
$ php bin/magento setup:upgrade;
$ php bin/magento setup:di:compile;
$ php bin/magento setup:static-content:deploy -f
$ php bin/magento cache:clean;
$ php bin/magento cache:flush;
```

### Configuração

Todas as opção de configuração do módulo se encontram no painel administrativo Acesse o menu: `Lojas`/`Configurações`/`Vendas`/`Formas de pagamento`/`IOPAY Pagamentos`

### Webhook Callback Url <a href="#user-content-webhook-callback-url" id="user-content-webhook-callback-url"></a>

```
$ seudominio.com.br/iopay/webhook
```

### &#x20;<a href="#user-content-api" id="user-content-api"></a>

### &#x20;<a href="#user-content-api" id="user-content-api"></a>

### Api <a href="#user-content-api" id="user-content-api"></a>

[https://docs-api.iopay.com.br/](https://docs.iopay.com.br/)

### Contato <a href="#user-content-contato" id="user-content-contato"></a>

Para maiores informações acesse: <https://iopay.com.br>


# Drupal

Plugin Checkout Transparente para Drupal grátis

Em breve :)


# WebHooks & Notificações

Atualizações de status de forma assíncrona

Webhooks (também conhecidos como HTTP Callbacks) são uma forma de se registrar para receber informações úteis em uma URL específica de sua escolha.&#x20;

Quando ocorre uma alteração no estado de um recurso dentro das plataformas da IOPAY (por exemplo, uma transação é aprovada com sucesso), um evento é gerado por essa ocorrência e imediatamente enviamos uma request do tipo POST para as URL cadastrada na sua conta digital. \
\
Estes disparos automáticos são para informar a criação ou alteração de uma transação de pagamento processada com IOPAY. <br>

**Para utilizar a notificação de eventos você precisa:**\
\
&#x20;\- Implementar o seu sistema de recebimento de notificações\
&#x20;\- Cadastrar as URLs desse sistema na IOPAY, através da sua conta digital IO.\
&#x20;\- Quando ocorrer uma ação ou atualização de status nas transações enviadas para a IO, as notificações serão disparadas de acordo com os webhooks cadastrados

### Parâmetros recebidos por WebHook

| Parâmetro     | Exemplo                          | Descrição                                                                                                      |
| ------------- | -------------------------------- | -------------------------------------------------------------------------------------------------------------- |
| id            | 75f9451f3bcd49ab9710bfa7026e4a62 | ID da transação que esta sendo informada                                                                       |
| reference\_id | 321                              | ID da sua aplicação (o mesmo reference\_id enviado na integração, que reflete o id do pedido na sua aplicação) |

### Exemplo de Request da IOPAY para a sua Aplicação &#x20;

#### application/json

POST

```json
{
    "id":"75f9451f3bcd49ab9710bfa7026e4a62",
    "type":"transaction.succeeded",
    "status":"succeeded",
    "reference_id":"414"
}
```

### &#x20;Como usar a atualização por eventos e WebHooks da IO

O evento é disparado à partir da estrutura da IO para o sua aplicação, fornecendo os três parâmetros acima.\
\
Você deverá receber esse evento e realizar uma chamada para obtenção da atualização da transação. Ou seja, a IO avisa a sua aplicação, através do WebHook que houve alteração para determinada transação (id) e sua aplicação deve acessar a endpoint específica para obter detalhes de uma transação (com o id recebido), para então checar a mudança de status ocorrida.

Para obter detalhes de uma transação pelo id da mesma, utilize a endpoint "[Recupera uma transação](https://docs-api.iopay.dev/#a32c0609-aebc-441a-be3c-55fdada77efa)"

{% embed url="<https://docs-api.iopay.dev/#a32c0609-aebc-441a-be3c-55fdada77efa>" %}

## Erros no disparo de eventos

O evento é disparado e caso encontre falha na execução do request ou falha no status code da sua aplicação (status code diferente de 200), o webbook fará mais 3 tentativas, com intervalo de tempo entre elas.

## URL Custom

Para determinar para qual URL a IOPAY deve direcionar os eventos, acesse a Conta Digital e navegue no menu principal até a opção:

*Configurações > Transações Online*&#x20;

Desça até a porcão destacada na imagem abaixo abaixo:

![](/files/-McQrbrt63nWhwRc9AY_)

Basta Informar a URL da aplicação para qual a IOPAY fará disparos de notificação no campo **"URL de notificação (HTTPS)"** e clicar no botão Salvar Alterações.

{% hint style="success" %}
**Exemplo**\
*<https://minhaloja.com.br/loja/ReceivePaymentStatusChange>*
{% endhint %}

{% hint style="warning" %}
Apenas URL´s com protocolo seguro HTTPS são permitidas
{% endhint %}


# Canais de Suporte

### Suporte via E-mail

A IO conta com time de integração preparado para auxiliar nas suas integrações. \
Entre em contato sempre que precisar com <suporte@iopay.com.br>

*de segunda à sexta, das 09:00 às 17h*

### Telefones

(11) 3816-6837&#x20;

*de segunda à sexta, das 09:00 às 17h*

### Suporte via Chat

Você também pode entrar em contato com o time de integração via Chat, através do site:

<https://iopay.com.br/atendimento>

*de segunda à sexta, das 09:00 às 17h*


