Personalizar a área dos comentários - Entenda!

|
 Hoje vou ensinar pra vocês duas coisas: tirar aquele fundo cinza dos seus comentários e trocar o 'postar um comentário' por uma imagem. Mas como eu sei que muuuitos de vocês já sabem como fazer isso, vou postar também algumas imagens para vocês substituírem. Vamos lá?

Retire aquele fundo cinza da área dos seus comentários 
Quando você está personalizando seu layout pela primeira vez (sem usar nenhuma base né), você se depara com aquele fundo cinza matando com seus comentários haha. Vou ensinar como você vai fazer pra mudar a cor desse fundo.
1- Vá até Design, Editar HTML, aperte CTRL+F (ou F3) e procure por: #comments
Você irá achar algo parecido com isso:

#comments {
 background: #cccccc; none repeat scroll top center;
padding: 20px;
}

Para mudar a cor do fundo: É só você trocar o  #cccccc pelo código da cor que você quer.
Troque o ''postar um comentário'' por uma imagem
Vocês já devem ter percebido que pra comentar lá no Attitude Included, tem uma imagem escrito '' Comente '':
Vamos ensinar hoje como fazer para colocar essa imagem e disponibilizar algumas dessas imagens para vocês.
1- Vá até Configurações > Comentários > Posição do formulário de comentários e marque a opção: Postagem abaixo incorporada.
2- Vá até Design, Editar HTML, Expandir modelos de Widgets, aperte CTRL+F (ou F3) e procure por:
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
Troque a parte destacada em lilás por:


<img src="URL DA IMAGEM"/>

E na parte destacada em lilás, coloque a url da sua imagem. Prontinho!
Algumas imagens para vocês substituírem, por favor NÃO retirem os nossos créditos ok?




OBSERVAÇÃO: As duas ultimas imagens tem fundo branco, mas as outras têm o fundo transparente.
Espero que vocês tenham gostado do tutoriais e das imagens! 

56 comentários:

Gi disse...

Ameei o blog estou seguindo! segue o meu ?

http://teensfashionblog.blogspot.com

Nova postagem no blog, escolha uma famosa que vc não gosta muito para ser a eliminada da semana. Bjs!

Larissa Borges disse...

amei seu blog *o* se puder retribuir a visita ficarei grata , a e estamos procurando afiliados, quem quiser, é so falar por comentário ou cbox ! :)

http://aoalcancedamoda.blogspot.com/

Honey Bee // Perfect Candy disse...

Tem tag para vc, lá no Sorriso de Garota!

http://www.sorrisodegarota.com/

Marcinha @GuysMcFLY disse...

ain bom demais, só que eu já aprendi esse, agora acho q vou usar uma das imagens, mas sabe, será que seria possível fazer um post ensinando como arredondas as bordas da área dos comentários? Eu não consegui entender um q vi uma vez no menina nerd e o do mundo blogger é muito estranho, eu não entendo nenhum tutorial de lá rsrs.
Beijos
TDiaryofteens.net.tc

Ingrid Ramires disse...

Amei a dica ^^
http://blogdaingridzinha.blogspot.com/

Juuh s2 disse...

amei as imagens que vc fez *-*
bjs
http://s2juuh.blogspot.com/

@DG_blog disse...

Adoreii, as imagens são tudo de bom *-* Bjinhus

http://dreamsofagirl-blog.blogspot.com

Meia noite e quinze disse...

Olá Anna, amei os tutoriais e as imagens, super lindas e elaboradas, amei!
Você poderia deixar uma leitora feliz? Haha.
Gostaria de saber qual é o nome da fonte que você usou na última imagem... muito obrigada e aguardo a sua resposta.

Tem post novo!
Beijos ;3
meianoiteequinze.blogspot.com

Luciana Gomes disse...

Obrigada, lindona!
Q 2012 seja pra vc um ano de muitas conquistas!
Bjinhos.

www.voudeblog.com

luan disse...

Amei tudinho aqui seguindo,pode retribuir?
www.fofocasda-web.blogspot.com
Ah está rolando um concurso lá no blog vai ficar de fora?

Camila. disse...

Ameeeeeei a dica!!! muito bom mesmo e super personalizado!

beijos e feliz 2012

http://vernasunhas.blogspot.com
@vernasunhas

Bia^^ disse...

Oi da uma passadinha no meu blog e commenta o post novo?Creio q vc vai gostar,hahahihihoho
bejão,adoro aki,sucesso!
http://blog-da-byaa.blogspot.com

Danielle Ribeiro disse...

Ótimo tutorial! Uso em meu blog! Adorei as imagens que você fez, todas delicadas e bem feitas =) Ah, obrigada por me colocar nos afiliados!

Beijos, onthefame.blogspot.com

Yaman disse...

aii como sempre você arrazando nesses tutos né.
Adooooooooro! s2
Beijos
Chiquissimas.blogspot.com

Pâm disse...

Ei flor, vim aki agradecer a visitinha lá no blog e gostaria de convidar a seguí-lo e assim que seguir me avise pra eu vir aki correndo e seguir tbm, ok!? ^^

Bjinhos linda ;*

Pâm
http://chiqueatodaprova.blogspot.com

Furada Teen disse...

aaaaawn que lindo os desenhos *-* qualquer dia eu crio coragem pra mexer no meu html e colocar eles lá rs sempre que vou mexer no meu html eu sempre estrago alguma coisa,incrivel isso haha

xoxo;* @ItsLooh

www.furadateen2.blogspot.com

Marta França disse...

muito bom esse tutu!!
passa lá no meu blog?

demiselenablog-oficial.blogspot.com

Sabrina disse...

Flor, vou mudar o url lá do blog, dia 30 de dezembro vou aparecer aqui e avisar qual vai ser o link mesmo!

