Modelo de agendinha

Oi! Como estão? Espero que bem porque, olha, não parece. Vocês notaram que o pessoal da blogosfera está sumindo aos poucos ou sou só eu? Sinto falta de quando a comunidade só crescia e as interações eram constantes e divertidas. O tanto de conteúdo variado e extremamente bom que a gente via por aqui, todos com carinhas diferentes porque os blogueiros estavam sempre criando coisas novas e layouts incríveis... Ah, lembranças. Espero que as coisas voltem ao normal logo e as pessoas voltem aos seus cantinhos porque eu amo explorar os universos de vocês e ter vocês aqui no meu. As trocas que temos são muito humanas e importantes para mim. Enfim, como um incentivo, estou me dedicando ao desenvolvimento de elementos para blogs e, confesso, viciei nesse negócio de agenda de postagens, então resolvi fazer o meu próprio modelinho para disponibilizar para vocês e não é que ficou fofinho? Bom, pelo menos eu achei. Espero que gostem também. Se usarem, não deixem de comentar e claro, deem os créditos. Vamos conferir?

preview ☆

No painel de controle do Blogger, clique em Tema e vá nas três bolinhas, escolhendo Editar HTML. Dê um clique dentro da área de código para localizar seu cursor, aperte Ctrl+F no teclado, pesquise por ]]></b:skin> e dê enter. Depois de ter encontrado, cole acima/antes disso o seguinte código:

#agenda {

font-family: 'Arial';

text-transform: uppercase;

font-style: italic;

letter-spacing: 1px;

text-align: center;

font-size: 11px; 

color: #adc0d3; /* cor da fonte da agenda */

text-shadow: 1px 1px 0 #fff;

border: solid 1px #c3d7df; /* cor da borda */

box-shadow: inset 2px 2px 0 #c8d6dc, inciso 0px 0px 5px #c8d6dc; /* sombra interna da caixa */

background: #d6e0e4;

border-radius: 4px 4px 4px 4px;

float: right;

padding: 2px;

padding-left: 4px;

padding-right: 0px;

margin: 1px;

width: 74%;

}

#data {

text-align: center;

font-family: 'Arial';

font-size: 11px;

color: #fff;

text-shadow: 1px 1px 0 #c6d9f7;

border: solid 1px #c3d7df; /* cor da borda */

box-shadow: inset 2px 2px 0 #c8d6dc, inciso 0px 0px 5px #c8d6dc; /* sombra interna da data */

background: #c3d7df;

border-radius: 8px 2px 2px 8px;

float: left;

padding: 2px;

text- align: center;

margin: 1px;

width: 16%;

-webkit-transition-duration: .80s;

}

Altere as cores nos códigos em negrito e salve. No painel de controle do Blogger, clique em Layout, adicione um gadget HTML/JavaScript e cole o seguinte código:

<div id="data">00/00</div><div id="agenda">title</div>

Repita o código acima quantas vezes for necessário. Prontinho, é só isso. O que acharam do modelinho? Volto em breve com mais utilitários para vocês. Até lá, se cuidem e fiquem bem.