Você está montando sua página de vendas VSL e deseja exibir apenas o vídeo por alguns minutos? Quer ocultar o botão de compra ou algum elemento da página por um tempo? Neste artigo vamos apresentar uma simples solução.
É incrível a dificuldade de achar algo tão simples na internet, talvez por falta de expressar o termo correto. Às vezes nos deparamos com plugins ou códigos enormes, para realizar algo muito simples.
O que queremos aqui, é ocultar um elemento CSS, e exibi-lo apenas depois de um período de tempo. Isso pode ser facilmente criado com um simples Javascript com menos de 4 linhas.
Como ocultar um elemento por alguns minutos?
A primeira coisa que você precisa entender, é qual elemento vai ocultar. Caso seu desejo seja ocultar quase a página inteira, deixando apenas o vídeo, basta criar uma DIV com HTML, colocar uma classe CSS de sua escolha, e fecha-la no final da página.
.classname {display:none;}Caso esteja usando o editor de blocos do WordPress, você também pode ocultar facilmente elementos indo em configurações avançadas de cada bloco e definindo a classe CSS.
Após escolher a classe CSS e adicioná-la aos elementos que deseja ocultar, você precisa adicionar o Javascript no Header. Tudo isso depende do tema ou plugin que estiver utilizando.
Adicione o seguinte código no Header:
<script>setTimeout(function() {
$('.classname').show()
}, 400000);
</script>Em ClassName, você coloca o nome da classe que deseja ocultar. No número 400000 você determina o tempo de espera para o elemento se tornar visível. Trata-se de milissegundos.
A cada 1000, temos um total de 1 segundo. Então os 400000 encontrados no código equivale a cerca de 6 minutos. Você pode usar essa informação para calcular o tempo desejado.
Viu como é simples ocultar um elemento ou metade da página por um período? Um simples código, perfeito para criar sua VSL, página de vendas ou qualquer outra coisa na qual deseja manter o foco.