Se usarem um dos Tutoriais abaixo, por favor, deem os devidos créditos ao Blog certo? Então... Vamos começar?Ola gente, tudo bom? A pedidos da Luana (www) hoje eu trago um Tutorial ~~um não, vários~~ para que vocês possam personalizar o Título dos Gadgets ok? Alguns tutoriais foram criados por mim, outros eu encontrei na Net, todos estão com os créditos!
Fundo colorido igual o do POM
Sabe esse fundo verde que está por trás de cada título dos Gadegets aqui no POM? Ensinarei agora como deixá-lo desse jeitinho, o Tutorial é bem fácil!
Na página de Editar HTML do seu Modelo, clique em Ctrl + F e procure por: .footer-inner .widget h2
Quando achar o código acima, cole em baixo esse código com suas devidas personalizações:.footer-inner .widget h2, .sidebar .widget h2 { text-align: center; background: #3CB371 /** Cor do fundo **/; color: #fff /** Cor do título **/; font-size:22px /** Tamanho da fonte **/; margin-top:-15px;margin-left:-15px; margin-bottom:10px; padding:2px /* regule de acordo com a largura da sua Sidebar */; width:111% /* regule também aqui de acordo com a largura da sua sidebar*/; overflow:hidden }
Linha pontilhada abaixo do Título
Para deixar uma linha pontilhada embaixo do título, vá em Desgin, Editar HTML, Ctrl+F e procure por: h2 {
Você irá encontrar algo parecido com isso:
h2 {
font: $(widget.title.font);
color: $(widget.title.text.color);
}
Antes de fechar a chave } cole o código abaixo:
border-bottom:1px dashed;
Imagem base de fundo (www)
Para deixar uma imagem base de fundo para todas as vezes que você criar um Gadget Vá em Design, Editar HTML, dê Ctrl+F e procure por: .sidebar .widget h2 {
Assim que encontrar, cole abaixo esse código fazendo as devidas alterações:
background: url(URL DA SUA IMAGEM);
Imagem diferente para cada título de Gadget (www)
Agora, se você quer colocar uma imagem diferente para cada título vá em Design, Editar HTML, Clique em Expandir Modelos de Widgets e procure pelo nome de cada Gadget (por exemplo: "O Blogueiro". Você encontrará algo parecido com isso:
<b:section-contents id='sidebar-left-1'>Substitua o que está em Amarelo pelo código abaixo:
<b:widget id='HTML5' locked='false' title='O Blogueiro'' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<img src="URL-DA-SUA-IMAGEM"/>E por último, é claro, substitua o que está de verde pela URL da sua imagem .
Espero que tenham gostado dos Tutoriais! Se usarem algum, creditem ok? Beijinhos e Até...
Fica super legal, com o fundo colorido! Adorei ^^
ResponderExcluirBeijos :*
http://sweet-flower-laura.blogspot.com.br/
Visite !!
post completo e cheio de opções amei! e tudo bem explicado! :)
ResponderExcluirhttp://kelly-club.blogspot.com.br
ahh, adorei! quando eu usava um diferente em cada, eu criava cada um, aí colocava em imagem e ai eu colocava em cima do gadget. Acho que não deu pra entender o que eu disse HAHAHAHAH mas tudo bem, acho.
ResponderExcluirblog-anothergirl.blogspot.com
São muito legais esses tutos, mas eu personalizo eles de outro jeito, sabe? Com outro tuto.
ResponderExcluirBeijos, Gabby. 4Brownies ♥
Amei o tutorial Alex, é tudo muito útil, muito bem explicado! Adorei aqui,seu blog é ótimo,você escreve muito bem.Estou seguindo aqui pela conta do google,se puder poderia seguir o meu? Mas é só se puder e gostar tá linda? E se puder participa do concurso que está rolando lá?
ResponderExcluirConcurso
Blog
Ain,, Ameei alex!
ResponderExcluirQueria saber se você ainda tem aquele lay free, que era o antigo lay do Amora Azeda!! bjs
hm!!!!! kk, quero veer!
ResponderExcluirhauhsuhahs, por inquanto vou ficar com aquele C>3 bjss!
the-scene-one.tk
Ameii os tuto's *----*
ResponderExcluirObrigada pela visita no CCC,
volte sempree :)
http://fanideisi.blogspot.com.br
ahan! vou fazer, beijos e valeu pela dica!! estou muito feliz, consegui o Amora Azeda de volta! Atravez de um tutorial no Youtube!! ainda consegui com uma parte das postagens!! bjs
ResponderExcluirthe-scene-one.tk
Os tutoriais são ótimos! Todos bem explicadinhos e super úteis. Gadgets personalizados são lindos :)
ResponderExcluirBeijos
blogmodaonline.blogspot.com
*----* Tava procurando esse tutorial há séculos!!! *------* achei kkk
ResponderExcluirwww.porenseetcs.blogspot.com
Muito bom..
ResponderExcluirhttp://imaginesooficial.blogspot.com.br/
Fica bem legal mesmo,adorei!
ResponderExcluircaprichadasbr.blogspot.com.br
Desculpe por não ter mudado o link, já mudei!
ResponderExcluirBeijos;*
http://girlonlline.blogspot.com.br
Até favoritei sabe pra não perde, primeiro blog que eu acho esse tutorial eu ficava que nem louca procurando <3
ResponderExcluirbeijão
http://garotamuitotimida.blogspot.com.br
Adorei os tutorias :D
ResponderExcluirbjs
Se o tempo acha que eu deve voltar, é isso que vou fazer e ponto final.
ResponderExcluirhttp://www.extras-for-you.blogspot.com.br/
Muito obrigada pelo tuto! Já coloquei no meu novo template!
ResponderExcluirvidademenina.tk
muito bom! adorei, tem alguns tipos diferentespara títulos de gadget, mas esse também é muito bom *-*
ResponderExcluirhttp://thislovinggirl.blogspot.com/
Já começaram as votações para o concurso!
ResponderExcluirhttp://docinho-pink.blogspot.com.br/
Ameii as dicas...
ResponderExcluirlifeonalin.blogspot.com.br
Oi... eu soube agora o que aconteceu com o CCT, sinto muito ,mais olha não se deixa abater por essas pessoas invejosas que não sabem ver outros blogs fazendo sucesso. Quero dizer que pode contar comigo e com o meu blog. Tudo de bom pra você.Bjos
ResponderExcluirhttp://renata-diariodeumaadolecente.blogspot.com.br/
Pode não parecer mas esse é um dos melhores tutoriais porque dá uma personalizada no blog, afinal cada detalhe conta :)
ResponderExcluirdocequintafeira.blogspot.com
Parceiro estou adorando seus tutoriais *-* Parabéns por voltar com o blog e com a força toda.
ResponderExcluirBeijos,
Monique <3
http://www.secretsofalittlegirl.com/
Alez meu fofo *o*, meu querido!!
ResponderExcluirhaush' queria perguntar a você se você cobra para fazer um lay para o Amora Azeda!! Queria um novo *o* Beem cheguei!!!! bjs
amoraazeda.blogspot.com
achei eles lindos sempre é bom mudar e inovar
ResponderExcluire a sombra nas paginas ? muitos blogs tão usando isso u-u
ResponderExcluirAlex, me ajudou muito com esses tutoriais! Já estou usando uma imagem base de fundo como voce ensinou. Obrigada ^^
ResponderExcluirBeijos
Candy Blast