- Back to Home »
- goodies , tutoriais »
- Personalizar LinkWithin (cores)
Para quem não personalizar o texto e a posição do LinkWithin, ou seja, como trocar o texto daquele título maior de cima e como colocar o gadget abaixo do rodapé de postagem (pois antes o meu ficava em cima do "Leia Mais" e eu achava super esquisito).
Mas agora vamos aprender de uma forma bem simples como mudar as cores e as fontes desse gadget. Se você souber mexer em HTML pode até mudar outros aspectos, se quiser.
- Entre em Design > Editar HTML ou Modelo > HTML > Prosseguir;
- Aperte Ctrl + F ou Editar > Localizar, no seu navegador;
- Copie o seguinte código: ]]></b:skin> e cole-o na caixinha que abriu;
- Antes do trecho destacado, cole o código seguinte:
.
.linkwithin_text {
margin: 0px !important; border: 0px none !important; padding: 10px 5px 8px !important; text-align: left !important; font-weight: bold !important; } .linkwithin_inner { margin: 0px !important; border: 0px none !important; padding: 0px !important; width: 477px !important; /*Tamanho do seu LinkWithin*/ background: none repeat scroll 0% 0% mistyrose !important; /*Fundo do gadget*/ border-radius: 0.5em 0.5em 0.5em 0.5em !important; -moz-border-radius: 0.5em 0.5em 0.5em 0.5em !important; -webkit-border-radius: 0.5em 0.5em 0.5em 0.5em !important;
box-shadow: 0pt 0px 1px rgb(102, 102, 102) !important;
color: palevioletred !important; /*Cor da fonte do título maior*/font-size: 18px !important; /*Tamanho da fonte do título maior*/ font-family: Coming Soon !important; /*Fonte do título maior*/ } .linkwithin_img_0 { width: 100px !important; /*Largura das imagens dos posts*/ height: 100px !important; /*Altura das imagens dos posts*/ margin: 0px !important; border: 0px none !important; padding: 0px !important; box-shadow: 0pt 0px 1px rgb(102, 102, 102) !important; } .linkwithin_title.linkwithin_title_0 { margin: 0px 0px 0px !important; border: 0px none !important; padding: 0px !important; color: palevioletred !important; /*Cor da fonte dos títulos dos posts*/ font: 10px arial black !important; /*Tamanho e fonte dos títulos dos posts*/ text-align: center !important; }
.linkwithin_posts a {
border-right: 1px dotted palevioletred !important; /*Borda entre os posts*/
padding-right: 0px !important;
background-image: none;
}
.linkwithin_posts a:hover{
background-color: white !important; /*Cor do fundo dos posts quando passamos o mouse*/
}
.linkwithin_title:hover {
color: black !important; /*Cor dos títulos dos posts quando passamos o mouse*/
text-decoration: none !important;
}
|
Os códigos em negrito são os que você pode personalizar de acordo com seu gosto (as explicações estão ao lado de cada um), só mexa nos outros códigos se você tiver certeza do que está fazendo. Os códigos em verde deixam as bordas redondas e os em azul colocam sombra nos lugares especificados. Se não quiser algum, é só apagar.
Visualize para ver se funcionou e depois clique em "Salvar Modelo".
Espero que vocês tenham gostado!!! Qualquer dúvida, deixe um comentário!!!
{ 5 comentários cutes ... read them below or Comment }
Carinhas......
♥❤∞ ☆ ★ ✖ 。◕‿◕。® ™ ☏✿゚✤
❝❞✥ ✦ ✧ ✩ ✫ ✬ ✭ ✮ ✯ ✰ ✱ ✲ ✳ ❃ ❂ ❁ ❀ ✿✼ ✻ ✺ ✹ ✸ ✷ ₪ ❃ ❂ ❁ ❀ ✿ ✾ ✽ ✼ ✻ ✺ ✹ ✸ ✷
✶ ✵ ✴ ❄ ❅ ❆ ❇ ❈ ❉ ❊ ❋ ❖(◕‿◕✿) 。◕‿◕。 ⊱✿◕‿◕✿⊰(◡‿◡✿)(◕〝◕)◑▂◐ ◑0◐ ◑︿◐ ◑ω◐ ◑﹏◐ ◑△◐ ◑▽◐
●▂● ●0● ●︿● ●ω● ●﹏● ●△● ●▽●
⊙▂⊙ ⊙0⊙ ⊙︿⊙ ⊙ω⊙ ⊙﹏⊙ ⊙△⊙
≡(▔﹏▔)≡
。◕ ‿ ◕。 ಠ_ಠ ( °٢° ) ʘ‿ʘ ಥ⌣ಥ ಥ‿ಥ (ΘεΘ;) (n˘v˘•)¬ (✪㉨✪) ヽ(๏∀๏ )ノ (╹ェ╹) ╮(─▽─)) ≖‿≖ (ノ◕ヮ◕)ノ*:・゚✧ (⊙ヮ⊙) ᕦ(ò_óˇ)ᕤ ᕙ(⇀‸↼‶)ᕗ ( ಠ◡ಠ ) (•⊙ω⊙•) ‘︿’ ( ´∀`)☆ (≧ω≦) (´ー`) (つд`) ( ̄。 ̄) (*~▽~) ( ^▽^)σ)~O~) (=゜ω゜) (´ω`) (ノ_・。) (-_- )ノ (´ヘ`;) (^^;) ( ´∀`) ((((゜д゜;)))) (=ω=;) (。・_・。) (o´ω`o) (^▽^) (*´д`*) ( ̄□ ̄) ∩(︶▽︶)∩ (✿◠‿◠) (◡‿◡✿) (◕‿◕✿) (✖╭╮✖) (≧◡≦) (¬_¬) (◑‿◐) (◕‿-) ✖‿✖ (-’_’-) (╥_╥) (╯_╰) (╯3╰) (o_-) (¬‿¬) (◣_◢) (∪ ◡ ∪) (≧ω≦) o(≧o≦)o (⋋▂⋌) (॓_॔) (╯ಊ╰) (─‿‿─) ‹(•¿•)› (╯︵╰,) (︶︹︺) (∩︵∩) (。◕‿◕。) (⊙_◎) (~ ̄▽ ̄)~ (︶ω︶) (+_+) (。♥‿♥。) (✿ ♥‿♥) ♥╣[-_-]╠♥ ٩(͡๏̯͡๏)۶ ٩(-̮̮̃•̃)۶ ٩(̾●̮̮̃̾•̃̾)۶ ٩(-̮̮̃-̃)۶ (u_u) (*_*) (º_º) ٩(×̯×)۶ (ñ_ñ) (∩▂∩) (¬▂¬) (╯◕_◕)╯ (╹◡╹)凸 少 ¯\_(ツ)_/¯ (▰˘◡˘▰) (☞゚∀゚)☞ ლ(╹◡╹ლ) ヾ(^∇^)( ✿ ◠‿◠)
Adorei o tutorial,
ResponderExcluire eu amei essa patinha de gatinho aí ^^
bjs!
relicariodasrafleur.blogspot.com.br
obg amiga,linda a patinha neh
Excluirbjao
Oi amiga,desculpa a demora depois que deixei a menssagem avisando que vinha no blog o meu Mouse deu pane.. aiiiii que raiva amiga kkkkkk.. acabei comprei outro hihi ^^ rss.. Descupinha
ResponderExcluirBom peo que eu entendi vc deseja deixar o fundo colorido, eu uso as vezes em tabelas.. da uma olhadinha nesse tuto
http://dany-place.blogspot.com.br/2012/07/tt.html
coloca os codigos dentro que funcionam ,porem é preciso colocar alguns sinais em codigos ascii para funcionar.
espero ter ajudado.. beijinhos
estou seguindo e levei para meu blog espero a visita e me siga obrigada
ResponderExcluirOlá gatiinha !
ResponderExcluirTudo bem ?! Olha amei seu blog, ele é muito fofo *♥*
Já até tô até inscrita no seu Blog !!!!
Que tal retribuir, se inscrevendo no meu !?
http://contatudosobrekarinasilva.blogspot.com.br/