Postagem atualizada dia 23/08/2013 as 21h07Oi, gente! Eu ainda nao acredito que fiquei uma semana sem postar nada. Essa semana simplesmente passou voando!, e, ah, lhes desejo um Feliz Natal super atrasado. E, atendendo a pedidos, vou ensina-los como dividir os gadgets que nem daqui do blog, antes de comecar so quero avisar que eu o aprendi ele visitando o blog da Karol, o Material Extra. Um tutorial super facil, rapido, e super util!Primeiramente va ate Design > Editar HTML, procure (F3 ou Ctrl+F) por /* Widgets. Devera aparecer um codigo mais ou menos igual a esse:/* Widgets----------------------------------------------- */.sidebar .widget {border-bottom: 2px solid $(widget.border.bevel.color);padding-bottom: 10px;margin: 10px 0;}Dentro das chaves, acrescente mais o codigo que divide a coluna, deixando a cor somente em cada gadget: background-color: #COR_HTML; nao sabe que cor usar? Consulte a tabela de cores HTML. Devera ficar da seguinte maneira:/* Widgets----------------------------------------------- */.sidebar .widget {border-bottom: 2px solid $(widget.border.bevel.color);padding-bottom: 10px;margin: 10px 0;background-color: #COR_HTML;} Visualize, e, se estiver tudo certo, salve!Caso voce nao achar esae codigo, copie ele e cole acima de ]]</b:skin>. Espero ter ajudado a quem pediu e a quem estava procurando por esse tutorial! Beijos!P.S.: Tem muita gente perguntando como divide a coluna da postagem, o modelo do Blogger que eu editei ja veio assim, mas vou tentar fazer um tutorial pra voces, ok?[jeito-inedito.blogspot.com] [onthefame.blogspot.com] [otherthingsattitudeincluded.blogspot.com] [paradateen1.blogspot.com] [ninas-top-stardoll.blogspot.com] [justdebee.blogspot.com] [goimagines.blogspot.com] [paraisodemenina.blogspot.com] [amantesdophotoscape.blogspot.com] Oi, gente! Tudo bom com voces? Hoje vou ensinar a voces como se faz esse efeito no gadget de afiliados. E simples, fofo e pode ser usado para varios outros elementos de pagina. Va ate Design > Editar HTML, e procure (F3/Ctrl + F) por ]]></b:skin>. Acima dela, cole o seguinte codigo:.afiliados {opacity: 0.7; -webkit-transition: 0.5s;border-radius:15px;width: 50px;height: 50px;text-align: center;}.afiliados:hover {opacity: 1.0;}Agora entenda:ESTADO "NORMAL"opacity: 0.7; Opacidade em 70%, no estado normal, sem passar o mouse.-webkit-transition: 0.5s; Tempo da transicao.border-radius: 15px; Bordas arredondadas.width: 50px; Largura da imagem dos afiliados.height: 50px; Altura da imagem dos afiliados.text-align: center; Alinhamento das imagens.ESTADO HOVERopacity: 1.0; Opacidade em 100% (normal), ao passar o mouse.Agora salve, e em seguida se direcione a Design > Elementos da pagina. Clique em "Adicionar um Gadget", e escolha a opcao HTML/Javascript. E acrescente o seguinte codigo:<a href="http://URL.com" title="Titulo da imagem"><img src="LINK_DA_IMAGEM" class="afiliados"/></a>Para acrescentar mais imagens, va duplicando o codigo. Espero que tenha ajudado voces! Beijos! Oi gente, resolvi dar um alo pra voces e trazer um tutorial simples. Eu atualizei as paginas e adicionei um novo gadget ~simples de aviso ja com um recado pra voces lerem e/ou "darem uma olhada". Vou ensina-los a deixar o mural de avisos/recados desse jeito fofinho. Vamos?Veja o exemplo aqui ou no topo direito da pagina (1o gadget)Passo 1: Va no HTML do seu blog e acima da tag ]]></b:skin> cole o codigo abaixo e salve..boxwarning {background:#f5f5f5; /** cor de fundo **/margin:5px; /** espacamento externo **/padding:8px; /** espacamento interno **/text-align:justify; /** alinhamento do texto **/position: relative;z-index:1;overflow:auto;height:90px; /** altura do quadro **/border:1px #707070 dotted; /** espessura, cor e tipo da borda **/-webkit-transition:0.3s;color:#707070; /** cor da fonte **/}.boxwarning:hover {color:#ffffff; /** cor da fonte ao passar o mouse **/border:1px #2f8ccd dotted; /** espessura, cor e tipo da