Tutorial - Como fazer um layout básico

      Olá, meu povo. Tudo bem? Comigo está tudo ótimo, pois estou de bom humor. Meu bom humor hoje é tanto, que vim até aqui para ensinar-los à fazer um layout básico. Mas com básico, quero dizer BEM BÁSICO MESMO, pra quem quer começar do zero. Mas calma minha gente, porque eu vou postar ainda vários outros tutoriais para que vocês continuem dando uma carinha mais autêntica para ao blog de vocês.

      A primeira coisa que vamos fazer é escolher o modelo para começar o nosso layout, clicando em "Modelo" e em seguida em "Personalizar".

      Depois, escolheremos o modelo Travel(viagem). E usaremos o 2º da esquerda para a direita.

   
      Clique em "Avançado" e procure "Plano de fundo da postagem" e escolha qualquer cor, apenas para ajudar a visualizar melhor o que estamos fazendo.

      Agora é só clicar em "Aplicar".
      Clique agora em "Editar HTML" (Fica ao lado de "Personalizar"). Para tirar as bordinhas de papel do template utilize "Ctrl + F", na barrinha que aparecer cole isso: .content-outer .content-cap-top { e depois aperte enter.
      Achou o código? Ótimo! Agora apague apenas o que está destacado em rosa na imagem à seguir. Prestem atenção aos "ponto e vírgula" para não apagar nada que não deva ser apagado.

      
      Visualize, seu blog estará mais ou menos assim:

      A próxima parte é opcional. Para tirar o espaço entre a área da postagem e a barra lateral. Utilizando novamente o comando "Ctrl + F" e cole isso: .main-inner .column-right-inner {

      Apagaremos novamente APENAS o que está destacado em rosa.

      Visualize. Se estiver tudo O.K salve as alterações.

      Agora vamos até "Layout" e clique em "Editar" no cabeçalho.

      Faça o upload de uma imagem para ficar no topo do seu blog. Marque a opção "Em vez de título e descrição". Depois que a imagem carregar é só salvar.

      Agora vamos à outra parte que é opcional. Nós vamos diminuir/tirar o espaço entre a imagem do topo e a área da postagem.

      Volte para "Modelo", "Editar HTML", "Crtl + F" e cole isso: /* Tabs

      Embaixo veremos isso:

.tabs-inner {

  margin: 1em 0 0;

  padding: 0;

}

      Apague a linha destacada em rosa. "Crtl + F" e cole: .main-inner {

      Achou? Ótimo! Agora cole embaixo dele este código: margin-top: -20px;

      Agora, tudo o que você precisa fazer é alterar o número "20" por um número menor, é ir diminuindo e visualizando até ficar do seu gosto(ou até chegar à 0 rsrsrs). Caso você queira aumentar o espaço é só retirar o sinal negativo que antecede o número 20.

      Agora, salve e pronto. Mude para o fundo que quiser, as cores, as letras e tudo mais. Esse foi o layout BÁSICO. O meu ficou assim:

      Espero que tenham gostado, logo logo vou postar vários outros 'tutus' para vocês. Como por slide, paginação numerada e etc. Deixem seus comentários e dúvidas, e os tutoriais que gostariam de ver.

Beijinhos ;*