O Que é Blockquote e Qual Sua Importância

O que é Blockquote e qual sua importância?

A tag blockquote significa uma citação e é muito usada para destacar um texto de uma outra fonte em um blog ou site. O blockquote é uma parte do aprimoramento do layout de uma página na web e deve ser bem destacada e visualmente interessante. Grande parte do tempo de um blogueiro é usado para aprimoramento de layout de sua página, portanto, é indispensável não aprimorar esta tag.

Um exemplo de citação adicionando a tag blockquote no HTML de uma página é colocando um código de numeração de páginas do blogger usando <blockquote> antes do código ou texto inserido e </blockquote> depois da citação para indicar o fim da tag.

A citação ficaria assim em um ou mais templates do blogger::

<style type="text/css"> #blog-pager{font-size:normal;padding:10px 0;clear:both;} .showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px} .showpageArea a{color:#000} .showpageNum a{padding:3px 8px;margin:0 2px;text-decoration:none;border:1px solid #999;background:#ddd;color:#000;} .showpageNum a:hover{border:1px solid #888;background:#ccc} .showpageOf{margin:0 2px 0 0;padding:3px 8px;margin:0 2px;text-decoration:none;border:1px solid #999} .showpagePoint{color:#fff;padding:3px 8px;margin:2px;border:1px solid #999;background:#666; text-decoration:none} </style> <script style='text/javascript'> var numshowpage=4; var postperpage =3; var upPageWord="Anterior"; var downPageWord="Próxima"; var home_page="/"; var urlactivepage=location.href; </script> <script style='text/javascript' src='http://dl.dropbox.com/u/35784805/Mil%20Trucos%20Blogger/paginacionbloggermtb.js'></script>

Mas a citação pode ter diferentes características e formas, isto porque o blockquote pode ser editado no HMTL de uma página.

Como Editar o Estilo do Blockquote

Para editar o estilo do blockquote é necessário entra no html de sua página e fazer as alterações. Para isso, no caso do blogger siga os seguintes passos:

1. No painel do blogger vá em Modelo e salve suas configurações de estilo de página clicando em "Fazer Backup/Restaurar" e "Fazer Download do Modelo Completo";

2. Ainda na página Modelo clique em Editar HTML, marque a caixa Expandir Modelos De Widgets, procure com Ctrl+F por Blockquote { e dentro das chaves "{}" é possível alterar a imagem mudando a url da imagem, mudar as cores de fundo trocando os números Hexadecimais, estilo, tipo e tamanho da fonte. Se não achar o "blockquote {" pule esta parte e vá para a próxima;

3.Cole um desses modelos de blockquote abaixo exatamente antes do ]]></b:skin> em seu html, procure o com CRTL+F:

blockquote {
border-left: 0px solid #c0c0;
background: #eeeeee url(http://img99.imageshack.us/img99/2614/bgblockquoteht8ch6.gif) repeat-x;
background-position: bottom;
padding: 15px;
margin: 10px;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 20px;
padding-top: 5px;
margin-bottom: 10px;
line-height: 100%;
font: normal .9em verdana, helvetica, sans-serif;
color: #666666;
}

Neste modelo acima foi colocada uma imagem no background da citação através da url do endereço onde a foto está armazenada mas você pode escolher outra imagem colocando a sua url.

Pode usar este outro tipo de blockquote:

blockquote {
border-left:#009900 5px double;
background:#f0fff0;
color:#006600;
padding-left:15px;
padding-top:10px;
padding-bottom:10px;
}

Existem diversos tipos de blockquote cabendo ao administrador do blog ou site as devidas alterações no html da página.

Seguindo estes passos fica mais prático colocar um blockquote mais interessante no seu blog ou site. Nunca se esqueça de salvar seu template antes de fazer qualquer alteração nele.

Inscreva-se em nossa newsletter e receba nossas atualizações via e-mail.