Image Map

24/01/2013

Data personalizada

sorveeeeeteeeeeeee ♥
 Buenos dias, muchachas! Sim, isso é espanhol, mesmo que eu não saiba falar mais nada, hahaha ><
 Hoje eu trouxe mais um dos tutoriais pedidos na ask, e dessa vez é um que eu mesma fiz. Então, como sempre, se você usar não pode esquecer de dar os créditos, ok? 
 É super simples de se fazer e o resultado é mega fofo! Ele é o modelinho que uso em todas as minhas encomendas e até aqui no blog. Se você estiver lendo esse post no futuro, aqui tem uma preview de como ele fica/ficou no meu blog de encomendas:
lalala, não sei de nada que possa colocar aqui

 Primeiramente, vá no seu blog e clique em Configurações, depois em Idioma e formatação. Então desça até o "Formato da data" e mude para o modelo "24/01/12" (coloquei com a data com a qual postei esse tutorial, mas pode estar com uma diferente no dia em que você for fazer. O que importa mesmo é que o modelo seja esse).
 Agora abra o HTML do seu blog e clique em "Expandir modelos de widget". Depois tecle ctrl+F e procure por .main-inner h2.date-header {
 Vai aparecer um código parecido com esse:

.main-inner h2.date-header {
  font: $(date.font);
  color: $(date.text.color);
}

 Então você só precisa apagar todo esse código e trocar por esse:

.main-inner h2.date-header {
font: Calibri; /* FONTE */
color: #000000; /* COR DA FONTE */
margin-top: 3px; /* AUMENTE PARA DESCER A DATA E DIMINUA PARA FAZER O CONTRÁRIO */
margin-left: -89px;  /* AUMENTE OU DIMINUA PARA AJUSTAR */
background: #FFFFFF; /* COR DO BACKGROUND*/
float: left;  /* MUDE PARA RIGHT SE A SUA SIDEBAR FOR NA ESQUERDA */
font-size: 13px;  /* TAMANHO DA FONTE */
padding: 4px;
border-radius: 15px 0px 0px 15px; /* AUMENTE OU DIMINUA OS 15's PARA DEIXAR A BORDA MAIS OU MENOS ARREDONDADA */
border:1px solid #000000;  /* TAMANHO, MODELO E COR DA BORDA */
}

 Já está tudo explicadinho no código mesmo, então nem tenho muito mais o que falar. Ah, e tinham me pedido pra ensinar como deixar a fonte da data personalizada. Com esse modelo, a fonte dela já fica igual a dos títulos dos seus gadgets, então é só personalizar eles ^^
Post completo por Piink Cookie. Todos os direitos reservados. Copyright 2013. Plágio é crime.
 E aí, gostaram? Espero que sim. Qualquer dúvida quanto aos códigos é só me avisar, ok? E espero que consigam fazer, na minha opinião ficou bem fácil de se entender.
 É isso. Beijinhos com glitter :*

68 comentários:

  1. Adorei o tutorial, bem explicado, tava precisando mesmo *-*
    A data fica bem fofa ^^
    Beijos :3
    http://garotasatrevidas-s2.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Aaah, que bom que gostou Mille! Obrigada *----*

      Excluir
  2. Uiiii...amei o tuto *0* nhac
    Acho melhor esse tipo de data personalizada, quando der pra mim fazer eu faço *0*
    nhaaaa, obrigadaaa....vou ficar esperando a foto heim!!?? hahah
    Beijo, beijo...fica com Deus!!!

    http://www.delicadinhah.com.br/

    ResponderExcluir
  3. Nossa, adorei o tutorial, ficou super bacana! Eu adoro o PC, um dos meus blogs prediletos!

    Tem post novinho no blog <3

    Beijos e boa quinta!

    Sugar Dance (clique no perfil para visitar)

    ResponderExcluir
    Respostas
    1. Ooown, brigada Camilla >< Fico super feliz em saber disso!
      Okok *------*

      Excluir
  4. uau! mais que data lindoona!, estou fazendo um lay, talvez eu use ein :) amei

    Adolescente Nerd

    ResponderExcluir
  5. nossa lindo demais seu blog parabéns *-*
    amei o tutorial bem explicado

    flor estou seguindo seu blog se poder seguir o meu de volta serei grata *--*

    alinewdesigner.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Aah, obrigada, fico feliz que tenha gostado!

      Excluir
  6. Muito bom o tutorial...
    Tenha um ótimo dia,bjo
    www.erciliawience.blogspot.com

    ResponderExcluir
    Respostas
    1. Obrigada, bom que gostou! Você também ^3^

      Excluir
  7. Aaai adorei o tutorial , mas não ficou como a previsão no meu :( Vou tentar refazer para ver se fiz algo de errado , mas é tão facinho , haha !
    Beijos !

    http://meninachicmc.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Aaah, ok! Poxa, tomara que consiga arrumar D:
      Mas que bom que gostou! *---*

      Excluir
  8. Que lindo seu blog, estamos seguindo, e obrigada pela visita no nosso ! (:
    Beijos.

    http://juntasnovamente.blogspot.com.br/

    ResponderExcluir
  9. Paula sempre arrasando nos tutos :3
    Amei, apesar de usar modelos de datas mais simples.
    Beijos!

    chovendo--sonhos.blogspot.com

    ResponderExcluir
  10. Aaaaah, esta data é muito fofa! Pena eu já ter colocado um efeito na minha =/ Beijão!

    Ju, do Epílogos e Finais.

    ResponderExcluir
  11. Ficou muito legal essa data :)
    Vim retribuir a visita ao meu blog, volte sempre :)
    www.mafelix.com.br

    ResponderExcluir
  12. Bem diferente essa data, gostei!!
    woman-decides.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Aaah, obrigada, fico feliz que tenha gostado! ^^

      Excluir
  13. Eu uso esse tutorial, é mesmo muito incrível. ! :3

    Acesso Permitido, retribui?

    ResponderExcluir
  14. Oi, eu não sei se vc aceita tags mas eu marquei você em uma, participe se quiser. Obrigada.
    http://thingsofcandy.blogspot.com.br/2013/01/perguntas-e-respostas-tag-1.html

    ResponderExcluir
    Respostas
    1. Aaah, não aceito flor, infelizmente. Mas obrigada por passar pra mim!

      Excluir
  15. Adorei o post, muito legal ;D
    Beijos
    http://cupcake-a.blogspot.com

    ResponderExcluir
  16. Adorei, fica ótimo!
    www.espacegirl.blogspot.com

    ResponderExcluir
  17. Adorei o resultado e é linda essa data coloquei no lay que eu toh fazendo :) claro que vou dar os créditos!

    Kisses :*

    www.princesasdorocker12.blogspot.com.br

    ResponderExcluir
  18. Amei,o resultado Paulinha é super fofo,
    Beijinhos*_*
    Blog-Garotas-Imperfeitas.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Obrigada Andressa, fico feliz que tenha gostado! ^^

      Excluir
  19. adorei o tutorial paula
    explicas muito bem :)

    beijos, kethleen

    ResponderExcluir
  20. ameeei esse tutorial, o resultado ficou super fofo *--*

    Beeeeijos,
    http://voutecontarmakeup.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Obrigada, fico feliz que tenha gostado *---*

      Excluir
  21. Adorei o tutorial paula, a minha data é uma faxinha. beijos
    pimentacupcake

    ResponderExcluir
  22. Adorei esse tuto >.<
    Se eu usasse data nos meus post eu usaria ele rsrs
    bjinhos
    conversando-com-a-lua.blogspot.com.br

    ResponderExcluir
  23. eu nunca consegui colocar data ao lado do post, vou ver se dessa vez sai.
    Beijos, Thay do princesadoavesso.blogspot.com.br

    ResponderExcluir
  24. Se tu não sabe falar nada, imagine eu!? e_e Eu fico boiando quando meu professor de espanhol conversa conosco na sala de aula /o/

    Ti datinha mais fofa >O< Paula divando nos tutoriais, pfvr u-u

    ResponderExcluir
    Respostas
    1. Nossa, ahsuahsuahsu >< Mas eu nem tenho aula de espanhol, ainda estou na pior u3u
      Oown, brigada ><

      Excluir
  25. Muito legal o tutorial hehe gostei muito
    Beijos :*
    http://mundoadolescente-alana.blogspot.com.br

    ResponderExcluir
  26. Adorei o tuto. O resultado é lindo.

    garotadifferente.blogspot.com

    ResponderExcluir
  27. Gostei mt do tuto, bem útil *--*

    naidadeteen.blogspot.com

    ResponderExcluir
  28. Pronto, já achei meu blog de tutos KKK vou viver aqui.
    Obrigada pelo comentário linda, eu fiz mais um post falando de moda :))


    --
    www.mentesolvente.blogspot.com

    ResponderExcluir
  29. Ja conhecia esse tutorial . E bem facil . Beijos
    www.clarinhapink.com

    ResponderExcluir
  30. gostei do tutorial, bem que eu preciso personalisar a minha data

    ResponderExcluir
  31. amei o tutorial, VocÊ explica muito bem html, fiz curso de Web mais foi a mesma coisa de nada, venho sempre aqui no seu blog olhar os tutoriais, parabéns continue assim, agora vou lá para o meu blog tentar arrumar a data como você ensinou**
    beijo flor
    Fuii
    minhahistoriasendofeita.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Aaah, brigada flor *-----* Poxa, que pena saber disso, porque eu estava querendo fazer um TT-TT
      Oown, fico super feliz em saber disso! Okok *---*

      Excluir
  32. quando e para procurar main-inner h2.date-header { nao me aparece nada :(

    ResponderExcluir
    Respostas
    1. Procure por main-inner h2. ou só por date-header e vá dando enter até encontrar um código parecido ^^

      Excluir
  33. Obrigado por esse post,muito bom,muito bem explicado vou tentar mudar a minha data tbm,vai ficar fofuxoo bjs :)

    ResponderExcluir