Eu vou mostrar onde você deve mexer, e passar um código básico, mas você pode usar sua criatividade para fazer outras alterações e criar diferentes estilos.
No painel do blogger, clique no nome do seu blog, depois, clique em "Modelo" no menu vertical que aparece no lado esquerdo da tela. Clique no botão "Editar HTML" que fica em baixo da miniatura do seu blog, e clique em prosseguir no aviso que aparecer.
Aperte Ctrl+F e procure por h2 {
Logo abaixo do trecho que você procurou, vai ter algo parecido com isso:
h2 {Apague toda essa parte e no lugar coloque esse código:
font: $(widget.title.font);
color: $(widget.title.text.color);
}
.sidebar h2 {Agora é só modificar as cores e a fonte como quiser. Se em vez de cor, você quiser colocar uma imagem de fundo, substitua essa parte:
font-family: Century Gothic; /*Tipo de fonte*/
font-size: 16px; /*Tamanho da fonte*/
color: #000000; /*Cor da fonte*/
border-bottom: 2px solid #fff; /*Borda de baixo, apague se não quiser*/
background: #fbfbfb; /*Cor de fundo*/
text-align: center; /*Alinhamento do texto*/
}
background: #fbfbfb; /*Cor de fundo*/Por isso:
background: url(link_da_imagem) no-repeat center;Visualize se está tudo certo e salve. A partir desse código você pode aplicar outros efeitos, como sombra, bordas arredondadas e outros estilos de bordas. Espero que tenha sido útil. Se usarem, não esqueçam dos créditos ok ;D Amanhã tem mais tutorial, aguardem!
height: 30px;/*Altura da imagem*/
width: 200px; /*Largura da imagem*/
Adoro tutorias deste tipo, já uso em diversos blogs *-*
ResponderExcluirBeijos amr, http://world-cutest.blogspot.com/
Olá querida, fiz do jeitinho que vc ensina, mas as letras ficam preta e não aparece a imagem de fundo. Será que tenho que mudar alguma coisas na variável h2?
ResponderExcluirDesde já muito obrigada!
Xeruuuuuuuuu
não faço parte desse blog, mais eu acho que em
Excluircolor: #000000 você muda os 0's pela cor que vc quer, já que essa cor acima é preta.
Oii liah será que da pra você postar tutorial de como fazer layout no photofiltre ou photoscape?
ResponderExcluirRsrs "Layout" em programas de edição de imagem ?? kkk
ExcluirMiia Chan dá para fazer sim...
ExcluirMiia ela quis dizer o cabeçalho flor / Eu acho kkkk.. E no photoscape da pra fazer pq os do meu blog eu faço la..
Excluirhttp://crysmaier.blogspot.com.br/
é so vc baixar uma imagem de "capa" com fundo transparente , e baixar letrars diferentes e tbm baixar imagens sem fundo so a imagem e ir fazendo do seu jeitinho bem simples e fácil.
Excluirfassa um video encinando como fazer o seu blog lindo
ResponderExcluirOlha o ultimo post do meu blog ( http://sonhosdeumadocegarota.blogspot.com/ ), tem um selinho pra você lá!
ResponderExcluirOi Liah, adoro o seu blog, gosteei muito desse tutorial e já coloquei no meu blog.
ResponderExcluirrubi-biju.blogspot.com
Ele ta no começinho , mas eu sempre venho lendo as dicas do Cherry Bomb pra deixar ele mais bonito! Gostaria muito que você o visitasse e desse sua opinião!
Beijinho Maria
pf favor fala qual a font do titulo do blog e qual como como vc fez o efeito de rasgado des de agora obrigada
ResponderExcluirEu adoro seu blog.
ResponderExcluirestou seguindo http://subretudoumpouco.blogspot.com/ Se gostar segue?
O nome da fonte do titulo é Comfortaa
ResponderExcluirApoio a idéia dela õ/ :Tarsilinha-barbosa são poucos os blogs que realmente ensinam fazer o Layout, não apenas em mecher em algumas partes sabe fazer o lay... eu sempre quis aprender!!!
ResponderExcluirOtimo Tuto!! Parabéns bem explicado!!!
Beijo
Amei o tutorial, gosto muito de personalizar o título do gadget.
ResponderExcluirPassa lá, Liah, você anda sumida! Bjs.
Tá perfeitissimo liah, seus tutoriais me ajudaram muito, fiquei até perdida na hora de abrir os tutoriais, eu quase abri tudo em um monte de aba kkkkk'
ResponderExcluirGostaria de saber quando você abre afiliação ... podia abrir mais 2 vagas ;p ^^
Cheque meu blog: Garota do olhar Sincero - garotadoolharsincero.blogspot.com
Assinado:
Oi, flor!
ResponderExcluirSegue meu blog, já estou seguindo o seu!
www.coisasdemenina-vicky.blogspot.com
Se voc quiser eu tbm tenho um blog da Selena:
www.clubeselenagomezdiva.blogspot.com
Que legal! Vou usar!
ResponderExcluirhttp://cantoseencantosdahellen.blogspot.com/
Adorei! Muito útil para quem quer ter um blog bonito mas simples, sem um cabeçalho profissional. Vou usar no próximo layout! Beijinhos!
ResponderExcluirblog-bola-de-chiclete.blogspot.com
Adoro maratona de tutoriais a do Cherry Bomb então, nem se fala. Mas enfim, concordo: tem que usar a criatividade para fazer títulos diferentes, a imaginação não tem limite.
ResponderExcluirBeijos,http://paraisodemenina.blogspot.com/
Oiee meu nome é vanessa e amei seu blog estou seguindo tem concurso la no meu blog participe!porfavor!!!
ResponderExcluirlivina-teendream.blogspot.com
Me ajudou muito flor e amei o tutorial, gosto muitoo do seu blog ele é super fofo.
ResponderExcluirhttp://blog-fun-world.blogspot.com
Não achei o código
ResponderExcluirh2 {
font: $(widget.title.font);
color: $(widget.title.text.color);
}
Existe algum outr modo alternativo?
Liah, você me salvou...Vou afzer um design aí e precisa desse tuto :)
ResponderExcluirbrigadaaaa.
www.magic--teens.blogspot.com
Tentei fazer, mas não consigoo. Help me!
ResponderExcluirLindaa, amo o seu blog, tipo ele é muito perfeito! Eu queria saber como mudar o titúlo das postagens, fica uma fonte tão feiinha u-u http://sejavocemesmaa.blogspot.com.br/ Meu blog de textos u-u
ResponderExcluiroi flor passa no meu blog...adoro seus tutoriais!!
ResponderExcluirfiz o layout seguindo seus tutorias e goodies *--*
ótimo dia bjs!
http://sundaemorango.blogspot.com.br/
nao conseguir.. se colocar a cor fica normal, mais se coloco imagem nao aparece nada
ResponderExcluirMuito Bom seu post, deu supper certo, obrigada
ResponderExcluiramei as dicas,seguindo aki,me segue de volta bjs
ResponderExcluirLegal,adorei!
ResponderExcluirSó que a letra fica acima do fundo como faço pra tirar esse bug?
Oi Liah, tentei colocar a imagem no fundo mas não deu certo. VocÊ tem ideia do que pode ser? A imagem não aparece :(
ResponderExcluirotimo´
ResponderExcluirEu consegui, liah você e demais cara *--*' aceita afilhação :3 ' coontato: http://www.facebook.com/giullya.rosa ' obg!
ResponderExcluirnhaac>>> ' www.bomb-girls.blogspot.com.br ! não acabei de contruir ainda né , mais se gosta do meu cantinho segue! obg,amo-amo-amo- o se blogzão!
como eu faço para mudar a fonte titulo do Gadgets om esse efeito?
ResponderExcluirEmilia
Coffemilia.blogspot.com.br
Nossa amiga, tva há séculos tentndo isso e o seu tutorial foi que iluminou! Segui o passo a passo e deu tudo certinho, inclusive usei uma imagem bem fofa
ResponderExcluirThanks!
Beeijo
e agora? como colocar a foto que eu quero ?
ResponderExcluirNão deu certo não :/
ResponderExcluirVisitem meu blog complexafelicidade.blogspot.com
Ola
ResponderExcluirMto obrigada, deu certo no meu blog, gostei mto.
www.sjimenescriandoepersonalizando.com
Ai meus Deus sou nova no mundo dos blogs e estou levando maior surra, esse foi o unico tutotrial que encontrei que de fato me explicou alguma coisa de modo claro e simple. Tentei fazer mas as letras ficaram pretas nao consegui mudar a cor e nem colocar imagens que será que aconteceu? bjss
ResponderExcluire agora estou tentando desfazer para ficar como era antes e nao consigo tambem. ME AJUDAAAA POR FAVOR!
ResponderExcluirahaha meu marido conseguiu pra mim, muito obrigada agora a proxima fase a pernder a colocar a imagem , muito obrigada!
ResponderExcluirO meu não deu certo!!! :(
ResponderExcluirAmeiiiiiiiiiiiiii Seu Blogg Foi O Melhor q eu ja vi sem brincadeira alguma *-* *---* *_* *u*
ResponderExcluirLiah... o meu não está dando certo, não sei o que acontece!!!
ResponderExcluirEstou fazendo uma reforma e a personalização do título antiga era azul, agora eu mudo a cor e continua!!! O que eu faço???
Ahhh... já tentei colar novamente mais não dá certo!!! :(
ameii
ResponderExcluirentra em www.postsdemagarotaa.blogspot.com.br
ResponderExcluirseguee lahh??
pf!! ameii o tuttoriall
usando, kissus AMO O SEU BLOG !!!!!!! http://menina-inteligentee.blogspot.com/
ResponderExcluirGostaria de saber como fazer um quadrinho desse que tem no seu blo dando as boas vindas aos leitores.
ResponderExcluirzenildo4@yahoo.com.br
oie me ajuda aqui to desesperada! não consegui fazer, quero me ajude de uma forma um pouquinho mais facil, e eu também tenho outras duvidas, deixa a resposta la no meu blog por favor ou me da o seu e-mail. http://acerejarosa.blogspot.com.br/
ResponderExcluirAjudou super! Muito obrigada!
ResponderExcluirOi Liah a um Tempo uso ele no meu blog ,Mas decidi Dar uma mudada agora não consigo tiralo,Ja tentei apagar o codigo Mas não pega ,Não quer sair de jeito nenhum se você puder me ajudar ! :D Agradeço.
ResponderExcluirAjudou muito, sempre vejo seus tutorias !
ResponderExcluirVisitem : digitandomoda.blogspot.com.br
Usei e deu super certo....Valeu!!!
ResponderExcluirwww.portodeestilo.blogspot.com
Seu blog é lindo,parabéns!
ResponderExcluirOtimo tutorial.
ResponderExcluirEsse é um dos
melhores blogs
que conheço.
Não consigo fazer nada :'(
ResponderExcluirFlorzinha obrigada por ajudar.
ResponderExcluirDeus abençoe!!!
Tenha dias felizes...
Bjokas...da Bia!!!
Muito obrigadaaaaaa! Ficou super cute! *-*
ResponderExcluirNo meu as letras ficou fora do quadro
ResponderExcluirAjudou muito! Obrigada! Beijinhos *-*
ResponderExcluirFazia tempo que tentava arrumar meu blog, e nunca batia com os tutorias... Dai mudei o layout pra viagem, e deu certo hehe
ResponderExcluirTava ficando sem paciência já :X
Esse tutorial ajudou muito,quer dizer, seu blog me ajuda MUITO !
Obrigada, a parabéns ^^
beijo.
http://humorlimao.blogspot.com.br/
essa merda bugo meus 2 blogs.
ResponderExcluirEntro nesse blog por esse: http://oclubedacamila.blogspot.com.br/p/creditos_30.html
ResponderExcluirE procuro o que não encontro em outros por ai que é um bom tutorial mas não consigo encontrar h2 { pois o modelo do meu blog é 2013 e preciso desse tutorial atualizado para 2013 pois ta ruim pra fazer qualquer coisa aqui no HTML!!!
Me ajuda por favor!!!
Preciso desse tutorial atualizado
Se vc atualizar pode entrar em meu blog e comentar lá o link do tutorial atualizado?
Obrigado
Acho que o meu é o único que não funcionou!
ResponderExcluirOlá querida, muito obrigada! Seu tutorial foi muito rapido e de fácil compreensão! Amei! ;)
ResponderExcluirJosy Queiroz
http://www.tricoecroche.com/
Tutorial muito legal mano, mas tava querendo saber se colocando uma imagem .gif ela continua animada.
ResponderExcluirhttp://bemdahorinha.blogspot.com/
Muito Bom Seus Tutoriais. Obrigado Ajudou Muito.
ResponderExcluirPois Comecei Criar Um Template.
http://teste-otakuandotome.blogspot.com.br/
Porque quando eu aperto o ctrl+f e coloco o que ela pediu não apareçe nada no meu ?
ResponderExcluirNão faço parte do blog, mas antes de procurara vc tem que clicar no quadro de html...
ExcluirOii... Muito legal mesmo, eu amei,, obrigada liah!!!
ResponderExcluirhttp://isadiniz-blog.blogspot.com/ (***site em construção***)
Ola eu gostaria de alinhar o texto mais para baixo tem como??ai ta o link para voce ver http://aeonskin.blogspot.com.br/
ResponderExcluirNao preciso mais ja consegui so adicionei a propriedade padding
ResponderExcluire eu alinhei :D
minha flor vc não sabe como vc esta me ajudando muito bem explicado amei bjs brigada por isto bjs.de ludemila
ResponderExcluirEu não estou conseguindo. Eu cilco no "f3" e copio e colo o que você esta falando, mas eu não acho NADA :(
ResponderExcluirObrigada me ajudou mt. http://blogdicasdelivros.blogspot.com.br/ visitem pfvr
ResponderExcluirAi ficou tão lindinho valeu mesmo os seus tutoriais são sempre super úteis!
ResponderExcluirSó não dou o link do meu blog pois está em reforma!
Muito Obrigado, precisa muito fazer isso
ResponderExcluir:D
Não consegui mudar colocando imagem, mas mudei pra uma fote que eu gosto muito a do meu Bloco de notas que eu personalizei, e mudei a cor Obg :)
ResponderExcluirÓtimo ! Só queria saber como trocar a cor da coluna inteira. O meu modelo é Janela de Imagem...
ResponderExcluirMuito bom mesmo!!
ResponderExcluirhttp://littlegirlstyle.blogspot.com.br/
Amei amei amei rsrsr melhor blog do MUNDOOOO
ResponderExcluirOi Liah, no meu blog de teste deu certo, no entanto no blog, que eu quero usar, eu coloco o código e coloco pra visualizar e nada, sera o que? O que esta acontecendo? Fiz e tudo certinho e nada se puder me falar agradeço bjs
ResponderExcluirhttp://www.jeitosimplesdeser.com.br/
Eu amo esse blog ♥ Muito legal, adorei beijos!
ResponderExcluirhttp://jenniferfivestars.blogspot.com.br/
Super util, obrigada. :3
ResponderExcluirhttps://imperio--kawaii.blogspot.com
mt legal, mais achei dfc.
ResponderExcluirsweet-candy-ofc.blogspot.com
Obrigado pelo tutorial funcionou super bem no meu blog!
ResponderExcluirwww.mateusff.blogspot.com
Obrigada! Adorei o tutorial, deu certinho no meu blog.
ResponderExcluirhttp://natalibispo.blogspot.com.br/
♥
Até deixei o seu blog na barra de favoritos, me ajudou muito e esté muito bem explicado, excelente! obrigada!
ResponderExcluirhttp://my-hair-is-drunk.blogspot.pt/
Sou blogueira desde 2009... agora com este tutorial está dando certinho.
ResponderExcluirObrigada Cherry.
vALEU, ficou em http://cantinhodenoticias.blogspot.com/
ResponderExcluirEu aperto ctrl+f mas qnd digito h2 não aparece o codigo...oq faço?
ResponderExcluirPor favor, me responde!!!
ResponderExcluirEu to usando o google fonts. O que devo copiar e colar no html para
funcionar a fonte?