Efeito Hover no Título da Postagem

Oi. Tudo bem, gente bonita!? Quanto tempo em...

Hoje para compensar o meu sumiço, vou ensinar como personalizar o título da sua postagem com uma barrinha vertical e hover, bem do lado esquerdo dela. 

Esse será o efeito: 

Efeito normal

Efeito hover, quando passa o mouse

Então...

1° Vá em Design 
2° Editar HTML
3° Aperte Ctrl + F e procure pela a tag:

/* Posts

4° Abaixo dessa tag, você vai encontrar :

h3.post-title {

5° Logo depois da ({), você deve colar esse código:  

text-align: left;

Vai ficar assim:

6° Agora procure pela tag:

h3.post-title a {

7° Depois da ({), cole esse código:

border-left: 5px solid #SUACOR; /* Personalização da borda */padding-left: 10px; /* Distância entre a borda e o texto */

Obs.: Onde está escrito #SUACOR, você deve substituir pelo o código da cor de sua preferência. Esse é site possui códigos de cores: Tabela de Cores 

Um pouco abaixo da tag acima, você vai encontrar:

h3.post-title a:hover {

Depois da chave ({) , cole este código:

border-left: 10px solid #SUACOR; /* Personalização da borda hover */

É o mesmo esquema da personalização anterior, mas você deve colocar o código da cor que você quer que apareça quando ela estiver hover.

Muito fácil né?

Crédito vai para (www)