2 de dez de 2013

Data escondida

Fiz uma prova de vestibular ontem e estou super ansiosa, nem dá para acreditar que estou realmente fazendo essas coisas! Também é muito estranho pensar que ano que vem não tem mais aulas, pelo menos do ensino médio, vou sentir falta de algumas coisas, mas no fim estou feliz de ter acabado rs' 

Nem tive tempo de falar sobre os novos afiliados e sobre o que decidi, bom, na verdade eu já tinha dito que ia continuar com o blog até o Natal, mas acho que não fui muito clara quanto a isso. Vou continuar sim até o Natal, e se ainda tiver ideias pra postar, continuo um pouco mais. Sei que um dia vou ter que parar de blogar, manter 4 blogs me tomam tempo demais, e tenho que começar a me dedicar a outras coisas, como estudar por exemplo. Tenho muito dificuldade em matérias como física e preciso aprender essa merda, sempre tiro notas extremamente baixas em física nos vestibulares, mesmo tirando notas altas nessa matéria na escola. 

Falei demais né? O tutorial de hoje é bem simples, foi a Kimberly quem me pediu e eu estou ensinando. A Kimberly queria o tutorial da data daqui do blog, que só aparece quando passa o mouse. Quem não viu, ela está acima do nome da postagem, só passar o mouse que vai aparecer. Essa data fica ótima em templates onde não tem espaço para elas, mas que seja necessário saber o dia em que foi postado. Vamos ao tuto:

1- Vá no HTML do seu blog e procure por .main-inner h2.date-header { Abaixo disso, cole:

@font-face {font-family: "handy"; src: url('http://static.tumblr.com/lnvca6d/E6vm63ih7/pf_ronda_seven__1_.ttf');}
.main-inner h2.date-header {
font-family: handy;
color: transparent;
font-size: 8px;
text-align:center;
-webkit-transition-duration: .70s;
text-transform:capitalize;
}
.main-inner h2.date-header:hover {
font-family: handy;
color: #b29dc6;
margin-bottom:10px;
font-size: 8px;
text-align:center;
-webkit-transition-duration: .70s;
text-transform:capitalize;
}

Entendendo

@font-face {font-family: "handy"; src: url('http://static.tumblr.com/lnvca6d/E6vm63ih7/pf_ronda_seven__1_.ttf');}
Esse é o @Font-face da fonte da data. Troque apenas se você for mudar a fonte. O @Font-face permite que você use fontes que não são do blogger.

 font-family: handy;

Essa é a fonte da data.

color: transparent;

Cor da fonte. Ela deve ficar transparente, caso contrário vai aparecer em cima da postagem. Não mude.

font-size: 8px;
text-align:center;
-webkit-transition-duration: .70s;
text-transform:capitalize;

Primeira e segunda linha: Tamanho e alinhamento da fonte, respectivamente. Mude de acordo com seu gosto. Terceira e quarta linha: transição (o tempo que demora para a data aparecer. !Não mude isso!) e transformação do texto. Isso vai fazer com que todas as primeiras letras da data fiquem em maiúscula. Se não quiser, apague essa linha.

color: #b29dc6;

(No segundo parágrafo). Essa é a cor da fonte. Agora sim você pode colocar a fonte que você quiser que a data apareça.

margin-bottom:10px;

Essa é a margem entre a fonte e a postagem depois que passa o mouse. Isso é o que vai fazer a fonte "subir" quando você passar o mouse.

font-size: 8px;
text-align:center;
-webkit-transition-duration: .70s;
text-transform:capitalize;

Como no parágrafo de cima, esse é o tamanho, alinhamento, transação e transformação do texto. 

Espero que o tutorial tenha sido útil para vocês. Quem quiser me pedir alguma coisa, é só me mandar um ask  que assim que tiver tempo faço o tutorial. Lembrando que aqui nós temos outras duas maneiras de personalizar a data, uma que é mais "comum" e mais fácil de editar, e outra que é com faixinha.

7 comentários:

  1. aaaawn valeeu, eu tava querendo saber esse tutorial faz tempo *U*
    Visita? - Volg novo -q

    ResponderExcluir
  2. Eu entendo , mas sabe como você tira nota alta ? Claro que precisa estudar , mas também tem um maneira certa , leia como se vc estivesse ensinando alguém ou com firmeza . Tipo .. física , nossa eu tô doida para ter essa matéria , vc precisa encontrar uma maneira divertida para praticar ( por um vídeo , etc.. ) algo que vc goste , junta com a matéria e vc consegue . Eu só tiro nota alta e.. fico praticamente no note o tempo todo !
    Eu vou usar essa data escondida qualquer dia
    candytendy.blogspot.com

    ResponderExcluir
    Respostas
    1. Ahh mas eu tiro notas altas porque na escola é mil vezes mais fácil, nada do que a gente aprende na escola cai no vestibular, absolutamente nada.

      Ta doida pra ter essa matéria? Você é louca? suahsuah' eu também queria estudar isso, até começar a estudar isso. A gente pensa que física são aquelas leis e aquelas coisas maneiras, mas na verdade é um monte de conta sem sentido. Uma matemática diferente.
      Tiro notas altas na escola também, mesmo ficando no note. O problema é que vestibular é bem diferente ^^

      Excluir
  3. Adorei o tutorial, já sabia, mas é bem útil.
    i-nterrupt.blogspot.com

    ResponderExcluir
  4. Lindo <3 Vou usar no próximo template.

    etcforme.blogspot.com

    ResponderExcluir

Seja educado, não use palavras ofensivas ou de baixo calão;
Comente algo relacionado ao post, para outros assuntos use a ask;
Obrigada e volte sempre!