[Tutorial] Como colocar Blockquote personalizado



Demonstração, segue link 
Click aqui

1- Vá em Design > Editar HTML
2-Aperte CTRL+F e procure por ]]></b:skin>, ACIMA disso, cole:

.post blockquote {  -moz-border-radius: 10px;  -webkit-border-radius: 10px;  border-radius: 10px;  -khtml-border-radius: 10px;  margin:5px 0px 15px 0px;  padding:20px 20px 20px 60px;  background-color:#FFE4E1;  background-image:url(http://img546.imageshack.us/img546/6404/blockquotee.png);  background-repeat:no-repeat;  background-position:5px 20px;  border-top: 1px solid #FFFFFF ;  border-left: 1px solid #FFFFFF;  border-right: 1px solid #FFFFFF;  border-bottom: 1px solid #fff;  font-style:italic; color:#000000;
  }
.post blockquote p {
  margin:.25em 0;

Esse código já esta personalizado, ficara igual o da demostração que se encontra no inicio, eu arrumei a borda e personalizei com a cor rosa, a parte da imagem não será necessário editar.
Caso não queira rosa, tem em mente outra cor aqui esta uma tabela que sempre uso.
Tabela de cores 

Entenda o código, caso queira trocar a cor de fundo ou aumentar a borda.

O  que esta em destaque com a cor  rosa.
R: Essa é a borda arredondada, apague se quiser deixar quadrada ou amente o número para arredondar mais.
O que esta em destaque com a cor azul.
R: Cor do background (fundo). Escolha uma cor clara

Quando quiser usar o blockquote nos posts , é só clicar naquele botão com aspas:

Comente com o Facebook:

Comente com o Facebook:

2 comentários:

  1. SOu meio lenta pra essas coisas, pra que serve o blockquote? é pra deixar uma frase de efeito?

    ResponderExcluir
    Respostas
    1. blockquote
      é quando quer destacar algo, por exemplo esse blockquote muda a cor de fundo que vc destacar é mt útil

      Excluir