Data em Forma de Flor

Yoo~~

Trouxe um tuto de como colocar a data assim:

Ela tem um efeito meio hover....

Créditos:Chili Pink e Dicas Blogspot

Vamos Aprender ?

Vá em Configurações > Formatação > Formato da data e deixe dessa forma:

Agora vá em Modelo > Editar HTML > aperte F3 e procure por:

.main-inner h2.date-header {

Você irá encontrar assim:

.main-inner h2.date-header {

  font: $(date.font);

  color: $(date.text.color);

Substitua por esse código:

.main-inner h2.date-header {

font-family: Verdana;

color: #ffffff; /* Cor da Fonte */

margin-right: -40px; /* Diminua até ficar em posição ideal */

margin-top: -40px; /* Altura */

background: url(URL DA SUA FLOR) no-repeat center;

float: right;

font-size: 8px; /* Tamanho da fonte */

padding: 30px;

}

.main-inner h2.date-header:hover {

font-family: Verdana;

color: #ffffff; /* Cor da Fonte */

margin-right: -40px; /* Diminua até ficar em posição ideal */

margin-top: -40px; /* Altura */

background: url(URL DA SUA FLOR HOVER) no-repeat center;

float: right;

font-size: 8px; /* Tamanho da fonte */

padding: 30px; } 

Troque URL DA SUA FLOR pelo Url dessas imagens:

 

Visualize e se tudo estiver certo Salve!

 Bjs><