Caixa de boas vindas - PF

 

Oiii, gostaram do novo layout??? 

eu espero que sim, deu muito trabalho para fazer esse layout estilo kawaii world, eu amava esse estilo e eu consegui fazer, então deem créditos a ela ok??? 

vamos la para o tutorial clica em leia mais~~

Faça aquele trajeto que você já conhece bem: Painel de Controle > Modelo > Editar HTML e procure por ]]></b:skin> e acima dele cole o seguinte código:

/** by extras-placefame **/

.boxwelcome {

background: #f5f5f5; /** cor do fundo **/

-webkit-box-shadow: inset 1px 1px 1px 0 #c7c7c7;

-moz-box-shadow: inset 1px 1px 1px 0 #c7c7c7;

box-shadow: inset 1px 1px 1px 0 #c7c7c7;

font-size:85%; /** tamanho da fonte **/

font-family:georgia; /** fonte do texto **/

text-shadow: 0px 1px #DCDCDC; /** sombra do texto **/

color:#707070; /** cor do texto **/

margin:5px; /** espaçamento externo **/

padding:8px; /** espaçamento interno **/

text-align: justify; /** texto alinhado **/

-webkit-border-radius: 5px; /** bordas arredondadas, caso queira retirá-las apague essa e as duas linhas seguintes **/

-moz-border-radius: 5px;

border-radius: 5px;

}

/** links do box **/

.boxwelcome a {

background-color:#EEE0E5; /** cor do fundo do link **/

color:#707070; /** cor do texto **/

text-shadow:0px 1px #fff;  /** sombra do texto **/

padding: 2px;

padding-left: 4px;

padding-right:4px;

text-transform:uppercase;

font-size:80%;

-webkit-border-radius: 3px;

-moz-border-radius: 3px;

border-radius: 3px;

-webkit-transition: all 0.5s ease-out;

-moz-transition: all 0.5s ease-out;

transition: all 0.2s ease-out;

-webkit-transition-duration:.50s; }

.boxwelcome a:hover {

background-color:#CDC1C5; /** cor do fundo do link ao passar o mouse **/

color:#fff; /** cor do link ao passar o mouse **/

text-shadow:0px 0px #fff;

-webkit-transition: all 0.5s ease-out;

-moz-transition: all 0.5s ease-out;

transition: all 0.2s ease-out;

-webkit-transition-duration:.50s; }

Salve e logo em seguida vá até Layout e adicione um novo gadget > HTML/Javascript e cole o código abaixo:

<div class="boxwelcome">Oi! Escreva seu texto aqui nessa caixa, ela se ajustará automaticamente ao tamanho da sidebar do seu <a href="/">blog</a>. Blá, blá, blá.</div>

Espero que vocês tenham gostado. Super beijo.