Como personalizar a data do Blog | Quero Dicas | Tutoriais para seu blogs


Como personalizar a data do Blog


Como personalizar a data do Blog
Olá pessoal. Depois de quase uma semana resolvendo sobre o  domínio próprio no blog. Tem muita coisa para acertar ainda, mais mesmo com tanto a fazer, vou voltar a pratica de colocar postagens dando dicas a vocês.

Na primeira postagem desse blog, eu ensinei como personalizar a data dos post ao lado do titulo. muita gente adorou este formato, por causa da imagem. Teve muita gente que tem dificuldade na hora da instalação.  Por isso, hoje eu trouxe uma outra forma de personalização.

É muito fácil e rápido, eu garanto!

Caso não goste desse jeitinho, deixo alguns links abaixo para que você possa escolher:
♥ Aprenda como personalizar a data do seu blog
Personalizando a data do blog - Modelo 3
Aprenda como personalizar a data com imagem facilmente
♥ Como personalizar a data do blog estilo calendário

Neste tutorial  é em 2 passinhos muito rápidos. Claro, sem falar na customização, que é mais rápido ainda. =D Para que saiba, ele também ficará ao lado do titulo do post, podendo escolher, lado direto ou esquerdo, você escolhe!
Veja na imagem
Como personalizar a data do Blog

  TUTORIAL

Formato da data

1 - Acesse o painel do seu blog. 
2 - Clique em "Configurações",  "Idioma e formatação" e mude o formato da data para 21/11/2014 (dia/mês/ano).
Nota: Este formato é o melhor por ser pequeno. dando assim mais espaço para o Titulo dos posts.

Como alterar a data do Blog

3 - Salve

Instalação do código

1 - Agora siga para "Modelo" e "Editar HTML"

2 - Tecle Ctrl + F e procure por: 

 main-inner h2.date-header { 

3 - Agora abaixo dele cole:
 font-family: ARIAL; /* formato da fonte */
color: #000; /* cor da fonte */
margin-left: -80px; 
background: #f49cca; /* Cor do fundo */
float: right; /* lado esquero Right ou diretio left */
font-size: 14px; /* tamanho da fonte */
padding: 4px;
-webkit-border-radius: 5px; /* bordas arredondadas */
-moz-border-radius: 5px;/* bordas arredondadas */
border-radius: 5px; /* bordas arredondadas */
}
 


4 - Personalize e salve.

NÃO ENCONTROU O CÓDIGO ACIMA?

1 - Então procure por este:

 .date-header span { 

2 - Agora abaixo dele (.date-header span {) você o selecionará e apagará tudo,  até } e colará o código  a seguir:

font-family: ARIAL;  /* formato da fonte */
color: #000;  /* cor da fonte */
margin-left: -80px; 
background: #f49cca;  /* Cor do fundo */
float: right; /* lado esquero Right ou diretio left */
font-size: 14px;  /* tamanho da fonte */
padding: 4px;
-webkit-border-radius: 5px;  /* bordas arredondadas */
-moz-border-radius: 5px;/* bordas arredondadas */
border-radius: 5px; /* bordas arredondadas */
}

 
3 - Personalize e salve. Pronto!

E ai o que achou? Não se esqueça de deixar seus comentários. Beijinhos
Me Contrate!


Que bom você reservou um tempinho para vir comentar. Você me deixa super feliz e desde já agradeço por sua colaboração.

Comente. Mais peço que leia antes:

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

2 - Educação sempre! Comentários com xingamentos entre outros, não serão publicados ou respondidos.

3 - Comentários não relacionados ao titulo, não serão publicados.

4 - Comentários somente URLs de terceiros, não serão publicados.

♥ - Caso queira divulgar seu blog gratuitamente, Acesse, Galeria de Blogs
♥ - Eu terei o maior prazer em colocar o link ou seu banner nesta galeria.

Muito obrigada por seu comentário e por sua vista.
Beijinhos ♥
Abrir Conversa em CódigoFechar Conversa em Código Abrir EmoticonFechar Emoticon

Obrigada por seu comentário! Ele é muito importante para mim.