22/03/2013

Créditos no Footer/Rodapé com logo


Yo bunnies! Todos abemos como é importante o crédito no rodapé do blog, tanto para quem disponibiliza quando para quem usa. Esse estilo de rodapé da um ar mais organizado e profissional. Esse estilo de rodapé oferece muita mais personalização do que o famoso Rodapé Simples, claro que o simples é meu eterno querido. 

Eu já havia postado esse tutorial a um bom tempo, mas resolvi atualizar e jogá-lo de volta ao topo. É isso, até a próxima!

.::Exemplo::.


1. Abra sua conta no blogger, escolha qual blog deseja aplicar. Vá em HTML e usando Ctrl+F procure ]]></b:skin>, acima dele cole:

Códigos
#rodape-creditos {
font:normal bold 13px Arial; /* - Fonte do rodapé - */
color:#FFFFFF; /* - Cor da fonte - */
background:#303030; /* - Cor de Fundo do Rodapé - */
border-top:4px solid #3F4C6B; /* - Edite a borda - */
margin:0px 0px 0px; /* - Não é necessário editar - */
}
#rodape-creditos a:link {
color:#A8B5C4; /* - Cor dos Links do Rodapé - */
text-decoration:none; /* - Decorações do Link - */
outline:0px solid #FFFFFF; /* - Não é necessário editar - */
}
#rodape-creditos a:visited {
color:#A8B5C4; /* - Cor dos Links Visitados - */
text-decoration:none; /* - Decoração dos Links Visitados - */
outline:0px solid #FFFFFF; /* - Não é necessário edittar - */
}
#rodape-creditos a:hover {
color:#A8B5C4; /* - Cor do Link com o Mouse em cima - */
text-decoration:underline; /* - Decoração do Link com o mouse em cima - */
outline:0px solid #FFFFFF; /* - Não é necessário edittar - */
}

2. Ainda HTML procure por  </body, ao achar acima do código cole:

Códigos
<div id='rodape-creditos'>
<table border='0' cellpadding='5' cellspacing='0' oncontextmenu='return false' ondragstart='return false' width='100%'><tr>
<td style='width:72%;text-align:left;'>&#169; <a href='LINK DO BLOG'>NOME DO BLOG</a> - 2012. Todos os direitos reservados.<br/>Criado por: <a href='URL DO AUTOR DO BLOG' rel='nofollow' target='_blank'>NOME DO AUTOR DO BLOG</a>.<br/>Tecnologia do <a href='http://www.blogger.com' target='_blank'>Blogger</a>.</td>
<td style='width:28%;text-align:center;'><a href='LINK DO BLOG'><img alt='imagem-logo' border='0' id='logo-footer' oncontextmenu='return false' ondragstart='return false' src='LINK DA LOGO DO BLOG'/></a><br/></td></tr>
</table>
</div>
Mude as partes onde se pede e prontinho!


Modifique o código para que fique como desejado ou adequado ao seu layout, esse é o tutorial de hoje espero que tenham gostado. Antes de terminar quero passar os créditos ao blog site #Categoria Blogger foi lá que achei esse tutorial, então obrigada.

23 comentários:

  1. Esse é um tuto que eu ainda não conhecia o/ acho que vou usar em meu novo lay, seguindo a dica de não fazer nada chamativo na logo, é claro^^ kissus Wendy!

    www.shoujoeafins.blogspot.com

    ResponderExcluir
  2. Sempr que posso procuro usar esse tuto.

    http://meucupcakedemorango.blogspot.com.br/

    ResponderExcluir
  3. Qual é sua conta?
    Vou te adicionar nos meus autores.

    http://perfectnaiveforever.blogspot.com.br

    ResponderExcluir
  4. ótimo tutu
    http://mr-kawaii.blogspot.com.br/

    ResponderExcluir
  5. tava precisando kkk obrigada pelo tuto XD
    kisses

    ResponderExcluir
  6. É um ótmo tuto também já ensinei lá no PE ..

    ResponderExcluir
  7. Anônimo26/3/13

    Ótimo tuto , gostei ^.^

    Abraços >> pensamento-jhenny.tk
    PASSE LÁ :)

    ResponderExcluir
  8. Muito legal esse tuto flor <3

    ResponderExcluir
  9. Anônimo26/3/13

    Esse é um ótimo tutorial, uso uma barrinha de créditos no meu layout, nos layouts free não tem, pois na época que fiz os antigos, nem sabia mexer com HTML, mais procurei muito por esse tutorial, até que achei como colocar no blog Chá & Cupcake.

    Kisus...
    Things Crazy

    ResponderExcluir
    Respostas
    1. Verdade nos meus anigos também não tem rsrs
      Msa o Chá & Cupcake é realmente bem legal, obrigada por comentar.

      Excluir
  10. oi adoreii poderia fazer uma imagem logo para meu blog agradeceria muito :)

    ResponderExcluir
  11. Oi Arianne, não sou boa em fazer logos. Mas se eu consegui fazer alguma coisa lhe aviso, ok?

    ResponderExcluir
  12. Amei o tutorial estou usando no meu código base blogger.
    Obrigado

    ResponderExcluir
    Respostas
    1. Certo fique a vontade! É uma boa ideia usar na base. ^^ Foi nada.

      Excluir

Bem Vindos
Hi! Meu nome é Andréa Alark, mas conhecida como Wendy dona do blog Bunny Crazy. O blog foi criado em 2010 na intenção de ajudar a criação e desenvolvimento do seu blog. Aqui encontrará tutoriais e dicas de HTML, layouts gratuitos e muito mais.
Friends
Bunny Crazy by Wendy ❀
Bunny Crazy ★
Bunny Crazy ★
12345