Como destacar a primeira letra da postagem ou Gadgets colorida | Quero Dicas Quero Dicas : Como destacar a primeira letra da postagem ou Gadgets colorida

Quero Dicas : Como destacar a primeira letra da postagem ou Gadgets colorida

Como destacar a primeira letra da postagem ou Gadgets colorida

| |


O tutorial de hoje é ensinar como destacar a primeira letra da postagem do seu blog ou do seus gadgets.

Esse tipo de destaque fica bem legal, principalmente em casos de artigos grandes. Veja na imagem abaixo como poderá ficar. Claro, você poderá alterar a cor da fonte.




Este é o destaque no texto da postagem ↓



Este é o destaque nos texto nos Gadgets ou Widgets↓


Se preferi, clique nas imagens para ampliar


Agora que você já sabe o que é, e como fica. Vamos dar destaque a primeira letra da postagem do seu blog ou de seus Textos, Gadgets ou Widgets? Escolha um ou os dois, nos códigos abaixo.
É muito fácil e rápido.


  TUTORIAL


Como sempre recomendo: Faça um backup do seu template, ao instalar qualquer tipo de implementação de códigos dentro do HTML do seu blog e claro, dê preferências a blogs de teste! Não sabe fazer Backup? Não tem problema, Veja este tutortial: Como fazer um Backup ou restauração do seu template

1 - Acesse o painel do seu blog

2 - Vá em "Modelo" e "Editar HTML"

3 - Procure por:

 ]]></b:skin> 
 

4 - Quando encontrar. cole acima dela um dos código abaixo.
Pode adicionar os dois se quizer!
  DESTAQUE NO POST


 Grande {font-size:50px; 
font-style: bold;
color:#FF3E96;
line-height:30px;
float:left;}

PERSONALIZANDO
• font-size:50px; - Aumente ou diminua a fonte se quiser
• font-style: bold; - Se não quiser em negrito, troque por "none" (normal)
• color:#FF3E96; - Troque pela cor que desejar - Tabela de cores: AQUI
• line-height:30px;  - Distância do texto

Para utilizar o efeito em sua nova postagem, entre e adicione no HTML na hora de escrever a postagem e na primeira letra do post entre o código <Grande> e </Grande> 

 <grande> Primeira letra do post aqui dentro </Grande> 
 

Salve e pronto!

  DESTAQUE NOS GADGETS


 h2:first-letter {font-size: 200%; color:#FF3E96;}


PERSONALIZANDO
• {font-size: 200%; - Aumente ou diminua a fonte se quiser
• color:#FF3E96; - Troque pela cor que desejar - Tabela de cores: AQUI

Salve e pronto!

Beijinhos



Eu aprendi este código a muito tempo atras e infelizmente não me lembro onde. Caso seja você o autor, me avise que darei seus devidos créditos. =D



Compartilhe

* Você reservou um tempinho para comentar? *

Desde já agradeço!

Devido a falta de tempo, não prometo responder a todos os comentários. Mas farei o possível!


Nenhum comentário:

Postar um comentário

Amigos do Blog

agenda dos blogs Universo das Dicas

Ganhe Visitantes | Inscreva-se!

GeraLinks Linkicha Atoananet Linkirado
subir