Como colocar bordas no titulo da postagem.

A dica de hoje é para quem deseja colocar bordas no título da postagem. É um efeito interessante pois dá um destaque no título da postagem. Vamos ao tutorial:

Lembrando que antes de realizar qualquer mudança no template é essencial fazer um backup do seu modelo. Assim se algo der errado, você poderá coltar ao seu antigo modelo facilmente. Se não souber como fazer backup, clique aqui e aprenda a fazer um backup do seu template.

• Faça login no Painel do blogger
• Selecione a aba “Design”
• Editar HTML
• Procure pelo seguinte código: “.post h3 {“ (se não encontrar, retire o espaço entre h3 e a chave e tente novamente)

OBS.: Para encontrar o código no seu template, você pode usar as teclas CONTROL + F, bastando depois disso digitar o texto/código que procura no campo de pesquisa que abrir-se-á.

• Cole após ele o seguinte código:

border-top: 2px solid #a89ffe;
border-left: 2px solid #d301e0;
border-right: 2px solid #01e001;
border-bottom: 2px solid #e02b01;
background: #000000;
margin:.25em 0 0;
padding:0 0 0 8px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
}

Se você quiser customizar as bordas, segue aqui uma lista dos estilos de bordas. Para modificar a borda, basta você substituir a parte do código acima onde tem escrito “SOLID” por algum dos códigos relacionados abaixo, conforme seu agrado:

- solid: borda contínua
- groove: borda entalhada
- dashed: borda tracejada
- dotted: borda pontilhada
- double: borda dupla
- inset: borda em baixo relevo
- outset: borda em alto relevo
- ridge: borda em ressalto

Desvendando o código:

1. A parte denominada 2px das bordas refere-se à largura das mesmas.
2. #a89ffe, #01e001 e #e02b01 são as cores
3. background: #000000 refere-se a cor, que pode ser substituida por uma imagem, se desejado.
4. Padding: ‘margem’
5. font-size: tamanho da letra.

Visualize antes de salvar. Se gostar é só salvar o modelo, do contrário bastará limpar as edições.

Facílimo né? Assim são nossos tutoriais e dicas. Todos muito fáceis para que todos possam acessar e fazer em seus blogs.

Seja VIP, receba as novidades no seu email, clique no ícone...

Início