22 de jul de 2012

Personalize o título dos posts

Entrei em contato com o We<3It e a minha conta voltou. Obrigada a todos que tentaram ajudar!
Oi, gente? Tudo bem com vocês? Eu estou bem, graças a Deus, haha. Então, hoje vou ensinar a vocês como personalizar o título dos posts. Fica mais bonito, não fica aquela coisa feia sem efeito nenhum e é muito fácil de fazer. Vamos aprender?


Vá no seu HTML, aperte Ctrl+F ou F3 e procure por h3.post-title { Vai estar mais ou menos assim:


Se não tiver enxergando, clique na imagem e visualize maior. Como podem ver no print que eu tirei, você vai ter que colar o seguinte código ANTES de terminar a chave. E o código é esse:
text-align: left;
background: #F3EEE9;
border-bottom: 1px dashed #C8AF97;
padding-left: 5px;
Vamos entender cada parte do código?
- O text-align resolve o posicionamento do texto. Se quiser do lado esquerdo, deixe como left. No centro, é center. Do lado direito, right.
- No background, você escolhe uma cor ou uma imagem. Para imagem, basta trocar o código por: background: url(URL_DA_IMAGEM_AQUI);
- O border-bottom serve apenas para enfeitar e deixar uma borda embaixo. Tire o -bottom se quiser uma borda em toda a área. Mude o estilo (se quiser) para solid, dotted, double ou deixe dashed. Para finalizar, mude a cor.
- O padding-left serve pra dar um espaço entre a margem do lado esquerdo e o texto. Assim, não fica tão junto. Se o texto estiver right, mude o padding para padding-right. E se estiver center, pode apagar essa parte.

E aí, gostaram? O Garota Queen ainda tem poucos tutoriais, mas assim que eu for descobrindo novas coisas, postarei aqui pra vocês, ok? Obrigada por todo o apoio de vocês e até a próxima postagem <3

60 comentários:

Laurinha :3 disse...

Amei a postagem. Realmente têm blog que não destacam o títulos dos posts... Enfim, amei!

the-rain-will-pass.blogspot.com

Sweet MakeUp disse...

Já aconteceu comigo isso no Weheartit e até hoje eu não consegui postar nada, só adiciono as fotos ao favoritos hahaha. :3
Adorei o tutorial, adoro tudo pra personalizar o blog, s2

Beijos, Paula
sweetmakeups2.blogspot.com

Giovanna disse...

Gostei do tutorial, super útil. Com certeza vou usar :)

Me apaixonei pelo seu blog! Os posts são incríveis e o layout é lindo ^^ Já estou seguindo, se puder dar uma passadinha no meu blog ficarei agradecida <3

Beijos
blogcandysweet.blogspot.com.br

x. Rafaella W. disse...

Adoreeeeei, já salvei nos favoritos, coloquei no novo lay que estou montando ^^

Beijoos =* farryteen.blogspot.com / blogdocemenina.blogspot.com

! Lili ! disse...

Fica bem legal, vou usar no meu proximo lay.
Beijo, Lili --->
http://blogmuitofofodaaline.blogspot.com

Nayra disse...

Que blogmais fofo ^^ amei aqui ! Já estou seguindo .. e muito obrigada pea visita :)
Kisses
http://happymomentsblogger.blogspot.com

FlorLinds disse...

Obrigada pela dica flor,amei!!
Seguindo aqui ok,Beijos...

www.heey-flor.blogspot.com.br

FlorLinds disse...

Ah,lindo layout,você que fez?
Beijos

www.heey-flor.blogspot.com.br

Luly disse...

Ah, nunca apareceu isso do We<3it na minha conta, sinto muito, mas eu não sei como ajudar... Bem, e você, já com quase 100 seguidores e postagens de dar o que falar, não é Anna? Essa forma de personalizar fica bem fofinho, acho que da um detalhe a mais para o blog. Anna, eu adicionei você pelo msn que me deu, porque realmente não veio convite nenhum. E eu queria saber, se, não estiver incomodando, claro, se você já poderia fazer o meu layout, não vejo a hora de ver um deles feito por você no meu blog! Então, temos muito o que conversar! Um beijo!
the-zombie-attack.blogspot.com

Ingrid Sakamoto dos Santos disse...

Tutorial muito útil mocinha!
Hihi :3

www.ingridsakamotodossantos.tk
Ainda ele não voltou, só vim retribuir o comentário :/
Beijinhos!

. Faah Santos disse...

Adorei o tutorial
http://faahsantos.blogspot.com.br/

Mirajane disse...

gostei, e estou usando :3
http://commirajane.blogspot.com.br/

leticia oliveira disse...

Oiii flor tudo bom?
bem acabei de conhecer seu blog e ja estou adorando...
achei seu cantinho bem lindo e aconchegante , adequado para podermos visita e estar sempre atualizada.

seguindo aki :)

convido voce e suas leitoras para conhecerem meuu blog:
vicio-demenina.blogspot.com.br

beijokas

Tay ... disse...

