Exibir imagem antes de carregar o site

Resolvido peterjota
(@peterjota)

4 anos, 2 meses atrás

Boas!

Estou terminando o site de um cliente e ele solicitou exibir uma imagem pegando a tela toda, como se fosse uma “capa” do site. A idéia é exibir essa imagem ANTES de aparecer qualquer outra coisa do site, após clicar na imagem ou 5 segundos a imagem desaparece e a home é exibida.

Tentei plugin modal e popup mas sempre carrega o site junto e acaba mostrando algo da home antes, preciso mesmo que seja carregada essa imagem antes da home.

Alguma idéia de plugin ou código fácil para implementar isso?

Visualizando 5 respostas - 1 até 5 (de um total de 5)

Ralden Souza
(@ralden)

4 anos, 2 meses atrás

saudações,

a solução para isso acredito que seja popup full-screen. inclusive já vários no repositório para pesquisar,

https://br.wordpress.org/plugins/search/popup+full+screen/

sou usuário do Elementor Pro e uso duas soluções. ou coloco a seção com altura de página – mas isso não serviria no seu caso, pois ai aparece o menu acima da primeira seção… ou justamente uso um popup full-screen. ai nas regras (rules) do popup, eu indico que deve rodar assim que a página é rodada, configuraria os 5 segundos antes de sumir, com o botão X para os apressados…

o plugin Page Takeover, que é 5º resultado que apareceu para mim no link do repositório que coloquei, parece oferecer isso. ele diz que facilmente permite um popup full-screen, com opção de aparição imediata.

espero ter ajudado. sucesso! [gassho]
Criador do tópico peterjota
(@peterjota)

4 anos, 2 meses atrás
@ralden muito obrigado pela sua atenção

Acabei de testar o Page TAke Over aqui, e por mais que eu coloque zero lá nas regras para exibição (ou deixe sem nada) ele ainda carrega a home rapidamente e depois exibe a modal. Provavelmente menos de 1 segundo mas vai ser suficiente para meu cliente reprovar. Ja tinha testado plugins semelhantes e tem esse mesmo problema

Estive pensando em usar algum javascript / jquery para resolver isso.. mas ainda nao cheguei num resultado legal.
- Esta resposta foi modificada 4 anos, 2 meses atrás por peterjota.
Ralden Souza
(@ralden)

4 anos, 2 meses atrás
para se inspirar, veja o site abaixo,

https://www.omelete.com.br/

eles fazem exatamente o que você quer, fica bloqueado o site enquanto carrega a publicidade ou você clica no X no canto superior direito.

a questão de carregar algo antes é que o popup está “no meio” dos demais conteúdos que carregam no site. o que precisa fazer é colocar o plugin como o primeiro item a ser carregado, o primeiro javascript, ai sim você zera qualquer outra visualização.

incluse nisso adoro o Elementor Pro, porque quando cria as regras, o zero lá é absoluto, o Elementor coloca o popup antes de carregar qualquer outra coisa. para fúria do Google PageSpeed, que reclama de atraso de renderização 😀

ai veja com seu cliente se ele aceita assim ou se você cobra a mais para ou trabalhar seja priorização do javascript ou pagar um desenvolvedor para fazer isso. sugiro deixar o plugin, porque com certeza cliente vai querer mudar depois essa “capa” e com o plugin facilmente ele muda.

sucesso! [gassho]
- Esta resposta foi modificada 4 anos, 2 meses atrás por Ralden Souza.
Criador do tópico peterjota
(@peterjota)

4 anos, 2 meses atrás

@ralden verdade tinha a questão da ordem dos plugins.

Deu certo!

E ainda consegui fazer um random em jQuery para exibir uma capa diferente no background da modal do plugin a cada visita.

Perfeito!

Muito obrigado man, abs!

Ralden Souza
(@ralden)

4 anos, 2 meses atrás

hehehe show!!! por vezes são apenas detalhes, o legal no software livre é que juntos vemos o que o outro ainda não viu e ai todo mundo ganha. sucesso!

Visualizando 5 respostas - 1 até 5 (de um total de 5)

O tópico ‘Exibir imagem antes de carregar o site’ está fechado para novas respostas.

Visualizações