Data Personalizada No Blog (Tutorial)

Oi minha gente, tudo certinho??

No #DicaParaBlogueirasIniciantes♥ de hoje vim ensinar a como colocar a data personalizada no seu blog, de maneira fácil e sem complicações para pessoas que ainda não entendem muito de HTML.

1♥ E para começar vá em Layout  e nas Configurações clique em Idioma e Formatação e mude o formato da data como está na imagem abaixo;

2♥ Agora em Modelo, Editar HTML aperte Ctrl F e procure pelo código;

.main-inner h2.date-header {

  font: $(date.font);

  color: $(date.text.color);

}

3♥- Agora apague essas 4 linhas e substitua pelo seguinte código;

.main-inner h2.date-header {

/* Data personalizada por luannaoliveira.com */

float: left; 

width:53px;/** largura **/

height:51px;/** altura **/

overflow:hidden;

font-size:9px;/** tamanho da fonte **/

color: #fff !important;/** cor da fonte **/

text-align:center;

margin-bottom: -45px; /** desce **/

margin-left: -60px; /** margem pra esquerda **/

padding: 8px 2px 0px 2px; 

background: url('URL DA IMAGEM AQUI'); 

}

/* Fim da data da  personalizada por luannaoliveira.com */

4♥ Os nomes em AZUL é para facilitar o entendimento de vocês com o código, é só alterar conforme o seu gosto e onde está escrito URL DA IMAGEM AQUI é só substituir pela imagem que você quer que a data fique dentro. Bote mas ou menos nesse formato de 55px por 55px ou vá mudando de acordo ao seu gosto.

Deixei aqui algumas imagens pra vocês que talvez possa servir, é só clicar com o botão direito do mouse e copiar o url da imagem.

                                                 

                                                          
                                                                       
                                                                

Créditos para os blogs Quero Dicas e Renata Massa onde consegui as imagens, espero muito ter ajudado vocês de alguma forma, não esqueçam de comentar e seguir aqui no blog.

    Super Beijo ♥!!!