Obrigada pela sua visita lá no blog, gosti do tuto ^-*

Bjs, Tay •*
www.tutoriar.com

Thalita [Quinze Dilemas] disse...

Esse tutorial, e se eu não me engano, faço diferente. Sempre usei lá desde que abri o blog, tanto nos títulos da postagem quanto nos gadgets, e eu adoro, fica bem bonito *-*

Beijos,
http://quinzedilemas.blogspot.com.br/

Biaah* disse...

Ai nossa já deu isso no meu we♥hit, antigo (já até exclui a conta). Mas não lembro como resolvi o problema, vou tentar dar uma pesquisadinha de como resolver, aí se encontrar te aviso. Adorei o tutorial, quer dizer já conhecia, mais você explicou muito bem, vou usar ele no layout que estou produzindo... Blog cada vez mais lindo floree =*

Bezzos ~~ Penelope Charmosa| Twitter

Camila disse...

Olha flor, infelizmente, não posso te ajudar com esse negócio do We<3it.
Adorei o tutorial!
Fica lindo!

Beijos,
Mundorosaachock.blogspot.com

Jackie Zanini disse...

Acho mais fofo personalizado >.<

Rock de verdade e atitude disse...

Legal eu nao sabia fazer isso, eu sou nova nesse negocio d blogs ; )...
Mais prestei confesso mais atenção na tatuagem no pulso ameiii...
linda gosta do renato russo? red hot? slash? calças rasgadas? Enfim d rock?
passa lá no meu blog rockdeverdadeeatitude.blogspot.com/ e comenta se gostar siga..bj

Bruh disse...

Nossa seu blog é fantastico eu to seguindo se quiser segui o Meu?? one-teens.blogspot.com

Lili disse...

Adorei o tuto e aqui!!!

#Xoxo >>day-princess.blogspot.com

Mιℓℓє (Garotas Atrevidas) disse...

Amei o tuto, mega útil.
Kisses :3 '
http://garotasatrevidas-s2.blogspot.com.br/

Ҩ. luana oliveira ! disse...

Amei o tutorial e seu blog ta cada dia mais divo , super parabéns!
Super beijo e não esqueça de me visitar!
www.paradateen1.blogspot.com : )

MahPessoa disse...

se eu tivesse uma conta no WeHeartit até te ajudava,mas eu somente visito o site!
adorei seu tutorial, adoro colocar algum efeito bonito no título dos posts.
http://blogtrashrock.blogspot.com.br/

B. Caspirro disse...

Adorei o seu tutorial, e gostei muito daqui! ainda por ter a diva da Demi uehuehue

Seguindo aqui flor,
será um prazer receber a sua visita lá no meu blog

www.inexplicavelconsumismo.blogspot.com
beijos

Barbara disse...

personalizer o título da postagem é um detalhe que deixa seu blog mais autêntico,apesar de ja conhecer o tuto,adorei! ^^
adorei também conhecer o seu cantinho,mega organizado e as postagens são nota mil! e que lay divonico é esse pelo amor de dels? '00' ~babando aqui~o/ rs
seguindo de volta,claro.
espero te ver sempre lá no portal teen,viu?! :D adorei sua visita *-*

http://blogportalteen.blogspot.com

Rafaela Thomé disse...

Adorei, testei e o efeito é realmente incrivel! Flor adorei seu blog e já estou seguindo.

rosaschiclete.blogspot.com

Beatriz Sousa disse...

Oi vim te convidar para participa do concurso no meu blog

http://www.estilodegarota.com/2012/07/promocao-meu-blog-no-estilo-de-garota.html

Rayanne Eduarda disse...

Amei o tutorial !

LINDA VISITA MEUS BLOG E SE GOSTAR SEGUE E DIVULGA BJS
>>>>http://falagirls-fg.blogspot.com.br/
>>>>http://thingsforgirls-coisas-p-meninas.blogspot.com.br/

SOU NOVA NA BLOGOSFERA ME AJUDAR PF?

x. Rafaella W. disse...

Fica lindo ^^

farryteen.blogspot.com

Bell Lopes disse...

Amei flor segue meu blog se puder?http://meumundopinup.blogspot.com.br/

Bell Lopes disse...

Amei flor segue meu blog se puder?http://meumundopinup.blogspot.com.br/

Stella Valim disse...

Adorei o tutorial, a postagem ficou ótima :D
http://www.senhoritaliberdade.com/

Luly disse...

Anna, deu certo no msn! Eu vi seu aviso lá e já respondi. Um beijo!
the-zombie-attack.blogspot.com

disse...

Amei o tutorial,usarei no próximo layout com certeza!
# ------> A garota de Preto

Mirajane disse...

