15 de fev de 2013

Tutorial - 3 tipos de Footer da Postagem

By: Have Things
Hi Guys ! O/
Nossa agora com o cabeçalho de modo normal to feliz.
Bom tem já um tempinho que tinha que postar este tuto mas, então como lembrei tudo direitim decidi fazer ele agora.É um que a Oak Chan já tinha me pedido que é o um Tuto que ensina a colocar um footer igual ao  do PE, mas então vou aproveitar e postar 3 tipos de footer.

O primeiro que irei ensinar é o que a @OakChan pediu, que é o igual aqui do PE, ele eu aprendi no CD
1° Tipo
Tecle Ctrl+F ou F3 e procure por : 
.post-footer {
Você irá achar isto:
.post-footer {
  margin: .5em 0;
  line-height: 1.6;
Substitua o código acima por este:

.post-footer-line-1, .post-footer-line-2 {
border-bottom: 1px solid #EEEEEE; /* cor, espessura e tipo da borda */
background: transparent; /* fundo do rodapé */
color: #666666; /* cor do texto */
font-family: Arial; /* fonte do texto */
font-size: 11px; /* tamanho da fonte */
margin: 2px 0; /* margem entre uma linha e outra, não altere */
padding: 1px 1px; /* espaço entre texto e margens, não altere */
text-transform: uppercase; /* transformação do texto */
word-spacing: .2em; /* espaço entre palavras */
text-align: center; /* alinhamento do texto */
 }

Salve e pronto ^^

Agora o 2° e o 3° Footer aprendi no IIRTW então créditos pra Sagwa
2° Tipo
Procure por ]]></b:skin>  e acima dele cole:
.post-footer-line-1{
border-bottom: 1px solid #b1afa9;
font-size:10px;
}
.post-footer-line-2{
border-bottom: 1px solid #b1afa9;
font-size:10px;
}



 E por fim o 3° tipo:
No seu Html procure por .post-footer { abaixo dele cole
background-color: #f8f7f7;
padding: 13px;
margin-bottom: 18px;
margin-left: -35px;
margin-right: -35px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
box-shadow: 2px 0px 5px #ece3b1;


ainda no html procure por ]]></b:skin> e cole acima dele :
.post-footer-line-1{
font-size:12px;
color: #070707;
}
.post-footer-line-2{
font-size:12px;
color: #070707;
}
Prontinho, espero que tenham gostado.
To afim de fazer uns goodies mas preciso saber o que vocês querem.
Já postei muito o que EU queria, mas e vocês?
podem falar :

Kissu 

18 comentários:

  1. Adorei os modelinhos!!
    pqngarota.tk

    ResponderExcluir
  2. AAAAAAAAAAAAAAH! Mds ameeei o 1 favoritei esse post pra usar no meu próximo lay eu sempre procurava mas nunca achava finalmente alguém ouviu minha mente! HSUAHSUA' Amei o post Amora

    Time-html.blogspot.com

    ResponderExcluir
    Respostas
    1. nnnhaaacc que bom que gostou *W*
      sahushuahs

      Excluir
  3. Que Lindinhos, eu uso a ultima no meu blog ;P
    Muito Legal!
    Bjoos
    sweet-divertido.blogspot.com

    ResponderExcluir
    Respostas
    1. *w* elaa é realmente delicada ><
      Thanks

      chu~♥

      Excluir
  4. Nossa, Nick, te amo, sério! Procurei taaaaaaaaanto o terceiro modelo, acho ele tão lindinho, obrigada mesmo! Vou usar e seu post ta mais que favoritado! E de nada flor, estarei à disposição sempre que eu puder ^^

    Desculpa não ter passado aqui antes, tô com problema no mouse e no teclado, to no note da mamis -.- Mas seu cabeçalho tá bem mais bonito que o antigo <3

    Beijos
    Too Kawaii

    ResponderExcluir
    Respostas
    1. Owwwnnn Thanks >.<'ele é realmente fofo....
      *--*
      Sem problemas, eu também estava meio que com dificuldades em visitar outros Blogs, por causa daquele problema com o cabeçalho...
      Chu~♥ arigato

      Excluir
  5. adorei os modelos flor, sao muito lindos mesmo e o tuto parece bem facil..
    Ahhh e o seu cabeçalho aqui do blog ficou perfect *-*
    Beijoo e parabens viu? :D
    http://iam-a-broken-rose.blogspot.pt/

    ResponderExcluir
    Respostas
    1. Que bom que gostou...Realmente é facil...

      Thanks, fico feliz que muitos gostaram *--*
      *oooooooo*

      Excluir
    2. Obvio que muitos iriam gostar, são mesmo muito bonitos :)
      Beijoo flor*

      Excluir
  6. Awn adorei muuito fofos *--* todos..

    ResponderExcluir
  7. Anwww, que perfeeitos *OO* ~ Amei o primeiro e o segundo ^^
    Kissus ♥ ~
    mikicandy.blogspot.com

    ResponderExcluir
    Respostas
    1. *---* Arigato Miki *---*

      Chu ~♥

      Excluir
    2. Adorei obg amr :3
      http://hearttutoriais.blogspot.com

      Excluir
  8. Este comentário foi removido pelo autor.

    ResponderExcluir

-Yoo!!

Sem comentários Ofensivos.
Pedidos na ask
Elogios são sempre bem vindos
-Responderei a todo mundo...

(◕‿◕✿)  。◕‿◕。 ⊱✿◕‿◕✿⊰ (◡‿◡✿) (◕〝◕)


◑▂◐ ◑0◐ ◑︿◐ ◑ω◐ ◑﹏◐ ◑△◐ ◑▽◐