Como adicionar o script "Carregando" enquanto seu blog carrega

Você certamente já deve ter visto em algum site ou blog este tipo de script em ação. O seu funcionamento é extremamente simples: um texto ou imagem qualquer que indique o carregamento da página é exibido até que seja finalizado o carregamento por completo do blog/site. E para nossa felicidade é possível adicioná-lo ao blog no blogger, veja como nas etapas a seguir.

Primeira etapa:

Vá até o painel do seu blogger e clique no link Design, em seguida clique em Editar HTML. Logo após, procure (Ctrl + F) pelo seguinte trecho:

</head>

Acima deste trecho, adicione o código do script:

<script>function doload(){document.getElementById("load").style.display="none";}window.onload=doload;</script>

Segunda etapa:

Clique no menu Layout no painel do Blogger para ver os elementos de página e Adicionar um gadget, selecione a opção HTML/JavaScript e cole o código abaixo:

<div id="load" style="text-align:center;"><img src="http://1.bp.blogspot.com/_kRiGysx6lag/TP62h7xtQwI/AAAAAAAABII/aScRAnXcJXE/s1600/gifload.gif"/></div>

Se quiser substitua o trecho acima destacado em negrito por uma imagem preferível. Caso você opte por exibir apenas um texto em vez do código acima, insira o trecho abaixo:

<div id="load" style="text-align:center;">Aguarde, carregando...</div>

Visualize e veja se ocorreu tudo certo.

Veja um exemplo do funcionamento do script neste blog de testes.

Obs: O código mostrado nesta segunda etapa pode ser inserido sem problemas em qualquer outra parte do seu template.

Até a próxima!

4 Comentários

  1. Olá Leonardo…
    Sempre venho ao seu blog quando tenho problemas e quando quero ficar actualizado.

    Realmente nunca pensei achar este post pois ando procurando por ele há 1 ano! Mas agora que achei, eu experimentei em meu blog de testes e tive sucesso parcial.

    Explicando:

    1. O conteúdo do blogue apareceu por completo! Eu pensei que fosse tipo ter um fundo branco ou de outra for, e no centro da pagina apareceria a imagem em gif.

    2. Tem como usar algum código que tenhas disponibilizado aqui em algum post, que ensine como fazer isso? Ou conhece algum blog que segue que tenha esse artigo? Pode ser em Inglès!

    Agradeço desde já a ajuda…
    Parabéns pelo blogue de qualidade.
    Abraços de Angola

    Responder

Deixe um comentário

Ao comentar você concorda com nossa Política de Comentários.