These docs are for v1.0. Click to read the latest docs for v4.1.

Lightbox Checkout

Este modelo permite que todo o processo de pagamento seja feito em uma janela que se sobrepõe ao site do vendedor. Para isso é necessário incluir a biblioteca javascript conforme código abaixo:

Eventos do Lightbox

O Lightbox possui alguns eventos, como o de sucesso, abandono e, quando o lightbox não consegue abrir. Veja abaixo como funciona:

<!DOCTYPE html>
<script type="text/javascript" src="https://stc.sandbox.pagseguro.uol.com.br/pagseguro/api/v2/checkout/pagseguro.lightbox.js"></script>

<script type="text/javascript">
//Insira o código de checkout gerado no Passo 1
var code = 'INSIRA_SEU_CÓDIGO';
var callback = {
    success : function(transactionCode) {
        //Insira os comandos para quando o usuário finalizar o pagamento. 
        //O código da transação estará na variável "transactionCode"
        console.log("Compra feita com sucesso, código de transação: " + transactionCode);
    },
    abort : function() {
        //Insira os comandos para quando o usuário abandonar a tela de pagamento.
        console.log("abortado");
    }
};
//Chamada do lightbox passando o código de checkout e os comandos para o callback
var isOpenLightbox = PagSeguroLightbox(code, callback);
// Redireciona o comprador, caso o navegador não tenha suporte ao Lightbox
if (!isOpenLightbox){
    location.href="https://pagseguro.uol.com.br/v2/checkout/payment.html?code=" + code;
    console.log("Redirecionamento")
}
        </script>
    </body>
</html>

Configurações Opcionais

🚧

Essas configurações devem ocorrer nos parâmetros feitos no passo 1.

Você poderá configurar sua chamada, adicionando os parâmetros necessários para a situação que desejar. Conheça cada uma delas abaixo:

Excluindo meios de pagamento

Com esta configuração você poderá excluir dinamicamente os grupos e os meios de pagamento.

Os grupos de pagamento são divididos entre BALANCE (Saldo PagSeguro), BOLETO (Boleto), CREDIT_CARD (Cartão de Crédito), DEPOSIT (Depósito) e EFT (Débito Online)

Já os meios de pagamentos são divididos entre Bandeiras e os Bancos disponíveis, sendo eles:

Débito Online: DEBITO_BRADESCO, DEBITO_ITAU, DEBITO_UNIBANCO, DEBITO_BANCO_BRASIL, DEBITO_BANRISUL e DEBITO_HSBC

Boleto: BOLETO

Bandeiras: VISA, MASTERCARD, AMEX, DINERS, HIPERCARD, AURA, ELO, PLENOCARD, PERSONALCARD, JCB, DISCOVER, BRASILCARD, FORTBRASIL, CARDBAN, VALECARD, CABAL, MAIS, AVISTA, GRANDCARD e SOROCRED.

currency=BRL
&itemId1=0001
&itemDescription1=Notebook Prata
&itemAmount1=24300.00
&itemQuantity1=1
&itemWeight1=1000
&reference=REF1234
&senderName=Jose Comprador
&[email protected]
&shippingType=1
&shippingAddressStreet=Av. Brig. Faria Lima
&shippingAddressNumber=1384
&shippingAddressComplement=5o andar
&shippingAddressDistrict=Jardim Paulistano
&shippingAddressPostalCode=01452002
&shippingAddressCity=Sao Paulo
&shippingAddressState=SP
&shippingAddressCountry=BRA
&excludePaymentMethodGroup=CREDIT_CARD,BOLETO
&excludePaymentMethodName=DEBITO_ITAU,DEBITO_BRADESCO
<?xml version="1.0" encoding="ISO-8859-1" standalone="yes"?>
<checkout>
	<currency>BRL</currency>
	<items>
		<item>
			<id>0001</id>
			<description>Notebook Prata</description>
			<amount>24300.00</amount>
			<quantity>1</quantity>
			<weight>1000</weight>
		</item>
	</items>
	<reference>REF1234</reference>
	<sender>
		<name>José Comprador</name>
		<email>[email protected]</email>
	</sender>
	<shipping>
		<type>1</type>
		<address>
			<street>Av. Brig. Faria Lima</street>
			<number>1384</number>
			<complement>5o andar</complement>
			<district>Jardim Paulistano</district>
			<postalCode>01452002</postalCode>
			<city>Sao Paulo</city>
			<state>SP</state>
			<country>BRA</country>
		</address>
	</shipping>
	<acceptedPaymentMethods>
		<exclude>
			<paymentMethod>
				<group>CREDIT_CARD</group>
			</paymentMethod>
			<paymentMethod>
				<group>BOLETO</group>
			</paymentMethod>
			<paymentMethod>
				<name>DEBITO_ITAU</name>
			</paymentMethod>
		</exclude>
	</acceptedPaymentMethods>
</checkout>

Parcelamento sem juros

Para oferecer um parcelamento sem juros, você deverá utilizar três parâmetros: Grupo, Chave e Valor paymentMethodGroup1, paymentMethodConfigKey1_1 epaymentMethodConfigValue1_1.
No parâmetro grupo você deve informar o meio pagamento CREDIT_CARD (Cartão de Crédito).
Para o campo chave, utilize o parâmetro MAX_INSTALLMENTS_NO_INTEREST que configura o parcelamento sem juros. Já no campo valor, você deve informar o número de parcelas que você deseja assumir.

