data personalizada

1. No HTML aperte F3 e procure por .main-inner h2.date-header {
Logo abaixo, estará escrito assim:

font: $(date.font);
color: $(date.text.color);
}

Estão, substitua todo o código acima, por esse:

/* Personalizado by Farry Teen */
border-radius:10px 10px 0 0;
font: normal normal 12px tahoma; /* font */
text-transform:uppercase;
color: #000; /* cor da fonte */
background: #87CEFA; /* cor do fundo da caixa */
width: auto;
text-align: right; /* alinhamento do texto */
padding:5px; /* Tamanho da caixa */
float: right; /* Alinhamento da caixa */
right: 5px; /
margin-top:-25px; /* altura da caixa */
}

Visualize, e se a data estiver certinha, salve. Agora, personalizaremos as tags.

2. Ainda no HTML, aperte F3 e procure por ]]></b:skin> e logo acima, cole:

/* Personalização by farryteen.blogspot.com */
.post-labels {
border-radius:0 0 10px 10px;
font-size:14px; /* tamanho da fonte */
color: transparent;
background: #FFB5C5; /* cor do fundo da caixa */
width: auto;
text-align: center; /* alinhamento do texto */
font-size: 16px; /* tamanho da fonte */
padding: 3px 8px 3px 1px;
float: left; /* alinhamento da caixa */
left: -10px;
margin-top:15px; /* altura da caixa */
}

Repetir a data nos posts do mesmo dia

Repetir a data nos posts do mesmo dia

  
Por padrão, o Blogger não mostra a data em todos os posts escritos em um mesmo dia, deixando a informação visível apenas no último publicado. Para contornar este problema, vá em Editar HTML e clique em Expandir Modelo de Widget. Procure por:

<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

E substitua tudo por:

<b:if cond='data:post.dateHeader'>
<script>var ultimaFecha = '<data:post.dateHeader/>';</script>
<h2 class='date-header'><data:post.dateHeader/></h2>
<b:else/>
<h2 class='date-header'>
<script>document.write(ultimaFecha);</script>
</h2>
</b:if>

Data Pers

.main-inner h2.date-header {

  font: $(date.font);

  color: $(date.text.color);

}

Apaga esse código e substitui pela data que mais gostares :)

1 - Data simples ( só muda a cor do fundo quando passa o mouse )

.main-inner h2.date-header { 

/* Data personalizada by Cat Girl */ 

font: arial; /* Fonte da Data */ 

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

margin-left: -90px; /* Alinhamento da Data , pode trocar para right se quiser na direita */

background: #00BFFF; /* Fundo da data */ 

float: left; /* Se você mudou acima para right , mude aqui também */

font-size: 11px; /* Tamanho da Fonte */ 

padding: 4px; 

-webkit-border-radius: 20px;

-moz-border-radius: 20px;

border-radius: 20px;

}

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

background: #C1CDCD; /* Fundo quando o passa o mouse */ 

/* Fim da data personalizada by Cat Girl, não retire créditos */

}

2 - Data "folhinha"

.main-inner h2.date-header { 

/* Data personalizada by Cat Girl */ 

font: arial; /* Fonte da Data */ 

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

margin-left: -90px; /* Alinhamento da Data , pode trocar para right se quiser na direita */

background: #FFFFFF; /* Fundo da data */ 

float: left; /* Se você mudou acima para right , mude aqui também */

font-size: 11px; /* Tamanho da Fonte */ 

padding: 4px; 

-webkit-border-top-right-radius: 20px;

-webkit-border-bottom-left-radius: 20px;

-moz-border-radius-topright: 20px;

-moz-border-radius-bottomleft: 20px;

border-top-right-radius: 20px;

border-bottom-left-radius: 20px;

}

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

background: #FFC0CB; /* Fundo quando o passa o mouse */ 

-webkit-border-top-left-radius: 20px;

-webkit-border-bottom-right-radius: 20px;

-moz-border-radius-topleft: 20px;

-moz-border-radius-bottomright: 20px;

border-top-left-radius: 20px;

border-bottom-right-radius: 20px;

/* Fim da data personalizada by Cat Girl, não retire créditos */

}

3 - Data redondinha

.main-inner h2.date-header { 

/* Data personalizada by Cat Girl */ 

font: arial; /* Fonte da Data */ 

color: #00BFFF; /* Cor da Fonte */ 

margin-left: -90px; /* Alinhamento da Data , pode trocar para right se quiser na direita */

background: #FFFFFF; /* Fundo da data */ 

float: left; /* Se você mudou acima para right , mude aqui também */

font-size: 11px; /* Tamanho da Fonte */ 

padding: 4px; 

-webkit-border-top-left-radius: 100px;

-webkit-border-bottom-left-radius: 100px;

-moz-border-radius-topleft: 100px;

-moz-border-radius-bottomleft: 100px;

border-top-left-radius: 100px;

border-bottom-left-radius: 100px;

}

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

background: #000000; /* Fundo quando o passa o mouse */ 

-webkit-border-top-right-radius: 100px;

-webkit-border-bottom-right-radius: 100px;

-moz-border-radius-topright: 100px;

-moz-border-radius-bottomright: 100px;

border-top-right-radius: 100px;

border-bottom-right-radius: 100px;

/* Fim da data personalizada by Cat Girl, não retire créditos */

}

Personaliza as cores com *esta* tabela

Beijinhos, usem e abusem das minhas datas !