Hello Guria and Guris
Hoje eu vou ensinar a vocês como personalizar o titulo dos gadgets tipo do JD.
1° Vá no seu HTML e procure por: h2 {
Se você nunca editou esta parte do template vai estar mais ou menos assim:
2° Substitua o trecho destacado por:
.sidebar h2 {
font-family: 'Sofia', cursive; /*Tipo de fonte*/
font-size: 26px; /*Tamanho da fonte*/
color: #FFAEB9; /*Cor da fonte*/
background: url(http://i.imgur.com/Rjdny.png) no-repeat center;
height: 36px;/*Altura da imagem*/
width: 287px; /*Largura da imagem*/
text-align: center; /*Alinhamento do texto*/
}
3° Instalando a fonte:
- Acima de </head> cole o seguinte código:
<link href='http://fonts.googleapis.com/css?family=Sofia' rel='stylesheet' type='text/css'/>
4° Últimos ajustes:
- No trecho: http://i.imgur.com/Rjdny.png vocês podem trocar por uma imagem personalizada ok? Não esquecendo de ajustar as medidas da sua imagem.
- Mais caso ao invés de uma imagem vocês queiram apenas uma cor é só substituir essa parte:
background: url(http://i.imgur.com/Rjdny.png) no-repeat center;
Por esta:
background: #000000; /*Cor de fundo*/
Visualize se estiver tudo OK, salve! Dúvidas comente <3
Muito fácil!! Esse tipo de detalhe faz toda a diferença em um lay. Bonito e caprichoso!!!
ResponderExcluirBeijos!!
http://infinitaeu.blogspot.com.br/
Ai fica muito lindo Jakie
ResponderExcluirAcabo de entrar na blogsfera e estou sgeuindo suas dicas que estão me ajudandom muiito
Se inscreve?
http://onthemagiic.blogspot.com.br/
Aiii que maravilha!vai me ajudar muiito no proximo lay!
ResponderExcluirbeijosss
www.dreamoflife-blog.blogspot.com
Adorei ^^
ResponderExcluirJá procurei tanto esse tutorial u-u haha
ResponderExcluirhttp://garotasdelicadasbr.blogspot.com.br/
Ótimo Tutorial Jackie fica bem fofo...
ResponderExcluircaandydream.tk
Amei o tutorial, eu estava procurando por ele!!! Jackie você poderia me ajudar na meta do meu blog, seguindo-o! obg!!
ResponderExcluirBeijão Jackie!!!
http://mundo-doce-delicioso.blogspot.com.br/
Muito divo essa tutorial ' vou usar no meu próximo lay :) Amo aki <3
ResponderExcluirsonhos-sinceros.blogspot.com :h:
Eu uso um primeiro tutorial que vc ensinou, acho mais fácil!
ResponderExcluirPelo menos não to afim de mecher no HTML
:H
Eu achei que o seu blog é muito maneiro! Você posta coisas iradas! Adoro seu blog!
ResponderExcluirBeijos!
Misterio!
:l:
ei Jackie sempre ajudando suas Gurias :D
ResponderExcluirsem fala que acho lindo seus gadgets, principalmente pelo fato de você personaliza-los com a sua cara né! Beijinhoos *
:l:
Amei a dica... Vou tentar fazer aqui.
ResponderExcluirBeijos
www.mundodajulia13.blogspot.com
Que fofa a foto da postagem :h: !
ResponderExcluirBeijos,
Camila Angelina
http://cantinhodacaps.blogspot.com.br/ (agora com TEMPLATE ANIMADO)
Achei linda essa font Jackie :D
ResponderExcluirhttp://anikspink.blogspot.com.br/
Adorei o tuto =) E descobri a fonteee que eu ameeei KK- É sofia,cursive, não posso esquecer KKKK-
ResponderExcluirBeijones amor, s2rita.blogspot.com
fica muito fofo esse teu estilo Jackie!
ResponderExcluirbjãooo
Que lindo que fica Jackie *0*
ResponderExcluirbeijos, Dani
blogDesenrola.tk
Amiga eu não entendi muito a 3° parte pode me explicar onde fica esse head?:l:
ResponderExcluirTutorial Mega-útil !!! Amei
ResponderExcluir:h: oi!!
ResponderExcluirAdoro os seus tutos!
super vou tentar!
apesar que minha cabeça já ta doendo de tanto tentar arrumar meu blog :i:
kisses!
Bom domingo!
Com certeza vou usar, Jackie! Coloquei na lista de tutoriais pro próximo lay (que vou ter que começar do 0 porque não tenho conseguido mudar os gadgets de lugar x.x)
ResponderExcluirBeijos ♥
Conspirantes
D+! :h: Sabe, eu sigo seu blog, e queria que você pudesse seguir o meu:
ResponderExcluirhttp://biancagatinhaoficial.blogspot.com.br/
OBR!
Super bem explicado! Fantástico! ^^
ResponderExcluirAdoro meus gadgets quando estão super cutesss ^^
Beijos!
delicadissima.com
Muito bem explicado esse tuto Jakie, adorei!
ResponderExcluirBjus flor
Ótimo tutorial! Amei, Jackie, vou fazer no meu! Vou dar os créditos, claro. :h:
ResponderExcluirummilkshake.blogspot.com
Fica super fofo né?!Eu já utilizei por um bom tempo,mais hoje opto pelo simples fato de um titulo sem decoração,só a fonte personalizada,simples ;P
ResponderExcluirhttp://nickworldglitter.blogspot.com.br/
Jaack ameiii o post!!!
ResponderExcluirBjinhos
http://sweetworldbr.blogspot.com.br
Como eu estava procurando um tuto assim \o/
ResponderExcluirhttp://japanesegirll.blogspot.com.br/
que post útil, maagina se não ia seer a Jackiee néh!! ASHUASHUASHUA'
ResponderExcluir>chiclete-decanela.blogspot.com
Ótimo tutorail Jackie, como sempre você arrasando e ajudando os outros. :)
ResponderExcluirBeijos guria ♥
ONDE É O HTML DO BLOG??
ResponderExcluireee^^ tava querendo um tuto assim
ResponderExcluirvou deixa a pag em favoritos pro meu proximo lay *-*
-xoxo
s2juuh.blogspot.com
Jackie, eu tava doida atas desse tutorial estavam meio mal explicados, mas esse está ótimo! adorei!
ResponderExcluirhttp://isa-pequena.blogspot.com.br/
Amei, brigado jack, esta precisando muito!!
ResponderExcluirJackie,que fácil!! Achei que era super difícil,mas quando li seu tuto percebi que estava enganada. Seu blog tá lindo *-* Como você colocou o "You might also like" com borda pontilhada nas imagens? Um beijo!
ResponderExcluirwww.blog-sweetluv.blogspot.com
@Anônimo Tão difícil receber elogios em anônimo O.o
ResponderExcluirFiquei feliz, valeuuu <3
menina otima postagem!
ResponderExcluiradoro visita blog assim como o seu que não tem bestei de dividi o que sabe com as outra blogueira que esta começando
**** um toque de magia***
Era o que eu queria *-* rs.'
ResponderExcluirJackie, ensina a personalizar as postagens relacionadas, igual a sua ?
Beijos ;*
farryteen.blogspot.com
Fica super fofo! Amei demais aqui <3
ResponderExcluirhttp://wronggirl-ann.blogspot.com.br
@Famosos e Cia...Se vc usa a interface antiga do blogger ... é só ir em design> Editar HTML (pronto achou o HTML do blog)
ResponderExcluirDê um ctrl + f para facilitar a busca (:
Beeijus e espero te ajudado!
Que bom que gostou das fontes, e baixou todas KAPOSDKPSO
ResponderExcluirBeijões <3 InDelicada
achei q era dificil!! adorei!
ResponderExcluirbjs
http://avidademalu.blogspot.com/ http://ohmygood-omg.blogspot.com.br/
Jackie valeu por visitar o meu blog, queria q vc seguisse, tem como?
ResponderExcluirColoquei o seu blog em afiliados'
www.beleza-e-make.blogspot.com
Geente por favor seguem o meu blog que eu retribuo..
ResponderExcluirBjs com gloss
http://beleza-e-make.blogspot.com.br
adorei as dicas brigadoo...
ResponderExcluirAdoreeeeeeeeei a dica.
ResponderExcluirJackie quero te avisar que este blog copiou esta postagem e não colocou creditos!!
ResponderExcluirhttp://paradise-bieber.blogspot.com.br/2012/06/personalizando-o-titulo-dos-gadgets.html
O meu é:;
http://topgirl01.blogspot.com.br/
@Gabi Ansbach Brigada por avisar guria <3
ResponderExcluirNossa vim aqui agradecer pelo conteudo do seu blog, me ajudou bastante a personalizar o meu.
ResponderExcluirObrigada Jack, darei seus devidos créditos!
Tutu fácil e bem explicado, adorei!
ResponderExcluirhttp://adolescenteambulante.blogspot.com
Eu Não Achei o h2 { :i:
ResponderExcluirAin Jackie,vc não sabe o quanto este tutorial me ajudou.Fazia tempos que eu procurava por isso.
ResponderExcluirMuito obrigada ;3
bonequiinha-de-luxo.blogspot.com
Muito fácil Jackie, amei muito! Ficou lindo lá no blog, dá uma olhadinha:
ResponderExcluirhttp://meninaa-ma.blogspot.com/
Bgd', sempre ajudando muito né?!
Carlla Amaral :B
aiin', ameeeeeeeei esse tuto *-* , vou usar no Próximo Layout >< . Seguiiindo o Blog s2
ResponderExcluirhttp://worldofimaginatioon.blogspot.com.br/
Jaaack D= me ajuda, o meu nunca dá, faço do jeito que você diz, e nunca muda nada sempre fica na mesma Ç.Ç
ResponderExcluirJackie... que xuxu que ficou!!! amei... mudei a cor do meu... obrigada to aprendendo mto com o seu blog!!! :h:
ResponderExcluirvaleu msm, pelo tuto, consegui colocar no meu blog, parabens pelo lindo blog. :]:
ResponderExcluirfotosemomentoss.blogspot.com.br/
Amei o tuto, flor não consegui pegar nenhuma fonte, seilá que deu. Vou usar essa sua mesmo, tudo bem?
ResponderExcluirAmei o blog, beijos.
@Ayla -v-Ok linda (:
ResponderExcluirAmei o tutorial. Vou usar desse jeito, porque não sei mexer muito com blog e da outra vez não deu muito certo:D
ResponderExcluirUm beijo, Malú
o tutorial é super simples, e dá ao blog um ar super fofo! lindo demais jackie <3
ResponderExcluirgostei muito desse totorial me ajudou muito obrigado.
ResponderExcluir:K: AMEEEEI, Já botei o tutorial no meu blog !
ResponderExcluirhttp://dama--de--ferro.blogspot.com.br/ ;c
Valeu Ajudou muito flor
ResponderExcluirno meu nn foi... o problema nn foi no tutorial, foi eu mesma, eu nunca vou conseguir fazer um design legal...
ResponderExcluirBrigadassssooooo ..... deu super certo amei por de mais !!!!
ResponderExcluirnão to seguindo o blog mas já dei 1 like na fan page.
Beijoos
By: Sarah Vivic
Blog; atual-sempre.blogspot.com.br
Não consigo mudar a fonte. Desisti já...
ResponderExcluirAdorei! Faz um tempão que tento personalizar, mas não conseguia. Seus tutorias são ótimos, bem simples de fazer.
ResponderExcluirParabéns pelo blog!
Nuss adorei jack! seu blog como sempre todo teen! beijocas!
ResponderExcluirmeussonhos-s2.blogspot.com
Gente segui o meu blog.. prometo que retribuo! é só deixar o link nos coments do blog!
ResponderExcluirhttp//:meussonhos-s2.blogspot.com.br
amei o tutorial linda
ResponderExcluirme ajudou muito
Parabéns!
ResponderExcluiroii,eu nao entendo como vcs fasem isso!!!seu blog é lindo eu queria por exemplo colocar como o seu o titulo das postagens ou as apresentçoes.nao sei,tem como tu me ajudar pff
ResponderExcluirbrigada *w*
Excluirsó n entendi bem a demanda?! O.o
AAAAH' sério mesmo, seu blog é perfeito e é um dos mais mais que me ajuda a mexer em HTML! Muito obrigada mesmo Jackie!
ResponderExcluirBeijos!
http://www.teimosasim.blogspot.com.br/
Por nada guria :3
ExcluirEu faria o tuto se eu não tivesse template personalizado...
ResponderExcluirJackie não achei, o código o que eu faço?
ResponderExcluirAmei, pequenos detalhes fazem diferençao, obg *-*
ResponderExcluirhttp://purplestreakss.blogspot.com.br/
jackie presciso muito da sua ajuda ! no meu html nunca tem nada para personaliza nunca acho por favor me ajuddaa
ResponderExcluirAmei! Principalmente, porque você soube explicar :)
ResponderExcluirjackie ao consigo entender nada so´consigui colocar o template o resto nada
ResponderExcluirAdorei, visitem meu blog http://blogmeninaousada.blogspot.com.br/
ResponderExcluirEstou amando os seus tutorias ♥ Estou aprendendo a fazer o layout do meu jeito e estou amando isso muito obrigada
ResponderExcluirBeijos ;*
Acho que não deu certo, mas valeu a pena testar, acabei de entrar na blogosfera e to tentando aprender com os outros, mas, você é ótima com tutoriais. Obrigada :D
ResponderExcluirhttps://imperiokawaiis.blogspot.com | Espero sua visita ;3
Quando eu vou salvar dá erro :c
ResponderExcluiradoro esse tutorial porque eu posso personalizar do meu jeito =)
ResponderExcluiroi pode dá uma olhada no meu blog?
ExcluirSe gostar,não esqueça de seguir.
http://supercriativablog.blogspot.com.br/
Muito obrigada!Amei esse tutorial!
ResponderExcluirAmei ajudou muito só que o fundo aonde está a finha fita não está transparente que código eu uso?
ResponderExcluirEsse é o link do meu blog : http://glamourealternativo.blogspot.com.br/
pode mandar um print?
ExcluirAAAh, eu amei, fiz no meu e ficou super lindo*---*
ResponderExcluirhttp://mundo-daisa.blogspot.com.br/
noossa sua dica me ajudou muito,obg mesmo,apesar de eu ter conseguido fazer apenas com sua explicação perfeita!parabéns pelo seu blog lindo
ResponderExcluirConsegui, só que a faixinha não aparece
ResponderExcluirNão esta dando certo eu coloco o primeiro código e sai o tundo da barra lateral e da postagem.
ResponderExcluirVocê já tem essa parte do seu lay personalizada?
ExcluirPq se estiver colocando vários códigos no mesmo lugar isso geralmente acontece...
me ajudaa
ResponderExcluiroi amei o post mas não consigo fazer nada os codicos dão tudo errado pode criar um blog de testes e fazer tudo isso em vídeo para mim por favor?
ResponderExcluirAle, não sei a parte que esta errando, se me disser posso tentar ajudar ;D
ExcluirÓtimo tutorial! Dá para você fazer um tutorial de como colocar efeitos em hover no título da sidebar? Ajudaria muito!
ResponderExcluirBeijos ^^
Em breve eu posto ;D
ExcluirFicou muito lindo e fofo, obrigado pela partilha :)
ResponderExcluirhttp://walkingaroundbymm.blogspot.pt/
Oi Jackie eu fiz do jeitinho que você ensinou mas não aparece no meu,ele aparece só no incio depois a imagem some e fica a letra normal, o que eu faço?
ResponderExcluirmanda print?
Excluirdependendo do que for eu consigo ajudar (: