20 de jul de 2012

Blockquote personalizado #2


Já ensinei dois modos de personalizar o blockquote, agora trago um terceiro. Esse modo de personalizar o blockquote é bem simples. É basicamente a mesma coisa que o blockquote com imagem, mas sem a imagem. Ele é muito fácil de personalizar e fica simples e bonito. Caso queira um preview, clique aqui.


1- Vá em Design > Editar HTML

2-Aperte CTRL+F e procure por ]]></b:skin>, ACIMA disso, cole:
blockquote {
border-bottom: 1px dashed #327613; /* cor da borda */
background-color: #efefef; /* cor de fundo */
padding: 10px;
font-size: 11px; /* tamanho da fonte */
color: #000000; /* cor da fonte */
text-align: justify; /* alinhamento do texto */
}
Se quiser mudar a borda pontilhada para a direita, coloque no lugar de bottom a palavra right; Se quiser mudar para a esquerda, modifique para left, se quiser mudar para cima, modifique para top.
Se quiser uma linha solida, troque o dashed para solid. Você pode colocar também dotted (pontilhada), double (duplicada) e etc. Veja os estilos de borda aqui.



5 comentários:

  1. Oie!
    Peguei o modelo Travel do blogger pela primeira vez pra editar mas o blockquote personalizado não funciona nele. Nem o efeito hover em imagens. A unica coisa que consegui foi colocar efeito de mudar de cor e sombra ao passar a seta do mouse nos links. Coloquei tudo certinho, mas não vai. :/ E só só nesse modelo que não funciona.
    Os titulos das páginas tb não ficam iguais aos titulos dos posts. Sabe o que pode ser?

    Brigadinha!

    ResponderExcluir
    Respostas
    1. Não sei o que pode ser. Qual modelo travel você usa? Aquele do fundo de papel? Eu sempre testo os códigos nesse, e não dá nenhum erro :O

      Excluir
  2. Foi esse mesmo com aquele fundo de papel e aquele "picote" ridiculo em cima. :(
    Mas valeu por responder! Acho que vou começar tudo de novo, fazendo as personalizaçoes primeiro. quem sabe funciona... oo preguiça

    Bjinhos

    ResponderExcluir
    Respostas
    1. Se o problema for só o blockquote, tenta colocar o codigo um pouco mais acima, tipo depois do código de esconder a navbar, ou algum outro codigo que esteja mais acima de /b:skin.
      Desculpa não poder ajudar mais

      Excluir
  3. uau, me ajudou muito, consegui modificar de forma a combinar com meu lay
    obrigada

    ResponderExcluir

Seja educado, não use palavras ofensivas ou de baixo calão;
Comente algo relacionado ao post, para outros assuntos use a ask;
Obrigada e volte sempre!