Menu para calendário (02 modelos)


Finalmente a menina aqui resolveu criar um novo PSD o mais semelhante possível, pra fazer as ilustrações hihi. É que eu tinha perdido, gente. Ah, vocês conhecem o Blog de ilustras do Wonderland, e a ask? Eu dei uma abandonada, mas estou de volta *u* aqui estão »Ask/Shine Gallery«. Então gente, faz muito tempo que não posto menus, então eu trouxe dois modelos pra calendário! Esta é a preview» (x) Obs: gadget Menu calendário.

MODELO 01

Vá em seu Modelo, em seguida em Editar HTML. Tecle Ctrl + F e na caixinha que aparecer, procure pela tag ]]></b:skin>. Acima dela, cole este código:

/* menu por wonderland */
@font-face { font-family: 'PF Arma Five';
src: url('http://static.tumblr.com/xf6erfz/sUBm594pm/pf_arma_five.ttf'); src: format('truetype');}
.agenda {
font-family: PF Arma Five;
font-size: 8px;
color: #ababab;
border-bottom: 1px dotted #ffbec9; /* cor da bordinha pontilhada */
-webkit-transition-duration: 1s;
max-width: 158px;
}
.agenda:hover {
background: #f7f7f7; /* cor do fundinho em hover */
margin-left: 5px; /* não modifique */
border-bottom: 1px dotted #ff738a; /* cor da bordinha pontilhada hover */
cursor: text;
-webkit-transition-duration: .10s;
}

Agora, em Layout, adicione um Gadget HTML/JavaScript e nele cole o seguinte código:

<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>
<div class="agenda">
<b>00/00</b> Assunto do post</div>

Azul = Texto da data, está entre <b> </b> para o texto em si ficar em negrito
Vermelho = Texto que você deseja colocar.
/// NÃO MODIFIQUE O RESTO.


MODELO 02 

Vá em seu Modelo, em seguida em Editar HTML. Tecle Ctrl + F e na caixinha que aparecer, procure pela tag ]]></b:skin>. Acima dela, cole este código:

@font-face { font-family: 'PF Arma Five';
src: url('http://static.tumblr.com/xf6erfz/sUBm594pm/pf_arma_five.ttf'); src: format('truetype');}
.agenda02 {
margin: 1px;
background: #ffedf2; /* fundinho */
font-family: PF Arma Five; /* fonte */
font-size: 8px;
color: #8c8c8c; /* cor da fonte */
padding-left: 2px;
border: 1px solid #ff7ea5; /* cor da bordinha  */
-webkit-transition-duration: 1s;
text-shadow: 0px 1px 0px #fff;
border-radius: 3px;
box-shadow:inset 1px 1px 0 0 #fff;
max-width: 158px;
}
.agenda02:hover {
background: #f7f7f7; /* cor do fundinho em hover */
margin-left: 7px; /* não modifique */
border-bottom: 1px dotted #ff7ea5; /* cor da bordinha */
cursor: default;
-webkit-transition-duration: .2s; /* não modifique */
}

 Agora, em Layout, adicione um Gadget HTML/JavaScript e nele cole o seguinte código:


<div class="agenda02">
<b>00/00</b> Assunto do post</div>
<div class="agenda02">
<b>00/00</b> Assunto do post</div>
<div class="agenda02">
<b>00/00</b> Assunto do post</div>
<div class="agenda02">
<b>00/00</b> Assunto do post</div>
<div class="agenda02">
<b>00/00</b> Assunto do post</div>
<div class="agenda02">
<b>00/00</b> Assunto do post</div>
<div class="agenda02">
<b>00/00</b> Assunto do post</div>
<div class="agenda02">
<b>00/00</b> Assunto do post</div>

Azul = Texto da data, está entre <b> </b> para o texto em si ficar em negrito

Vermelho = Texto que você deseja colocar.

/// NÃO MODIFIQUE O RESTO. 

