Personalizar blockquote no blogger

Siga o Ferramentas Blog: Canal no Youtube | Facebook | Twitter | Google+
Acesse AGORA: https://blogueiro.pro e se torne um Blogueiro de Elite.

Como personalizar as citações em destaque das postagens de um blog no blogger? O chamado: Blockquote? É algo muito simples. Vamos apenas adicionar algumas linhas CSS e dar estilo ao blockquote.

 

Para personalizar o blockquote no seu blog, siga os passos a seguir.

 

Passo 1: Entre no painel do blogger clique no link design e em seguida editar HTML

Passo 2: Procure (CTRL+F) por qualquer trecho no CSS com o nome blockquote

Passo 3: Delete o código encontrado e substitua pelo código abaixo:

 

blockquote {
background: #A9F5D0 url(http://2.bp.blogspot.com/_qgZA1ny_dAs/Sw66TNQV5hI/AAAAAAAADK4/lALxQAkmQF0/s200/blockquote.png) top left no-repeat;
margin: 10px 15px 3px 3px;
padding: 5px 15px 10px 32px;
border-top: 1px solid #DDD;
border-right: 1px solid #666;
border-left: 1px solid #DDD;
border-bottom: 1px solid #666;
font-style: italic;
}

 

O resultado será este:

 

blockquote1

 

Se preferir você pode dar um aspecto mais moderno como este:

 

blockquote2

 

Para o segundo modelo use este código:

 

blockquote {
margin: 10px 15px 3px 3px;
padding: 5px 15px 10px 15px;
border-left: 5px solid #FF8000;
font-style: italic;
}

 

Alguns layouts não tem o código: blockquote {

Em outras o código começa um pouco diferente: .post blockquote {

Depois de inserir o código clique em Visualizar se estiver tudo certo clique em Salvar modelo. Pronto você já tem o blockquote personalizado no seu blog.

Até a próxima!

.

2 Comentários

Deixe um comentário

Ao comentar você concorda com nossa Política de Comentários.