Beijos,
@sabrina_amo
http://linkmyfashion.blogspot.com

Meia Noite BR // Official disse...

Adorei! E já estou usando!:D

Flor,aceita afiliação?*-*

http://meianoite-br.blogspot.com

Thais Rodrigues disse...

Nossa amei o tutorial eu uso sempre ele , tem post novo no meu blog , se não for te incomodar vote em um blog da sua escolha , um voto faz mta diferença e o seu ajudaria muito .
http://perfeitinha-blog.blogspot.com/

Brenda Santos disse...

Olá! Esses tutorias são ótimos! Já está participando do sorteio do blog? Se não vai lá e participa ok!
Feliz 2o12!

Beijos
@tudodmenina
http://tudodmenina.blogspot.com/p/sorteios.html

Shizu disse...

aaaaah tava louca pra saber como fazia isso *O*

http://himi-tsu.blogspot.com

Emily Caroline disse...

Que fofo. ♥-♥
Adorei as imagens!

Zilda Mara Peixoto disse...

Olá.Essa é minha primeira visita ao blog.Vi seu link em outro blog e resolvi vir conhecê-lo.Adorei seu blog e já estou lhe seguindo.Seu blog é muito bem organizado e suas postagens muito bem elaboradas.Te convido a conhecer meu blog e segui-lo também.Aguardo sua visitinha!
Bjs!
Zilda Mara
@ZildaPeixoto
http://www.cacholaliteraria.blogspot.com

Luana de Caux disse...

Já conhecia esse tutorial, muito lindas as plaquinhas,
Beijinhos, obrigada pela visita!!!

Crazy Teens disse...

adoreeeeeeei o tutorial, me ajudou muuuito *-*
amei aqui, seguindo ;)

2bgs ;*
- crazyteens-blog.blogspot.com

Minha vida irritante disse...

usei esse tutorial ^^

Julia Rocha disse...

http://yesteens2.blogspot.com/

Linda visita?

ADOREI O TUTO + n deu certo
(eu so burrinha ne?)

Amanda Alvarenga disse...

muito boas as dicas!!Gosteei!!=)
Qdo puder e quiser passa lá no meu blog tbm e diz o q achou,se gostar me segue,ta bom?!

http://poquimdemim.blogspot.com/

Forever Meliebers disse...

Oi :) eu não retirei os créditos da sua imagem,mas como o fundo de postagem do meu blog é preto não apareceu o link do seu blog.

Debee disse...

Usei *-*

May L. disse...

oi

Moniely disse...

Eu não consegui! Fiz parte a parte! ME AJUDA! não consegui fazer nada que você disse!

Lola disse...

Amor, oi, tentei, porém não consegui ue a imagem aparecesse, pq? :S

Mariana disse...

Nao consegui ):
To seguindo, segue de volta?
www.bonequinharosachoque.blogspot.com

Laay Fernanda disse...

eu queeria saber como tira o numero de comentarios que aparece encima de comente . Agradeço se fizer um tuto

Adriele disse...

oi seu blog é lindo segue o meu ou vamos fazer parceria estou precisando please !!!

poke-nerd.blogspot.com.br

Adriele disse...

usei alguns dos seus tutos obg bjs

-Manuella Pinheiro disse...

Que fofis amei o post !

http://cafe-vermelho.blogspot.com

Nathalia disse...

Bem diferente, coloquei lá, se quiser visite:
meu-finalfeliz.blogspot.com.br

Bomb Girls disse...

Eu usei *---*

Jhonas Balsas disse...

Parabéns pela postagem..
www.ejhonas.com

Vicky disse...

amei. usei! specialthingsforyou.blogspot.com

Carol disse...

Oi ameii a dica e o resultado! http://mundinhodasmenina.blogspot.com.br/
Useii o tutorial e as imagens

Manu Buemo disse...

Oi amore...Amei o seu blog e segui não teria como deixar de seguir seu blog é perfeitamente perfeito..
Segue o meu?
www.cupcake-coloridos2.blogspot.com
Bjkas e espero que goste do meu blog.
PS: Divulgue o meu blog q eu jé estou falando para todo mundo do seu..bjkas

Nosso mundo muito louco disse...

OOOOOOOOOOOOOOOOO meu não vai ..

Ursinha Sophia disse...

Não paareceeu esse negocio qe voc falou nn flor ,#comments {
background: #cccccc; none repeat scroll top center;
padding: 20px;
} pelo menos eu nun conseguir :// buubú

Ursinha Sophia disse...

Poxa , qe meeerd a, só comigo qe nun aparece ? ' ://

Carol disse...

Oie, só queria avisar que eu encontreii esssa mesma postagem no blog:
http://senhorita-perfeitiinha.blogspot.com.br/2012/07/personalizar-area-dos-comentarios.html
Não encontreii os créditos do seu blog na postagem, então estou te avisando.
Bjão
(http://mundinhodasmenina.blogspot.com.br/)

Carol disse...

Usei *---*

Carolina disse...

Não consegui colocar no meu, a imagem não aparece :(

*3* Emilly disse...

#Usei! Super útil!

Nessa Rocha Make Up disse...

ooi, Gostaria de te convidar a dar uma passadinha no meu blog, e se puder se inscreva e me ajude a divulgar .. pqe nós blogueiras sabemos o quanto é difícil no começo né !Desejo muito sucesso pra você, beeijos http://neessarochamakeup.blogspot.com.br/

Candy Charm disse...

Olá!
Usei muito facil, :)

candycharm2012.blogspot.com.br

Roseangela Lima disse...

amei. fiz.bjoooo
http://www.criativaearteira.blogspot.com.br/

Roseangela Lima disse...

obg deu certo amei.