Obs: Os menus são hover, então quando você encosta o mouse, tem efeito!

18 comentários:

  1. Oi Helo, como vai? ~
    Eu simplesmente AMEI os calendários, o segundo é tão fofinho :3 awn *-*

    Também amei seu blog de ilustras :3 Você repassaria os PSD's?

    Beijinhos ~♥ || c-oloredcotton.blogspot.com

    ResponderExcluir
    Respostas
    1. Oi amor, vou bem, e você? *u*
      Que booom, sério ! E muito obrigada! Own, sério? *0* Se não me engano, alguns PSD's que uso lá, eu postei aqui no Blog! É só dar uma procuradinha :3

      Excluir
  2. Olá, eu não conhecia seu blog de ilustração mas estou precisando muuuito, vou deixar aqui nos favoritos..
    Apesar de eu não usar calendários, eu anoto em caderno, eu usaria sim, ficaram super cutes.

    Beijos ❤
    http://www.p-perfectsthings.com/ | Quietly Pink

    ResponderExcluir
    Respostas
    1. Awwn que bom, use a vontade ok? *0*
      ASUHSAUH te entendo, e obrigaaada <33

      Excluir
  3. Achei o menu super kawaii >.< e o seu design também ♥
    Só não usei o menu por causa que eu já tenho vários lá :c
    Besos ♥

    dreamingawa-y.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Muito obrigada princesa <3
      Imagina amor, use só se quiser :3

      Beijos!

      Excluir
  4. Gostei bastante dos calendários, principalmente o primeiro ♥ É lindo! Só trocaria a fonte, essa não fica mais tão legal como era antes... :/

    The Lord of Thrones

    ResponderExcluir
    Respostas
    1. Que bom anjo! É que na verdade esse menu é antiguinho, demorei pra postar! SAUHASHU concordo.

      Excluir
  5. Owwwwn simplesmente GAMEI nos calendários, o segundo e o terceiro então aow *-*

    Beijoquitas ~
    www.chiorichan.blogspot.com || Submarine

    ResponderExcluir
  6. Oláá *3* Fiquei apaixonada pelo menu para calendário, principalmente o segundo <3 Nunca que eu ia conseguir fazer uma coisa tão fofinha assim, não nasci com esse dom, auhsu'

    ~kiss
    CS ♥

    ResponderExcluir
  7. achei que só acontecesse comigo aushauhs , que bom que conseguiu refazer >33<
    adorei os modelinhos , tem tempo que ninguem posta algum :c são lindos!

    Beijocas! g-girlie.net ~ G²

    ResponderExcluir
    Respostas
    1. ASHUSAUH é claro que não! Pois é hihi

      Que bom amor, e isso é verdade! Obrigada *u*

      Excluir
  8. Oi Helo saudades ♥

    Então eu sempre pego as ilustrações de lá ou daqui mesmo, porque são um amorzinho ♥

    Eu achei super fofo esse menu, usaria, mas ficaria muito cheio de Gadgets o meu blog.

    Beijos ♥ | Brigadeiro-vintage.blogspot.com

    ResponderExcluir
    Respostas
    1. Olá sua linda *u* Que boooooom saber *00* obrigada!
      Que bom linda, obrigada, e imagina! use só se quiser :3

      Excluir
  9. Olá, gostei do segundo modelinho ele ficou bem fofinho e combina com o estilo dos meus lays, então talvez eu o use =)

    Meu Mundo, Meu Estilo
    My Fluffy Rainbow
    Participe do Top Comentarista de Novembro"

    ResponderExcluir

Regras:
-Aceito críticas, porém, comentários ofensivos/maldosos serão apagados.
-Não aceito mais: Seguindo, segue de volta?
-Coloque o link de seu Blog no fim do comentário, é garantido que irei visita-lo e dependendo do conteúdo, até posso segui-lo :3
-Comente a vontade!