Como colocar imagem no rodapé do blog.

8 de set. de 2011

Hi girls! Hoje venho com um tutorial suuper legal (eu achei pelo menos rsrs) Estava procurando a um tempinho e ontem do nada achei, lógico que fiquei muito feliz e vim aqui testar, como gostei do resultado vim logo compartilhar com vocês! Quero começar creditando o blog Garotas Complicadas pois foi lá que aprendi o tutorial. Se você ainda está boiando, o tutorial vai ensinar a por uma imagem no final do blog, uma continuação das colunas e da área de postagem, você pode enfeitar ao seu gosto, pode por exemplo arredondar os cantos e escrever alguma mensagem e tal. O resultado será semelhante ao do Go Imagine, veja só:

A imagem ficou meia embaçada mas acho que dá para ter uma ideia do resultado, se quiser vá descendo o blog e veja certinho.  Clique em "leia mais" para ler o tutorial.
Primeiramente você precisará fazer uma imagem. Você  tem que saber a largura da área das postagens e da barra lateral, para não ficar desencaixado depois. 

Não sei se é só no meu blog que acontece mas quando eu quero fazer uma imagem continuando as colunas (rodapé e cabeçalho) eu tenho que fazer a imagem 20px menor que a largura total do blog se não não encaixa, por exemplo: Meu blog tem a largura de 1040px então faço as imagens com a largura de 1020px.

Fiz um mini tutorial por imagem para os mais iniciantes de como fazer a imagem do rodapé, só não reparem é bem meia boca rsrs. Clique nos links abaixo para ver as imagens.
Obs: Na imagem tutorial eu disse para fazer a imagem com a largura 20px menor que a largura do blog, mas se você quiser tente primeiro fazer a imagem com a largura do seu blog mesmo e se não der certo faça 20px menor.
Logo após fazer sua imagem, salve e hospede em algum local.

Sem mais delongas, vamos pro tutorial:

Vá em Design > Editar HTML, e marque a opção "expandir modelos de widgets" . Pressione Ctrl + F e procure por  <!-- main -->   Logo ACIMA adicione o seguinte código:
<center> <img height='altura' src='Url da sua imagem' width='largura'/> </center> 
Onde estiver "altura" troque pela medida de altura da sua imagem, a minha é 100 e acho que é um bom tamanho se você estiver indeciso.
Troque também "Url da sua imagem" pela url (link) da sua imagem. Meio obvio né? rsrs
E onde estiver "largura" substitua pela medida de largura da sua imagem. 

Bom gente, era isso, espero que tenham entendido bem. Qualquer duvida pergunte por comentário!

25 comentários:

  1. Oi Anni, a parceria com as marcas é bem simples, é só você entrar no site da empresa que você quer parceria e mandar um e-mail pedindo. Aí se eles se interessarem pelo seu blog, você vira parceira e geralmente ganha amostras para testar :)!

    Beijos, Julia
    makes-da-julia.blogspot.com

    ResponderExcluir
  2. Adorei esse tutorial e achei o daqui mais fácil!
    obrigada

    ResponderExcluir
  3. aafs esse blog só é de menina é mais gostei vlw ai pela dica vou tenta fazer agora depois passa no meu blog para vc ver como ficou o roda pê

    ResponderExcluir
  4. Adoreei, estava procurando a um tempão, vlw mesmo ;)

    ResponderExcluir
  5. ola seu blog/site é muito interessante vou curtir ele no face,,,se for possivel queria que trocassemos links vc colocaria o seu link no meu blog/site e eu no seu blog/site ambos como parceria...anota ai o enderço do meu site.... www.mapadosfilmes.com

    ResponderExcluir
  6. Flor você poderia dizer como você fez pros seus marcadores ficar com fundo diferentes!? Beeijinhos

    Modaponto.blogspot.com

    ResponderExcluir
  7. Flor, ensina como nós podemos colocar imagens nos titulos das páginas igual a este blog crisvallias.com.br

    ResponderExcluir
    Respostas
    1. É simples, é só fazer uma imagem com todos os "ícones" do seu menu lado a lado e depois mapear. Vê esse tutorial:
      blogdagi1.blogspot.com.br/2012/03/menu-mapeado.html

      Excluir
  8. oii,estava procurando esse tuto a mt tempo!obrigada!---->http://coisinhademeninacut.blogspot.com

    ResponderExcluir
  9. Não consigui colocar o link do rodapé no html da erro me explique mais =P

    ResponderExcluir
  10. e como que tira se nao quiser mais ?

    ResponderExcluir
  11. Me ajudou muito,obrigada mesmo

    ResponderExcluir
  12. Tutorial Totalmente funcional, parabéns pelo seu blogger.

    ResponderExcluir
  13. Deu super certo comigo.
    Beijos
    seguindo ♥

    blogdathayaneazevedo.blogspot.com

    ResponderExcluir
  14. Lindo o tutorial. Claro que eu usei :)
    Parabéns pelo blog viu? Cada detalhe uma graça :)
    Bjinhos :)

    florestarosa.blogspot.com.br/

    ResponderExcluir
  15. Amei essa postagem,eu estava precisando.Seguibdo você.Beijuss

    http://femmemakiup.blogspot.com.br/

    ResponderExcluir
  16. Nossa! Muito Obrigado Mesmo! Estava procurando a um tempão!!

    ResponderExcluir
  17. Gostei do seu tutorial, mas o que eu gostaria mesmo de faze é colocar um rodapé como o que está agora no seu blog, onde a cor ou imagem pegue até nos gadget. Já procurei um bocado e nenhum tuto tem funcionado.

    ResponderExcluir
  18. Tem como o rodapé ocupar toda largura do blog?

    ResponderExcluir
  19. como eu faço pra colocar um e-mail pra contato anexado a palavra "contato" no rodapé no blog?/
    obg e boa tarde!
    att: Ricardo Bassman

    ResponderExcluir

- Comentários do tipo "seguindo, segue de volta" "lindo o blog, seguindo, retribui?" Serão ignorados se não tiverem uma opinião sobre o post em si.
- Não aceitamos mais selinhos e tags, sorry!
- Leia a página "FAQ" e outras páginas internas antes de perguntar qualquer coisa.
- Sua opinião é sempre bem vinda. Mas seja educado!

© Go Imagine - 2014. Todos os direitos reservados.