Também chamado de "olho", um pullquote ou intertítulo é um recurso visual extremamente utilizado por revistas e jornais, há muitos anos e até hoje, e que confere um aspecto profissional ao seu blog, dando destaque a partes de seu artigo, além de quebrar grandes blocos de texto, com beleza.
Fácil de ser implementado, basta usarmos apenas umas poucas indicações em seu CSS. Mas se você não é um expert em HTML e CSS, não se preocupe. Aqui você aprenderá a criar um destaque extra a seu blog, de maneira extremamente fácil.
Fácil de ser implementado, basta usarmos apenas umas poucas indicações em seu CSS. Mas se você não é um expert em HTML e CSS, não se preocupe. Aqui você aprenderá a criar um destaque extra a seu blog, de maneira extremamente fácil.
Seu pullquote ficará assim. Mas, antes de mais nada, lembre-se de fazer um Backup de seu template, afinal caldo de carne e canja de galinha nunca fizeram mal a ninguém!
Passo 1: Antes de mais nada, lembre-se de fazer um Backup de seu template.
Passo 2: Logado no Painel de seu Blogger, vá a LAYOUT > Editar HTML (Não é necessário marcar Expandir Modelos de Widgets) e localize (Use CTRL + F) a seguinte linha de código:
]]></b:skin>
Passo 3: ACIMA dela, de preferência próximo às suas definições de blockquote, cole o código abaixo:
.pullquote {
float:right;
width:200px;
margin-top:10px;
margin-bottom:10px;
margin-left:20px;
border-top-width:3px;
border-bottom-width:3px;
border-top-style:solid;
border-bottom-style:solid;
border-top-color:#1d3c6e;
border-bottom-color:#1d3c6e;
font-size:14px;
text-align:center;
line-height:25px;
font-family:Arial, Helvetica, sans-serif;
font-style:italic;
font-weight:400;
padding:10px;
}
float:right;
width:200px;
margin-top:10px;
margin-bottom:10px;
margin-left:20px;
border-top-width:3px;
border-bottom-width:3px;
border-top-style:solid;
border-bottom-style:solid;
border-top-color:#1d3c6e;
border-bottom-color:#1d3c6e;
font-size:14px;
text-align:center;
line-height:25px;
font-family:Arial, Helvetica, sans-serif;
font-style:italic;
font-weight:400;
padding:10px;
}
Passo 4: Salve seu template. Depois, você poderá alterar o estilo de seu intertítulo conforme o esquema de cores de seu template. Para isso basta alterar os principais códigos destacados em AZUL, que são óbvios, por sua nomeclaturas.
Passo 5: Agora, vá a CONFIGURAÇÕES > Formatação > Modelo de Postagens e cole, lá, o código abaixo:
Passo 5: Agora, vá a CONFIGURAÇÕES > Formatação > Modelo de Postagens e cole, lá, o código abaixo:
<h4 class="pullquote">Texto de seu pullquote/intertítulo aqui!</h4>
Note que esta fase é a "chamada" para seu "olho" e estamos colocando-a em Modelo de Postagens apenas para facilitar a utilização de seu pullquote. Assim, toda vez que você for fazer um post este código já estará disponível. Se você, em determinado artigo, não pretender utilizar este recurso, basta exclui-lo e pronto!
Passo 6: Salve suas Configurações.
Pronto! Fácil, não?!...
Passo 6: Salve suas Configurações.
Pronto! Fácil, não?!...
GOSTOU DESTE ARTIGO? ENTÃO ASSINE O RSS FEEDS DO BLOG. É GRÁTIS!
Ficaria, também, muito honrado com um COMENTÁRIO seu sobre este Post.
Ficaria, também, muito honrado com um COMENTÁRIO seu sobre este Post.
Comente este artigo!: 2
julho 28, 2009 8:36 AM
Interessante essa dica! Coloquei no blog e funcionou! Abraços!
julho 28, 2009 9:38 AM
Bárbara,
Obrigado por seu(s) elogioso(s) comentário(s) a este blog. Volte sempre!
[]´s
Postar um comentário
Em Comentar como: selecione seu perfil (Nome/URL é o mais comum) e fique à vontade para fazer seu comentário. Critique, dê sugestões e, se for o caso, elogie!
Este blog, agora, é "dofollow", assim, os links nos COMENTÁRIOS estão livres de "nofollow"!
-----------------------------------------------------------------------------------
OBSERVAÇÕES IMPORTANTES | NOTIFICAÇÕES | AVISOS LEGAIS
-----------------------------------------------------------------------------------
1. Os comentários aqui exibidos refletem, exclusivamente, as opiniões isoladas dos visitantes do blog!
2. O Administrador deste blog não se responsabilizará, em hipótese nenhuma, por quaisquer danos que, por ventura, estes venham causar, a quem quer que seja!
3. Mensagens com SPAM ou que não tenham relação com o conteúdo do post não serão toleradas.
4. Para maiores detalhes, leia a POLÍTICA DE PRIVACIDADE e os TERMOS DE USO deste blog!
Obrigado!