Oi, a maioria das pessoas sabe separar os posts e os gadgets por html. Mas eu descobri um código no Candylland onde podemos separar isso só adicionando um novo "html/javascript" Eu peguei o código base desse blog mas personalizei à minha maneira. Os códigos, além de separarem os posts/gadgets também tem personalizações como fontes personalizadas, bordas arredondadas...
Para separar os gadgets
Vai ao esquema do blog, e escolhe um novo gadget "html/javascript"
Depois, cola este código lá :
<style>
/**Separação de sidebar by Cat Girl **/
.sidebar .widget {
width:100% !important;
background:#fff;
margin:10px 0 !important;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
padding:10px;
overflow:hidden
}
.sidebar .widget h2 {
background:#fee /** COR DO FUNDO DO TITULO **/;
color:#f9b /** COR DO TITULO **/;
font-size:17px /** TAMANHO DO TITULO **/;
margin-top:-10px;
margin-left:-10px;
margin-bottom:10px;
padding:5px;
width:107%;
overflow:hidden
}
/** FIM DA SIDEBAR BY Cat Girl **/
</style>
Não retires os créditos
Para separar posts
Faz a mesma coisa, com este código :
<style>
/** Cat Girl POSTS DIVIDIDOS **/
@font-face {font-family:'Salsa';font-weight:400;src:url('http://themes.googleusercontent.com/static/fonts/salsa/v3/A4KcPjUX7Ams2Jqasy0vzQ.woff') format('woff')}
.main-inner .column-center-outer {
background:transparent none !important;
_background-image: none;
}
/** post **/
.date-outer{
background:#fff;
margin-bottom:25px; /* espaço entre os posts */
padding:15px !important;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
/** título do post **/
h3.post-title a, h3.post-title{
font: normal 25px Salsa; /** fonte **/
color: #f9b !important; /** cor **/
margin-left:5px !important;
}
/** Posts dividos por Cat Girl**/
</style>
P.S- Quando separares os gadgets, vai ao designer de modelos - fundo da barra lateral - deixa transparente.
Podes personalizar as cores e tudo o que quiseres. As instruções já lá estão.
Gostaste ?
Este tutorial foi pedido por 2 leitoras há algum tempo... se quiseres pede um também :)
Hooy eu adorei o tutorial e queria perguntar se vovê pode ensinar como fez esse gadget "extras"
ResponderEliminarbeijão
caandydream.tk
de novo,ou o gadget status,estou louca para aprender...
ResponderEliminarVocê é Portuguesa, fala tão bonitinho.. *--*
ResponderEliminarbeijoos
http://euemeujardimsecreto.blogspot.com.br/
Verdade^^
EliminarTutorial perfeitooo *OO*
ResponderEliminarObrigada por retirar e desculpe a encrenca toda por causa de uma imagem, mais é só pra não ficar igual! Beijos.
Garota do Olhar Sincero || Face do blog
USEI E CREDITEI CAT! PERFEITO DEMAAAAAAAAAAAAAAAAAAAAIS
ResponderEliminarEncantos de Uma Adolescente, design novo, visite!
Exelente e útil o tutorial muito bom!
ResponderEliminarhttp://ladyalen.blogspot.com
Que perfeito *0*
ResponderEliminarÉ muito melhor do que mexer no HTML, sério, você faz coisas perfeitas *0*
Seguindo com certeza, mas com a conta do twitter, pois o do blogger está bugada :s
Beijos :* ~> http://gatinhomustache.blogspot.com/
Obrigado, funcionou perfeitamente!
ResponderEliminarOi estava dendo seu blog e queria saber como você colocou o cabeçalho como um plano de fundo e ainda um plano de fundo em todo o blog (esse cinza). Como você fez isso?
ResponderEliminarColoquei um plano de fundo normalmente (modelo > personalizar). O cabeçalho é png, ou seja é transparente, é por isso que fica "por cima" do plano de fundo. Espero ter ajudado :)
EliminarOi sim ajudou, mas que tamanho de cabeçalho, quer dizer plano de fundo você usou para cobri todo o blog? O que você fez para ficar no blog todo!
EliminarE mais uma pergunta, você sabe como colocar um background diferente em cada marcador do blog?
O cabeçalho é 950x300, acho eu. Quando o plano de fundo é colocado fica a cobrir o blog todo automaticamente.
EliminarNão sei, desculpe :(
Me ajudou bastante, seu blog é tão perfeito que os modelos de gadget vieram até com faixinhas :D . Obrigada!
ResponderEliminarDesculpa atrapalhar.. Mais a muito tempo, eu tava querendo e procurando Tutoriais de como colocar uma data tipo a sua. Pode ajudar? Se não puder, obrigada assim mesmo :D
ResponderEliminarEu simplesmente amo o Blog e nada aqui da errado
ResponderEliminarLiinda :)