Turistando em Florianópolis (SC)

Lembrai-me de que foi recíproco

Teu Adeus

Marejando

23
abril
2015

Personalizando o Post Footer

 
Hey, Pessoal!
 
Hoje vamos personalizar o post footer, que nada mais é que o rodapé do post na parte inicial do blog. O tutorial está bem simples e eu trouxe dois modelos diferentes para vocês terem a opção de escolher. Então, vamos lá.
 
Vá em Modelo> Editar HTML> CTRL+F> Pesquise por: .post-footer {
 
Vocês encontrarão um código parecido com esse:
 
.post-footer {
 
  margin: .5em 0;
 
  line-height: 1.6;
}
 
Logo abaixo cole:
 
MODELO 1 (Para visualizar clique aqui)
.post-footer-line-1, .post-footer-line-2 {
border-bottom: 1px solid#8B4C39; /* cor, espessura e tipo da borda */
background: transparent; /* fundo do rodapé */
color:#FF69B4; /* cor do texto */
font-family: MamaeQueNosFaz; /* fonte do texto */
font-size:  28px; /* 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: normal; /* transformação do texto */
word-spacing: .2em; /* espaço entre palavras */
text-align: center; /* alinhamento do texto */ }
 
 
MODELO 2 (Para visualizar clique aqui)
 * Cole o código antes da chave “}”  *
 
background: #FFF0F5;/* Cor de fundo */
border: 2px solid #FFE4E1;/* Cor e tamanho da borda */
font-family: ‘Muli’, sans-serif; /* Fonte */
font-size: 13px; /* Tamanho da fonte */
padding:5px 8px;
text-transform:none;
 
Se vocês quiserem mudar o estilo da linha, colocar pontilhada por exemplo mude onde está Solid por Dotted, e se quiser tracejada coloque Dashed, e linha reta deixe o Solid. De resto, seguindo as instruções de cada linha do código, vocês podem ir mudando de acordo com seu gosto e com o visual do blog. Espero que tenham gostado, caso haja alguma dúvida comentem e se desejarem podem pedir algum tutorial em especifico.
 
Créditos: (http://nataliamedice.blogspot.com.br &
http://euamohtml.blogspot.com.br/)

Você também pode gostar de ler:

Comente sobre isso:

Deixe seu comentário

13 Comentários

  • Filipe Laia
    01 maio, 2015

    HTML é bem difícil, mas essas dicas são ótimas para quem não entende muito.
    Parabéns!
    http://www.booksever.com.br

  • Karine Lima
    26 abril, 2015

    Adorei a dica! Beijos 😉

    http://blogdakakalima.blogspot.com.br/

  • Suellen Esposte
    25 abril, 2015

    Oi Karolline, é uma dica bem legal, fica lindo =)
    Um beijo

    Suellen Esposte Blog | Facebook | Youtube | Instagram

  • Mariane
    25 abril, 2015

    Ótimas dicas, adorei <3
    Um beijo

    Dicas para todas

  • Dieiny Josiane
    25 abril, 2015

    Ótimas dicas. Gostei…
    Estou seguindo seu blog. Pode retribuir?
    Passa lá. … Beijinhos
    http://dieinydicas.blogspot.com.br

  • Deyze Kelly
    24 abril, 2015

    Ahh, o mundo do html me fascina!

    Eu Rabisco

  • © 2019 Palavras Ambulantes • Desenvolvido com por