Como Fazer um layout Parte 1

Olá Gente!
Uma Leitora, que não quer que eu fale o nome me pediu, para ensinar como fazer layouts, eu irei ensinar em várias partes, algumas coisas são meio Loucas, mas depois a gente entende!

Vamos começar escolhendo o modelo. Vá em Modelo >> Personalizar. Vá na ultima categoria que é a Viagem, depois escolha o modelo Travel (azul com branco) Como mostra a imagem a baixo:

Agora vá na guia "Plano de fundo" vai aparecer a imagem que está de fundo e logo abaixo terá escrito "Remover Imagem" clique ali. Vai ficar um fundo colorido, certamente azul mas já vamos resolver isso.

Logo em seguida clique na setinha com ponta pra baixo do lado da imagem que estava no fundo, ai vá na guia "Fazer upload da imagem" é a primeira que aparece. Ali em escolher arquivo você escolhe o background que quiser. Trago uns para vocês abaixo:

Cliquem para ampliar e salvar^^

Continuando... Vá agora na guia "Layout" e escolha esse aqui:

Depois disso vá em "Ajustar larguras" e deixe a primeira em 1020 e a segunda em 265. É importante deixar essas larguras que pedi, pois isso influenciará em outros passos.

Próximo passo: 

Vá para a opção avançado e vá em Texto da página, que é a fonte, a cor e o tamanho do texto das suas postagens. 

Recomendo as seguintes cores pro texto:
(copie código por código e vá testando até achar a que mais gostar)

#969696 | #666666 | #000000

Em planos de fundo deixe as duas cores transparentes:



Pule a aba link e vá direto pra Titulo do blog e deixe a cor em transparente e o tamanho em 0px .
A intenção é o nome do blog não aparecer no cabeçalho, pois vamos por uma imagem no local mais tarde.



Agora vá em Titulo da postagem e escolha a fonte que mais gostar. Só não use cores muito claras, porque se não os seus leitores não conseguirão ler.

Vá em Plano de fundo da postagem e deixe branco:


Depois disso vá em Plano de fundo da barra lateral, que como o nome já diz é a cor do fundo da barra lateral (sidebar)


O resto eu não preciso mais aconselhar. Então você edita o que falta, no caso as cores dos links, texto e link dos gadgets etc. Mas use cores que combinem com as que você está usando. E não altere o que editamos até agora. Após isso salve.

Agora vamos personalizar o template pelo HTML.

Vamos começar retirando aquelas ondinhas feias que ficam no topo do template


Para isso vá em Modelo >> Editar HTML >> Prosseguir.
Aperte F3 e procure por:

.content-outer .content-cap-top {

Em seguida apague os trechos contornados de rosa na imagem abaixo:


Visualize e se as ondinhas tiverem  saído (veja uma imagem exemplo de como fica sem as ondinhas aqui) Salve.

Agora vamos centralizar o título do post

Vá em Modelo >> Editar HTML >> Prosseguir.
Aperte F3 e procure por:

h3.post-title {

Agora coloque o seguinte código abaixo:

text-align: center;

Vamos arredondar os cantos externos do rodapé? 

 Vá em Modelo >> Editar HTML >> Prosseguir.
Aperte F3 e procure por:

.main-inner .column-center-outer {

E logo abaixo cole:

-webkit-border-bottom-left-radius: 20px;
-moz-border-radius-bottomleft: 20px;
border-bottom-left-radius: 20px;

Depois procure por:

 .main-inner .fauxcolumn-right-outer .fauxcolumn-inner {

E logo abaixo cole:

-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-bottomright: 20px;
border-bottom-right-radius: 20px;

Gostaram?

Créditos: Death Land (Chovendo Diamante)