Nível = Fácil
Gosto muito de personalizar o blog, deixá-lo com a minha 'cara' é algo que busco sempre.
Quando você digita o texto nas postagens pode dar ênfase em algum texto usando a opção Bloquote, e é exatamente esta opção que vamos personalizar hoje.
Para colocar estilos nas citações entre no código HTML do seu blog e procure pela linha:
]]></b:skin>
Veja que usei a opção bloquote ou 'citação' para dar ênfase à linha acima.
Vamos então ao código CSS que você vai inserir antes da linha citada:
.post blockquote {A borda pode ser trocada também por outro estilo como: dashed, dotted ou outra de sua preferência.
background: #efefef; /*cor de fundo altere se preferir*/
border-left: 3px solid #ff4aa5; /*cor da borda altere se preferir*/
padding: 5px;
}
Se preferir colocar uma imagem de fundo ao invés de cor troque a linha background: por
background:url(LINK DA IMAGEM DE FUNDO AQUI) ;
Fácil né? Espero que tenham curtido o tuto que é bem simples mas que dá um efeito bem legal nos posts!
#bitocas
Ei Vanda ,
ResponderExcluirMinha amiga , amei seu tutorial, mas acredite, não entendo o que faço que até hoje não consegui editar um legam em meu blog, sempre sai aqueles pontilhados, acho o seu super delicado, mas não consigo.:)...
Beijos
Você não está usando um template já personalizado? Porque talvez ele já tenha um bloquote personalizado. Vou dar uma olhada.
ExcluirOi amiga, encontrei pelo seu código fonte.
ExcluirApague esse código do seu blog:
.post blockquote {
background:#939DE2 ;
border:2px dashed #F7F7FA ;
padding: 2px;
margin:10px 20px 10px 20px;
}
E insira aquele do tutorial que vai dar certinho ;)
Obaaa, deu certo....
Excluirrsrsrs, agora só modificar as cores....rsrs,
consegui, obrigada...não sei fazer nada disto , fico de olho em seus tutoriais...
Beijos
ebaaaa \º/
ExcluirOlá Vanda!
ResponderExcluirQue dica incrível amiga!
Há algum tempo vinha procurando destacar as citações, sem sucesso!
Vou correndo agora para aplicar no meu blog!
Tomara que dê certo, pois os códigos do meu blog são tão estranhos que muitas vezes não aceitam algo mais moderno... ele deve ser muito velho...rsrs
Beijos minha linda!!
Feliz semana!!!
O minha flor, que bom que gostou... Qualquer dúvida me fala. beijokas
ExcluirPara quem tem blogger, seus tutoriais são uma beleza! É legal quando o blogueiro se encarrega não só das postagens mas também de enfeitar o próprio blog. Bjs e obrigada por sua visita e presença lá no blog!
ResponderExcluirAhhhh eu sou aquela leitora que sempre lê as dicas mas poucas vezes experimenta!
ResponderExcluirImagine se aperto, sem querer, o botao vermelho e vai tudo pelo ar?! rsss
Beijos
Vc consegue fadinha!
ExcluirQue blz, hein... e a Cecília conseguiu!!!
ResponderExcluirTm vou tentar, clarooooooooooo!
bjão, Vanda.
Oi Vanda,
ResponderExcluirSuper interessante o post,estava procurando fazer isso a um bom tempo,mas tenho uma duvida,vê se pode me ajudar.
Uso o Windows live writer para escrever os posts e como posso destacar no final dos posts com esse editor?!
Uma boa semana,=)
Só testei pelo editor normal do blogger, vou dar uma olhada.
ExcluirOi Vanda. Tenho uma dúvida. Consegui colocar o código para mudar a cor selecionada com o mouse, se eu colocar esse código acima desse ]]> que já tem o código dessa cor anterior, onde posso colocá-lo?
ResponderExcluirVocê precisará optar por um código só, pra que o código CSS possa ser interpretado uma só vez, aconselho a tirar o outro ou editá-lo deixando apenas um pra que não haja erro.
Excluir