Opções do construtor · Cliente JavaScript

Todas as opções são opcionais. Os valores abaixo são os padrões que o cliente aplica quando você omite uma delas.

JavaScript

const entase = new Entase({
  pk: null,
  locale: 'auto',
  checkoutMode: 'auto',
  collectConsent: true,
  backdrop: true,
  backdropColor: '#000000',
  tprm: {},
  pane:  { width: 800, height: '100%' },
  popup: { width: 800, height: 1000 }
});

Opções

Nome	Tipo	Padrão	Descrição
`pk`	string	`null`	Sua chave publicável. O cliente a envia ao verificar se o seu domínio tem permissão para usar o checkout integrado. Sem ela, todo checkout é aberto como um pop-up.
`locale`	string	`'auto'`	Idioma do checkout. `'auto'` lê o atributo `lang` do seu elemento `<html>`.
`checkoutMode`	string	`'auto'`	`'auto'`, `'pane'` ou `'popup'`. Consulte Modos de checkout. Um valor não reconhecido volta para `'auto'`.
`collectConsent`	boolean	`true`	Define se o checkout solicita que o visitante aceite o aviso sobre os termos. Após ser aceita, a resposta é armazenada em um cookie e essa etapa é ignorada.
`backdrop`	boolean	`true`	Define se a página atrás do checkout deve ser escurecida. `false` também desativa o bloqueio de rolagem da página.
`backdropColor`	string	`'#000000'`	Cor da área escurecida, como um valor de cor CSS.
`tprm`	object	`{}`	Parâmetros de rastreamento adicionados ao URL do checkout como parâmetros de consulta. Consulte Rastreamento e consentimento.
`pane`	object	`{ width: 800, height: '100%' }`	Tamanho do painel integrado. Ignorado no modo pop-up.
`popup`	object	`{ width: 800, height: 1000 }`	Tamanho da janela pop-up, em pixels. Ignorado no modo painel.

Dimensionamento do painel e do pop-up

pane.width aceita um número (pixels) ou qualquer comprimento CSS – '720px', '50%', '40vw' ou uma expressão calc(). Um número simples é tratado como pixels.

O painel fica limitado a essa largura em desktops e ocupa toda a largura em dispositivos móveis, nos quais pane.height é aplicado. A mudança entre os dois ocorre quando a viewport é mais estreita que a largura configurada; quando a largura é fornecida como uma unidade relativa, a mudança ocorre em 800px.

popup.width e popup.height aceitam apenas números em pixels, e a janela é centralizada na tela do visitante. Se a tela não for alta o suficiente para a altura solicitada, a janela é reduzida para caber.

Fundo

O fundo é escurecido mais intensamente atrás de um pop-up do que atrás de um painel, porque um pop-up precisa fazer com que a página abaixo pareça inativa. Defina backdrop: false para remover totalmente o escurecimento – isso também mantém a página rolável atrás do checkout.

backdropColor é aplicado como está, portanto pode ser qualquer cor CSS válida. Use-o para combinar com um site escuro ou com a identidade visual da marca, e não para ocultar o fundo; para isso, backdrop: false é a opção correta.

Substituições por reserva

checkoutMode, collectConsent, backdrop, backdropColor, pane e popup podem ser substituídos para uma única reserva ao passá-los para book(). O valor no nível da instância permanece inalterado para chamadas subsequentes:

JavaScript

const entase = new Entase({ pk: 'YOUR_PUBLISHABLE_KEY' });

// Esta reserva abre mais larga, sem escurecimento.
entase.book('EVENT_ID', {
  pane: { width: '60vw' },
  backdrop: false
});

pk e tprm não são opções por reserva – pk identifica a conta para toda a página, e os parâmetros de rastreamento são alterados com setTracking() quando precisam ser diferentes.