Colocar uma imagem animada no cabeçalho

Pin It
4 Comentários »

As vezes queremos incluir uma imagem animada como cabeçalho no blog. Só que no blogger, por padrão, quando incluímos uma imagem no Header, diretamente pelo HTML do template, a imagem fica sem animação, se apresenta de forma estática.
Portanto, caso você queira incluir uma imagem em gif, ou até mesmo uma animação em flash, você terá que incluir a imagem através dos elementos de página, para ver como faz, siga as orientações a seguir.

Entre no painel do Blogger, clique no menu “modelo”, entre na edição HTML do seu blog, NÃO marque “Expandir Modelos de Widgets”, para modificar o código que define o cabeçalho:

Procure por:


<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='TITULO-DO-SEU-BLOG (Cabeçalho)' type='Header'/>
</b:section>

Altere os seguintes trechos:
Onde está escrito locked=’true’ troque por locked=’false’.
onde está maxwidgets=’1′ , troque por maxwidgets=’5′; onde está showaddelement=’no’ , troque por showaddelement=’yes’;

Acho que não preciso dizer mas, em todo caso: É óbvio que você não vai conseguir localizar esta parte: “title=’TITULO-DO-SEU-BLOG (Cabeçalho)”, porque onde está escrito “TITULO-DO-SEU-BLOG” é o título do seu blog, portanto, procure pela 1º linha que você conseguirá localizar a 2º linha logo abaixo (veja imagem demonstrativa acima).

Salve as alterações e vá em “Layout”, você verá que abaixo do cabeçalho existe um campo para Adicionar Gadget.
Só que para você conseguir incluir uma imagem animada, terá que excluir o cabeçalho padrão, para posteriormente conseguir adicionar uma imagem para ficar como cabeçalho no seu blog.
No elemento cabeçalho, clique em “editar” e em seguida clique no botão “excluir”.

Agora que você já excluiu o cabeçalho padrão e já tem a imagem que vai utilizar hospedada, clique em “adicionar gadget” e escolha >> HTML/Javascript e cole o código abaixo:


 <a href="ENDEREÇO-DO-SEU-BLOG"><img src="ENDEREÇO-DA-IMAGEM"></img></a>

Vanessa

Vanessa é blogueira desde 2009, e 'aspirante' a web design nas horas vagas. Autodidata, viciada em internet, adoradora de blogs, seus códigos e templates, apaixonada por programas gráficos, tecnologia e web design,e fascinada pelo estilo gótico. Leia Mais sobre a autora »

facebooktwittergoogle pluslinkedinyoutube



Torne-se fã do Blog no Facebook!

4 comentários em: “Colocar uma imagem animada no cabeçalho

  1. Charles disse:
    Ola….. ME AJUDEM… eu fiz ficou tudo certo mas não consigo encostar ajustar a imagem….. blog afetado ciaosmequetrefe.blogspot.com
    • Vanessa disse:
      Inclua trecho de código para formatar a largura, altura e os espaçamentos da sua imagem. Pode usar esse código aqui:

      <a href="ENDEREÇO-DO-SEU-BLOG"><img style="margin:XXpx;padding:XXpx;width: XXpx; height: XXpx;" alt="" src="ENDEREÇO-DA-IMAGEM"/></a>
      Não esqueça que vc deve incluir os valores em margin, padding, height e width.

  2. Andreza disse:
    ótimo tutu, parabéns pelo blog, encontrei ótimas dicas aqui!
  3. Amanda disse:
    Maravilhosas suas dicas e tutoriais.

Comente!

Seu comentário é muito importante, entretanto, só serão publicados os comentários que estiverem de acordo com nossa Política de Comentários.
Obter Avatar [?]

PageRank Checking Icon

© 2009-2012 Mundo Blogger - Todos os direitos reservados | Design by Vanessa |