Tutorial - Imagem no rodapé do blog

Olá pessoal!

Sentindo falta dos tutoriais? Eu também! Relaxo quando crio os posts, mas fico com medo de não compreenderem, mas qualquer coisa estou aqui, tudo bem?

Lembrando que uso o MODELO TRAVEL e uso ele para qualquer blog que eu faça, então, talvez o seu não dê ou é em um local diferente em seu modelo.

CLIQUE NAS IMAGEM PARA VER MELHOR OU SALVAR.

Bora lá aprender a colocar esta imagem bem fofa que fica lá em baixo, bem acima da atribuição como a imagem demonstra abaixo:


O que muitos não sabem é que a imagem toda é em PNG, assim deixa mais harmônico e com o fundo real do blog, para quem não sabe basta achar as imagens em PNG e fazer a montagem de acordo com o que quer. Segue a imagem abaixo em PNG para fazerem sua arte.
OBS: Está transparente, não é pegadinha rs, clique abaixo e salve a imagem ok?
Agora, depois de toda sua arte pronta, vamos colocar no rodapé do blog, preparado? Então mãos à obra!



Clique em MODELO, depois em EDITAR HTML e expandi todas as setinhas que fica na lateral esquerda, após ter feito isso, aperte CTRL+F dentro do quadrado de código que abrirá uma caixinha de pesquisa, procure por este código:

/* Widgets

Abaixo vai encontrar este código aqui:

.footer-inner {
background: transparent none repeat scroll top center;
}

Logo abaixo dele, cole o código abaixo:

.footer-outer {
width: 1000px; /*Largura da imagem, não altere se não souber*/
height:180px; /*Altura da imagem, não altere se não souber*/
background:url(URL DA IMAGEM) no-repeat bottom center;
}

O que está de Vermelho é para alterar a largura e altura, mas se utilizou a imagem que disponibilizei no início do post em PNG, não é preciso.
O que está em Azul é a URL da imagem, eu utilizo o próprio blog para hospedar as imagens, veja como se faz isso NESTE POST.

Muito fácil não é? Espero que eu tenha ajudado.

Beijos e até a próxima!

OBS: Favor não copiar, dê sempre os créditos, este blog está sobre licença e você pode ser acusado de plágio.

Comentários
9 Comentários

9 comentários:

  1. Oie Tamires =)

    Muito legal o tutorial, embora eu tanto como leitora de blogs como designer curta um visual mais limpo rs...

    Beijos;***

    Ane Reis.
    mydearlibrary | Livros, divagações e outras histórias...
    @mydearlibrary


    ResponderExcluir
  2. Amei o tutorial. E é bem facinho. Vou tentar fazer lá no blog.

    M&N | Desbrava(dores) de livros - Participe do nosso top comentarista de fevereiro. Você escolhe o livro que quer ganhar!

    ResponderExcluir
  3. Oi Tami
    Adoro ver tutoriais. Estou sempre tentando melhorar o blog e esses tutoriais ajudam bastante. Sou uma negação pra edição de imagens, mas se acaso eu conseguir fazer algo decente, ponho do rodapé do blog hehe.
    Beijos

    Vidas em Preto e Branco 

    ResponderExcluir
  4. Oi Taaaa!!!

    Claro que estava com saudade desses posts! Adoro um tutoria!! Faça sempre!!!

    Bjinhos
    JuJu
    As Besteiras Que Me Contam

    ResponderExcluir
  5. Olá, tudo bem??

    Adorei o tutorial viu... Vou tentar algo diferente um dia desses pra ver se me saio bem! Fico tudo muito bem explicadinho, parabéns

    XOXO
    umnovo-roteiro.blogspot.com

    ResponderExcluir
  6. Oie!

    Parabéns pelo tuto, muito útil, me ajudou bastante! :3

    Abs,
    http://leiturasilenciosaoficial.blogspot.com.br

    ResponderExcluir
  7. Oooi,

    Adoro tutoriais, meu problema agora é que no novo layout quando clicamos no post o menu vai lá para abaixo de todos os posts.
    Vou ter que sentar com meu namorado e estudar isso direito HSUAHSUHA. HTML me tira o sono ¬¬'


    Beijinhos,
    www.entrechocolatesemusicas.com

    ResponderExcluir
  8. Oi Tami! Quando for mudar meu blog quero algo bem bonito nele.
    Adorei seu tutorial e assim quem sabe eu aprenda um pouco disso rsrs

    Beijos
    www.amorliterario.com

    ResponderExcluir
  9. Obrigada. O seu tutorial foi o único que deu certo no meu blog. :)

    ResponderExcluir

Obrigada pela visita, seu comentário me deixa muito feliz e pode ter certeza, vou retribuir com muito carinho!