currency=BRL
&itemId1=0001
&itemDescription1=Notebook Prata
&itemAmount1=24300.00
&itemQuantity1=1
&itemWeight1=1000
&reference=REF1234
&senderName=Jose Comprador
&senderAreaCode=11
&senderPhone=56273440
&[email protected]
&shippingType=1
&shippingAddressRequired=true
&shippingAddressStreet=Av. Brig. Faria Lima
&shippingAddressNumber=1384
&shippingAddressComplement=5o andar
&shippingAddressDistrict=Jardim Paulistano
&shippingAddressPostalCode=01452002
&shippingAddressCity=Sao Paulo
&shippingAddressState=SP
&shippingAddressCountry=BRA
&paymentMethodGroup1=CREDIT_CARD
&paymentMethodConfigKey1_1=MAX_INSTALLMENTS_NO_INTEREST
&paymentMethodConfigValue1_1=6
<?xml version="1.0"?>
<checkout>
    <currency>BRL</currency>
    <items>
        <item>
            <id>0001</id>
            <description>Notebook Prata</description>
            <amount>24300.00</amount>
            <quantity>1</quantity>
            <weight>1000</weight>
        </item>
    </items>
    <reference>REF1234</reference>
    <sender>
        <name>José Comprador</name>
        <email>[email protected]</email>
        <phone>
            <areaCode>11</areaCode>
            <number>56273440</number>
        </phone>
    </sender>
    <shippingAddressRequired>true</shippingAddressRequired>
    <shipping>
        <type>1</type>
        <address>
            <street>Av. Brig. Faria Lima</street>
            <number>1384</number>
            <complement>5o andar</complement>
            <district>Jardim Paulistano</district>
            <postalCode>01452002</postalCode>
            <city>Sao Paulo</city>
            <state>SP</state>
            <country>BRA</country>
        </address>
    </shipping>
    <paymentMethodConfigs>
        <paymentMethodConfig>
            <paymentMethod>
                <group>CREDIT_CARD</group>
            </paymentMethod>
            <configs>
                <config>
                    <key>MAX_INSTALLMENTS_NO_INTEREST</key>
                    <value>6</value>
                </config>
            </configs>
        </paymentMethodConfig>
    </paymentMethodConfigs>
</checkout>

Desconto por meio de pagamento

Se você deseja oferecer o desconto por meio de pagamento, também deverá utilizar os três parâmetros: Grupo, Chave e Valor paymentMethodGroup1, paymentMethodConfigKey1_1 epaymentMethodConfigValue1_1.
No campo grupo você deve informar o meio pagamento: CREDIT_CARD (Cartão de Crédito), DEPOSIT (Depósito) e/ou EFT (Débito Online). Em chave, informe o DISCOUNT_PERCENT, já o campo valor a porcentagem de desconto que deseja oferecer. No exemplo abaixo, você poderá oferecer um desconto de 10% para o meio de pagamento boleto e 5% para o meio de pagamento via cartão de crédito:

currency=BRL
&itemId1=0001
&itemDescription1=Notebook Prata
&itemAmount1=24300.00
&itemQuantity1=1
&itemWeight1=1000
&reference=REF1234
&senderName=Jose Comprador
&senderAreaCode=11
&senderPhone=56273440
&[email protected]
&shippingType=1
&shippingAddressStreet=Av. Brig. Faria Lima
&shippingAddressNumber=1384
&shippingAddressComplement=5o andar
&shippingAddressDistrict=Jardim Paulistano
&shippingAddressPostalCode=01452002
&shippingAddressCity=Sao Paulo
&shippingAddressState=SP
&shippingAddressCountry=BRA
&paymentMethodGroup1=BOLETO
&paymentMethodConfigKey1_1=DISCOUNT_PERCENT
&paymentMethodConfigValue1_1=10.00
&paymentMethodGroup2=CREDIT_CARD
&paymentMethodConfigKey2_1=DISCOUNT_PERCENT
&paymentMethodConfigValue2_1=5.00
<?xml version="1.0"?>
<checkout>
    <currency>BRL</currency>
    <items>
        <item>
            <id>0001</id>
            <description>Notebook Prata</description>
            <amount>24300.00</amount>
            <quantity>1</quantity>
            <weight>1000</weight>
        </item>
    </items>
    <reference>REF1234</reference>
    <sender>
        <name>José Comprador</name>
        <email>[email protected]</email>
        <phone>
            <areaCode>11</areaCode>
            <number>56273440</number>
        </phone>
    </sender>
    <shipping>
        <type>1</type>
        <address>
            <street>Av. Brig. Faria Lima</street>
            <number>1384</number>
            <complement>5o andar</complement>
            <district>Jardim Paulistano</district>
            <postalCode>01452002</postalCode>
            <city>Sao Paulo</city>
            <state>SP</state>
            <country>BRA</country>
        </address>
    </shipping>
    <paymentMethodConfigs>
        <paymentMethodConfig>
            <paymentMethod>
                <group>CREDIT_CARD</group>
            </paymentMethod>
            <configs>
                <config>
                    <key>DISCOUNT_PERCENT</key>
                    <value>22.50</value>
                </config>
            </configs>
        </paymentMethodConfig>
        <paymentMethodConfig>
            <paymentMethod>
                <group>BOLETO</group>
            </paymentMethod>
            <configs>
                <config>
                    <key>DISCOUNT_PERCENT</key>
                    <value>2.25</value>
                </config>
            </configs>
        </paymentMethodConfig>
    </paymentMethodConfigs>
</checkout>