claro :3 logo depois que coloquei já coloquei -qq
(http://commirajane.blogspot.com.br/p/creditos.html)

leticia oliveira disse...

Olá. passando pra agradecer e retribui a visitinha...
amei o blog e etarei sempre visitando!

convido suas leitoras para me seguirem.
vicio-demenina.blogspot.com.br
beijokas

Ingrid Sakamoto dos Santos disse...

Obrigada por desejar parabéns pro meu blog linda, você é a leitora dos sonhoos! <3

www.ingridsakamotodossantos.tk
Ainda ele não voltou, só vim retribuir o comentário!
Beijo :/

Cherry Ice disse...

Oie amr ameei seu blog ! E claro - rsrsrs- ja estoou seguiindo! Super lindo e fofo ! se puder da uma passadinha la no meu e seguiir tbm agradeço!
Varioos bjinhoos
http://cherryice-2012.blogspot.com.br/

Jhonas Balsas disse...

adorei seu blog.. é lindo ;) Primeira vez de muitas que estarei visitando ;)

www.ejhonas.com {Seguindo seu blog para a próxima meta. Se puder seguir o meu o link tá do lado *-*}

Jhonas Balsas disse...

adorei seu blog.. é lindo ;) Primeira vez de muitas que estarei visitando ;)

www.ejhonas.com {Seguindo seu blog para a próxima meta. Se puder seguir o meu o link tá do lado *-*}

Ray disse...

Amei o tutu,o meu já é personalizado em hover uahsua

http://caprichadasbr.blogspot.com.br/

Nick disse...

Adorei o tutu,vou utilizar!

http://cupcakegoodies.blogspot.com.br/

Elielma Vasconcelos disse...

★ Amei seu espaço e tudo por aqui...inclusive as dicas...tudo de bom..

Seguindo vc..espero uma visita, tá..se gostar me siga tbm...

Um beijo e um sorriso

http://elielmavasconcelospink.blogspot.com.br

Bikoti disse...

amei o tutorial super fácil.
www.Bikoti.blogspot.com.br

Ana Paula disse...

Oi mor sou dona da Vicios makeup , e sou sua afiliada rs , queria saber se você aceita razaer um sorteio comigo em parceria , de um template ? se sim vais er meu primeiro sorteio rsrs , obrigada e como sempre teu blog ta mt divo u_u s2 e fica com Deus (:

http://viciosmakeup.blogspot.com.br/

Camila Sousa disse...

Olá, adorei o seu blog!
É muito lindo.Parabéns pela criatividade!
Acabei de criar um cantinho pra mim também.
Está convidada para fazer uma visitinha e seguir meu blog.
belezaempotencial.blogspot.com

Seguindo já *_*
Beijinhos

Maah disse...

PARABENS SEMPRE ARRAZAR NO POST Linda tudo bem com você? amei seu blog e por isso te convido pra visitar o meu, muito obrigada de verdade!

COMUNICADO IMPORTANTE LA NO BLOG
http://estilloetendencias.blogspot.com.br/2012/07/comunicado-importante.html

Bora passa la anjo, uma otima semana :)
beeijo
@maahmusic

David Germanotta disse...

realmente fica lindo com esse tuto heim
http://garotoonerd.blogspot.com.br

David Germanotta disse...

realmente fica lindo com esse tuto heim
http://garotoonerd.blogspot.com.br

TeenList disse...

Gostei do tutorial :)

www.teenlist.blogspot.com

Somii S. disse...

É Muiiito Fofis *uu*
--->http://smileretro.blogspot.com.br/

Saladadefrutasbr disse...

Fica perfo demais! Eu vou usar2 no layout novo que tô fazendo (: E teu blog é lindo - ok,jádisseisso-



http://saladadefrutasbr.blogspot.com.br

Julyana Morais disse...

Nossa, amei o tutorial, sério. Seguindo aqui, quero mais coisas boas assim <3

Beijos!
Com Qual Estilo

MahPessoa disse...

como já comentei nesse post, passei apenas para agradecer seu comentário e avisar que já tem post novo no TR!
confira lá:
http://blogtrashrock.blogspot.com.br/

Gabriela Oliveira disse...

Adorei o seu tutorial , muito bom mesmo ! Seus tutorias são muito bons , posta mais deles , gosto muito deles *-*

Anna você pode me ajudar com o layout do meu blog ? Queria trocar ele , mas não tenho ideia de como começar . Vou ficar muito feliz se você poder me ajudar . Se você não poder não tem problema .

Beijos *-*

http://modicesdemenina.blogspot.com.br

Milena Araújo disse...

Aii , Que Blog Dislumbrante Dos sonhos mesmo
parabéns , e o conteúdo não é bom é mais que bom é maravilhoso , Parabéns
Seguindo , Visite o Meu cantinho , quem saíba eu não ganho uma seguidora também ! rs'
http://teen-dolls-girls.blogspot.br

Anna Livia disse...

Amei o tutorial, amei o seu blog ele é super lindo. Vou sempre passar aqui tá amr ?! rsrs (: Beijoos, Bye Bye.
http://mundo.surreal.zip.net/

disse...

Nunca assisti não,parece ser bem legal <3
# ~~>A garota de Preto

Odeio eles,mas sem eles não vivo disse...

no meu n ta indo nenhuma das edições T-T