Personalizando a Área dos posts

Images_large


Aqui você vai encontrar fáceis Tutoriais Para o seu blog. Antes de fazer os tutoriais dessa postagem é necessário fazer o Backup do seu template, para não dar nada errado, ou até mesmo num blog de teste antes de usar no seu original para não estragar o seu blog. Bem você vai aprender a personalizar a área dos posts e também umas dicas básicas extras pra você. Então chega de bate-Papo e vamos começar os tutoriais...

Clique em Leia mais e vamos em bora!!
Personalizando o Título do Post

Se você quiser colocar um efeito no título da sua postagem personalizada igual a minha, veja esse tutorial com atenção.

Vá em: Modelos e Editar HTML
e pesquise pelo seguinte código:

h3.post-title {

quando achar, vai estar mais ou menos assim:

h3.post-title {
  margin-top: 20px;
}

Logo acima da última chave, coloque o seguinte código:

border-bottom: 1px dashed #000000;

agora vamos para a legenda:

Roxo: é a borda, (não mude, só mude apenas, o bottom po top se quiser a linha em cima, se quiser a linha em volta do título do post todo apague o " -bottom ").
vermelho: é o tamanho da borda ( se quiser mais grossa coloque " 2px ").
preto: é o tipo da borda ( se quiser uma borda lisa, coloque " solid ")
laranja: é a cor da borda ( se quiser rosa coloque " #ff50ff; ")

só isso, agora veja se esta tudo OK em seu blog e salve. Mai não acabou ainda tem muito mais...

Centralizando o título do Post

Vá em: Modelos e Editar HTML
e pesquise pelo seguinte código:

h3.post-title {

Logo abaixo dele, coloque o seguinte código:

text-align: center; 

prontinho, veja se ta tudo ok, e salve... ainda tem mais..


Colocando Barra de rolagem nos posts

vá em: modelo e em seguida editar HTML.
depois pesquise por:

body {

e antes de body { cole o seguinte código:

#Blog1{overflow-y:auto; overflow-x: hidden; height:500px; width: 100%;margin: 0px;}

Pronto! veja se esta tudo legal, e salve. tem mais ai..


Colocando Sombra no título do posts

vá em: Modelo e depois em Editar HTML.
em seguida procure pelo seguinte código:

h3.post-title a { 

antes de fechar a última tag " { ", cole esse código:

text-shadow: 0px 0px 5px #000000;

se vocês quiserem mudar alguma coisa,como a largura da sombra,ou a cor da sombra, fiquem a vontade.

Quando tiver tudo pronto visualize, e depois salve.
E é só isso pessoal. mais tem um dica para deixar seu texto sublinhado, persona lizado.
Fica super legal. Veja o tuto abaixo:

Vá em: Modelo >> editar HTML e procure pelo seguinte código: ]><
acima dele cole o seguinte código:

u {
color: #200000;
text-decoration: none;
border-bottom: 1px dashed #000000;
}

o que esta de vermelho é o tamanho da linha sublinhada (que vai ficar pontilhada). e o que está de preto-negrito é a cor da linha.Vê se esta tudo em ordem, e salve.

Bom gente é só isso.
comentem bastante!!
e digam o que achou do nosso post!!

30 comentários

  1. mais uma boa dica pro pessoal

    ResponderExcluir
  2. oi deby, amei esse seu novo post!
    ficou muito bom mesmo...
    muitas pessoas vão ver e clicar no +1 do google como eu fiz... beijinhos, muitos sucessos pra você e até mais....

    http://receitadakaka.blogspot.com.br

    ResponderExcluir
  3. Oii,
    Que legal a dica, eu adorei, principalmente pq eu so tão ruinzinha quando se trata de códigos e configuração do blog.
    Muito útil.

    Adorei seu blog, estou seguindo!!
    Passa lá
    Seguindo!

    http://my-literarylife.blogspot.com.br/2012/05/como-eu-quase-namorei-robert-pattison.html#comment-form


    Um Bjo e muito suceso com seu blog.

    ResponderExcluir
  4. bem bolado esse tutorial (s)
    boa sorte!! que vnhaa muito mais sucessos para você e seu blog..

    até mais...

    ResponderExcluir
  5. Bem legal pro pessoal que não manja desses codigos eu sou um kkk

    ResponderExcluir
  6. adorei as dicas!! bjs
    http://avidademalu.blogspot.com/ http://ohmygood-omg.blogspot.com.br/

    ResponderExcluir
  7. leagal as dicas

    http://kelecatura.blogspot.com.br/

    ResponderExcluir
  8. Ótima dica... ainda terei um layout que me agrade totalmente... :)

    ResponderExcluir
  9. Excelentes suas dicas para melhorar o blog .... realmente essa parte é bem complicada e você explicou muito bem.

    Sucesso !!!

    ResponderExcluir
  10. Que legal1 tÁ MUITO MANEIRO seu blog e esses tutos sao simples e maneiros

    http://novidadesdatekinha.blogspot.com

    ResponderExcluir
  11. rsrs mexer no blog vira vicio, incrementa-lo então, adoro essas dicas!

    ResponderExcluir
  12. Estou te seguindo flor =]

    Já ouviste falar de meia calça tatuada? Vale a pena ler entao http://toobege.blogspot.com.br/2012/05/meia-calca-tatuada-elitize.html

    ResponderExcluir
  13. sempre me mato qnd faço isso kkk
    por isso deixo modelo normal msm

    ResponderExcluir
  14. seu blog e bem agradável, e bem colorido =) e sempre cheio de novidades, continue assim parabens =)

    ResponderExcluir
  15. muito boa adica ...

    ResponderExcluir
  16. Gostei da dica, adoro blogs que ensinam a usar o blogspot, sucesso neste seu blog e espero que chegue longe...

    http://temtudomega.blogspot.com
    siga o blog e curta no facebook

    ResponderExcluir
  17. Muito boas as dicas...Visita lá o blog,bjs
    http://so-pra-teens.blogspot.com/

    ResponderExcluir
  18. Adorei a dica, mas tenho uma pra você, crie um blog só pra testes, assim quando você postar esse tuto as pessoas vai diretamente e vê como fica. Fica mais prático e melhor, rs.

    Beijinhos, http://mundodemenin.blogspot.com.br

    ResponderExcluir
  19. Tutoriais ótimos! Amei seu blog,é lindo, seguindo.Beijos!
    http://universoteengirl-porlarissa.blogspot.com.br

    ResponderExcluir
  20. hehe gostei do tutorial !
    Bem útil!
    Flor seguindo aaq, segue lá também ?Amei o blog, bem legal ele!
    Bjão ♥

    http://garotaimperfeita.tk

    ResponderExcluir
  21. Visitinha rapida,Ammei o blog,beijooos!
    http://vitoriaacedo.blogspot.com.br/

    ResponderExcluir
  22. Legal! Poderiamos pedir um tutorial? Como você fez esse cabeçalho animado?
    Visite nosso web show: www.exclusivoshow.blogspot.com

    ResponderExcluir
  23. Adorei o post.
    Flor, está rolando sorteio lá no Blog, se quiser participar, sinta-se convidada bjssss
    http://glamouremestilobyrosaolin.blogspot.com.br/2012/05/sorteio-da-linha-nutra-da-plantony.html

    ResponderExcluir
  24. Olá querida!

    Me desculpe passar na corrida, mas vim avisar que o Zapataria migrou para o femininaevaidosa.blogspot.com.br. Espero que possa me seguir e acompanhar o blog por lá!
    Um beijo e obrigada pela sua companhia neste um ano.
    Beijos!
    Silvia

    ResponderExcluir
  25. Amei esse tutorial :) Parabéns pelo blog, já sou seguidora! :)

    Beijo*

    http://mantinhaderetalhos.blogspot.pt/

    ResponderExcluir
  26. Eita completinho amei!



    BEIJUXX
    http://ianapaulinhaaaa.blogspot.com.br/

    ResponderExcluir
  27. Que legal,mas já tenho minha área personalizada... :]

    http://trethy.blogspot.com.br

    ResponderExcluir










2011/2017 - Delicada e Abusada | Personalizado por Débora Alvim | Não copie! Encomende o seu na HTML LOVE DESIGN