globo

Feed
Versão 1.0 (Beta)
Página 2

Colocar a data do dia no Blogger

Noticiado em: segunda-feira, 15 de setembro de 2008

Em primeiro lugar quero deixar claro que esse post não está relacionado com nenhum tutorial que ensina como colocar o título acima da data da publicação do post ou sobre customização de datas.
Caso seja isso que esteja procurando, recomendo o Alex Blog Estudos, lá você irá encontrar por estes e muitos outros ótimos tutoriais sobre outras plataformas sem ser o Blogger e sobre linguagens de programação!
O que irei ensinar é como colocar a data do dia abaixo do cabeçalho de seu Blogger como eu usei em meu layout.


Já adianto que não há muito mistério. O que eu usei foi um código em javascript.

A primeira coisa a se fazer é ir em Layout e escolher a aba Elementos da página. Logo em seguida adicionar um gadget HTML/javascript.


Agora cole o seguinte código na janela aberta e salve:

<script language="JavaScript">
hoje = new Date()
dia = hoje.getDate()
dias = hoje.getDay()
mes = hoje.getMonth()
ano = hoje.getYear()
if (dia < 10)
dia = "0" + dia
if (ano < 2000)
ano = 1900 + ano
function NArray (n)
{
this.length = n
}
NomeDiaWMOnline = new NArray(7)
NomeDiaWMOnline[0] = "Domingo"
NomeDiaWMOnline[1] = "Segunda-feira"
NomeDiaWMOnline[2] = "Terça-feira"
NomeDiaWMOnline[3] = "Quarta-feira"
NomeDiaWMOnline[4] = "Quinta-feira"
NomeDiaWMOnline[5] = "Sexta-feira"
NomeDiaWMOnline[6] = "Sábado"
NomeMesWMOnline = new NArray(12)
NomeMesWMOnline[0] = "janeiro"
NomeMesWMOnline[1] = "fevereiro"
NomeMesWMOnline[2] = "março"
NomeMesWMOnline[3] = "abril"
NomeMesWMOnline[4] = "maio"
NomeMesWMOnline[5] = "junho"
NomeMesWMOnline[6] = "julho"
NomeMesWMOnline[7] = "agosto"
NomeMesWMOnline[8] = "setembro"
NomeMesWMOnline[9] = "outubro"
NomeMesWMOnline[10] = "novembro"
NomeMesWMOnline[11] = "dezembro"
document.write (NomeDiaWMOnline[dias] + ", " + dia + " de " + NomeMesWMOnline[mes] + " de " + ano)
</script>

Agora basta você arrastar seu gadget como na imagem a seguir:


Caso queira que a data fique no cabeçalho, você terá que fazer algumas modificações em seu código, pois o template do blogger vem com o cabeçalho bloqueado.

Lembrando que com uma busca rápida no google você poderá modificar esse código e acrescentar uma saudação (ex.: Bom dia – Boa tarde – Boa noite), mostrar as horas...

Gostaria de agradecer ao Edney “Interney” Souza e ao Alexandre campos (do Alex Blog estudos) por responderem tão rapidamente aos meus e-mails, pela paciência e pelos ótimos serviços prestados. ;)

21 comentários:

GRUPO DE ESTUDO 1 disse...

Ola!
Gostaria de saber como acrescentar uma cor nesse seu código da data?
Valeu!

Leandro disse...

Depois de todo o processo feito, o que você pode fazer é colocar todo esse código dentro de uma DIV. Assim você poderá formatar o texto da maneira que você bem entender.
(fontes, cores, tamanhos...)

Lilith - Ellora disse...

como assim DIV Leandro? pode me explicar melhor?!

Leandro disse...

Gustavo... Para colocar a data, basta seguir as explicações do post.
Agora, caso você queira formatar o texto (que corresponde a data) você tem ter que ir um pouco mais além.
Você teria que entender um pouco (básico) de HTML e CSS... Então, eu recomendo que você siga só a explicação do post mesmo, ok?

Caso você queira se aprofundar no assunto, eu tenho alguns posts no blog que ensina os caminhos que você deve seguir.

Anônimo disse...

ok, funcionou, obrigado.

APRENDIZAGEM CONTÍNUA disse...

Obrigada pela ajuda, funcionou muito bem! É muito bom saber que ao montar um blog, podemos contar com excelentes explicações como esta.

Leandro disse...

Eu que agradeço pela sua visita, comentário e elogio!
Seja sempre bem vindo! :)
Abraços!

Anderson Bella disse...

Parabéns! Adorei sua sugestão e já coloquei no meu blog.

Andrenaline-Informatica disse...

opa ajudou mto

Isadora disse...

Segui o indicado e coloquei a data no blog. Obrigada! Gostaria apenas de saber como aumentar ou trocar a cor da fonte

Leandro disse...

Olá Isadora!
Como eu havia escrito aqui mesmo pelos comentários, você pode formatar a fonte usando CSS.

Descubra em qual DIV você colocou a data (caso não tenha criado uma) e mexa no CSS e escolha tamanho, cor, estilo que lhe agradar melhor.

Abraço!

Fábio Almeida disse...

VLW AI PELA DICA...

Silmara Oliveira disse...

amei isso...obrigada por compartilhar...vou adicionar seu link no meu bloguinho.
abraços e bom feriado

Leandro disse...

Por nada Silmara!
Eu que agradeço pela visita e comentário! :)

Marsal disse...

valeu, isso é legal

Amarildo & Alexandre disse...

valew

Só para mulheres! disse...

Obrigado pela dica, já coloquei no meu blog e ficou perfeito!

Adriana disse...

valeu pela dica

Gilmar de Oliveira disse...

Obrigado!

Joao Vilmar dos Santos disse...

Obrigado, é sempre bom ter gente que auxilia os pocaprática como eu.

valeu.

Conceitus de Beleza disse...

Valeu!! maneira fácil e funcional, isso é o que importa.
Parabéns!!

Postar um comentário