Como sincronizar o botão de Upsell One Click com o VTurb?

1. Copie o código do seu botão One Click. O botão será um trecho em HTML, semelhante ao mostrado na imagem abaixo: (exemplo ilustrativo do botão One Click)

2. Crie uma div ao redor do código do botão. Essa div servirá para que o botão seja controlado pelo script de delay do VTurb.

Atribua a ela a classe esconder, conforme o exemplo:

<div class="esconder">
//COLE O SEU CODIGO DO BOTÃO ONE CLICK
</div>

Exemplo completo (com um botão genérico ilustrativo):

<div class="esconder">
	<button id="oneClickBuy"
	        data-product-id="prod_ABC123"
	        data-offer-id="offer_001"
	        class="btn-oneclick">
	  Comprar agora (1-clique)
	</button>
</div>

3. Adicione o código de delay na sua página.

Esse código define o tempo em que o botão (ou qualquer outro elemento com a classe esconder) aparecerá durante o vídeo. Ajuste o valor da variável delaySeconds conforme o momento desejado (em segundos):

<style>
  .esconder {
    display: none;
  }
</style>

<script>
  var delaySeconds = 10;
  var player = document.querySelector("vturb-smartplayer");
  player.addEventListener("player:ready", function() {
    player.displayHiddenElements(delaySeconds, [".esconder"], {
      persist: true
    });
  });
</script>

Atualizado em: 06/10/2025