✘ Fazendo seu template: Parte I

So what are you gonna do when the world don't orbit around you?

Hey lindos e lindas :3

Hoje o dia está chuvoso, e eu chorosa. O fato é: Eu odeio dias de chuvas,  fico deprimida, jogada pelos cantos, me dá vontade de não sair da cama, mas aqui estou eu. Tirei 10 na prova de história, e isso foi o suficiente para me animar e me tirar da cama, embora lá no fundo da minha áurea inspiradora (sqn) algo me fala subitamente para voltar para a cama e dormir mais um pouco. Hoje estou meio poética, não?

Resolvi fazer um tutorial de como fazer um layout. Quando comecei com meu primeiro blog, demorei séculos para achar um tutorial. A maioria eu não entendia nada, tudo muito complexo e complicado. Então eu resolvi fazer esse tutorial. Já vou avisando que não vou postar tudo de uma vez. Vou postar uma parte em cada dia, e por meus cálculos, provavelmente vou dividir em 4 partes. As partes vão ser um pouco longas, até porque eu não tenho o tutorial de todas as coisas no blog, eu vou ter que passa-los para vocês e quero que fique tudo bem explicado.  Não é complicado, mas se você não ter força de vontade e se você não ser bem atento, seu template vai ralo abaixo. Vamos começar?

Vamos começar do zero, ou algo pode dar errado. Vá em modelo > Personalizar e selecione o modelo travel/viagem (que é mais ou menos o "padrão" que os blogueiros usam) com a variação dois, que é esta com o x marcado.

Depois vá em plano de fundo e coloque um de sua preferência (eu usei este aqui) e salve. Agora que colocamos o background, vamos tirar a bordinha feia, que é esse fundo tipo um papel amassado. Para isso, vá em modelo > editar html e procure por .content-outer .content-cap-top { abaixo dele, vai ter um código assim:

.content-outer .content-cap-top {
  height: $(content.imageBorder.top.space);
  background: transparent $(content.imageBorder.top) repeat-x scroll top center;
}
.content-outer {
  margin: 0 auto;
  padding-top: $(content.margin);
}
.content-inner {
  background: $(content.background);
  background-position: left -$(content.imageBorder.top.space);
  background-color: $(content.background.color);
  padding: $(content.padding);
}

Apague-o e cole no lugar:

.content-outer .content-cap-top {
  height:
  background:  repeat-x scroll top center;
}
.content-outer {
  margin: 0 auto
}
.content-inner {
  background:
  background-position:
  background-color:
}

Visualize e salve. Depois de fazer tudo isso, seu template deve estar assim:

Agora vamos colocar o fundo das postagens. Vá em modelo > personalizar > avançado > Plano de fundo da postagem e escolha a cor. Eu recomendo branco, afinal em todos os layouts o fundo é branco, tirando os escuros, mas o objetivo aqui é um layout claro. Salve. Agora faça uma postagem de teste. Coloque imagem, link, blockquote, sublinhado, negrito, enfim, tudo. Se você seguiu todos os passos, seu template deve estar assim:

Agora vamos remover a navbar, que é essa barrinha no topo do blog. Para isso vá em layout > navbar > desativado > salvar e você vai ver que a navbar vai desaparecer, assim:

Agora finalizamos a primeira parte, e amanhã vou postar a segunda. Espero estar ajudando os iniciantes com html. De primeira parece um bicho de sete cabeças, mas na prática é tudo muito simples >< 

Qualquer dúvida, deixe um recado nos comentários ou na minha ask :3