post

Código JavaScript para Redirecionamento de Pagina com Contagem Regressiva

Publicado em: 01/08/2023

Categorias: BlogElementorJavaScriptJSWordpress

Com o código abaixo será possível redirecionar o usuário assim que a contagem finalizar, para isso, edite a variável urlRedirect com a URL que desejar e countInit com o tempo que desejar.

<center>
  <h3 style="color: #000;font-size: 60px;" id="countRedrct"></h3>
  <p id="redirectMessage"></p>
</center>

<script>
	var urlRedirect = "https://PAGINA_DO_DIRECIONAMENTO.com.br/";
    var countInit = 6;
    setInterval(function () {
      countInit = countInit - 1;
      document.getElementById("countRedrct").innerHTML = countInit;
      if (countInit <= 0) {
        window.location.href = urlRedirect;
        document.getElementById("countRedrct").innerHTML = 0;
      }
    }, 1000);

    var redirectParagraph = document.getElementById("redirectMessage");
    var link = document.createElement("a");
    link.href = urlRedirect;
    link.textContent = "clique aqui";
    redirectParagraph.innerHTML = "Para acessar manualmente ";
    redirectParagraph.appendChild(link);
</script>

Abaixo código editado para funcionar no editor do Elementor, para que não direcione quando estiver construindo a pagina:

<center>
  <h3 style="color: #000;font-size: 60px;" id="countRedrct"></h3>
  <p id="redirectMessage"></p>
</center>

<script>
  function isFrontend() {
    return !window.location.href.includes('elementor-preview');
  }

  if (isFrontend()) {
    var urlRedirect = "https://PAGINA_DO_DIRECIONAMENTO.com.br/";
    var countInit = 6;
    setInterval(function () {
      countInit = countInit - 1;
      document.getElementById("countRedrct").innerHTML = countInit;
      if (countInit <= 0) {
        window.location.href = urlRedirect;
        document.getElementById("countRedrct").innerHTML = 0;
      }
    }, 1000);
    
    var redirectParagraph = document.getElementById("redirectMessage");
    var link = document.createElement("a");
    link.href = urlRedirect;
    link.textContent = "clique aqui";
    redirectParagraph.innerHTML = "Para acessar manualmente ";
    redirectParagraph.appendChild(link);
  }
</script>

Link de compartilhamento

Compartilhe esse conteudo nas redes sociais ou por mensagem usando o link curto abaixo. Basta clicar em cima do link para copiar.

bruno.art.br/pb/3004

ID de Referência: 3004

Sugira uma publicação

Envie uma mensagem para mim, e sugira alguma publicação de algum tema que tenha dificuldades de resolver.

Clique aqui e entre em contato


Comentários