Super Tutorial: Fazendo um layout desde o início

Há algumas semanas atrás a Giulia - dona do blog Ladies on the Shelf - pediu um tutorial de como fazer um layout desde o início, e eu fiquei doidinha porque sou muito ruim em dar explicações (haha) e esse é um tutorial grande e - pra mim - complicado de fazer, mas ai está ele e eu espero que vocês entendam e comentem. 



1. Vá em Design > Design do Modelo > Modelo > E escolha um layout do template Viagem




2.Agora vá em Plano de Fundo e remova-o




3.Agora escolha um modelo de layout para ser trabalhado



4. Agora vá em Ajustar Larguras e ajuste conforme a imagem abaixo.



5. Em Avançado mude a cor do plano de fundo conforme a imagem abaixo.




6. Agora mude a cor do plano de fundo da postagem para branco




Pronto. Agora que você já tem a base é hora de organizar o blog.


Edições: 


Retirando borda do template viagem: 




Vá em Design > Editar HTML > CTRL + F e procure por : .content-outer .content-cap-top {  
        
E apague tudo que estiver dentro do retângulo vermelho, visualize e salve






Colocando Background no blog: 




Vá em DesignEditar HTML > CTRL + F e procure por: body {

Vai aparecer:

body {
  font: $(body.font);
  color: $(body.text.color);
  background: $(body.background);

Substitua a última linha por: background: url("URL do background") repeat; }

Faça as modificações, visualize e se estiver tudo certo salve.




Barras laterais: 

Colocando duas barras laterais: Siga este tutorial

Barra lateral dividida por gadgets e com efeito: Siga este tutorial

Barra lateral dividida por gadgets: Siga este tutorial


  • A partir daqui as modificações são pequenas, mas são as que fazem a total diferença no blog e fazem ele ganhar vida. Vou deixar algumas indicações de tutoriais para vocês.

13 comentários:

  1. muito bom o tutorial carvalho >3

    Os iniciantes que tem tanta dificuldades vão gostar bastante ^^

    http://garotoonerd.blogspot.com.br

    ResponderExcluir
  2. AAI Amanda, obrigada meesmo por fazer este tutorial, agradeço muito que tenha realizado meu pedido, quero aprender, e tem um básico que sei, tipo, não fico muito perdida no html, kkk , mas quero fazer minhas bases, então, muito obrigada, vai ajudar muito o tutorial ^^

    ResponderExcluir
  3. Ótimo tutorial, simplesmente tem gente que não consegue achar bons tutoriais para fazer seu próprio layout ou não consegue entende-lo, ai aqui já tem um tutorial bem explicadinho!
    Sim, eu gosto de k-pop, semana que vem vou fazer postagem sobre Girls' Generation e na ultima semana vou fazer uma postagem sobre música de k-pop para animar festas! xD
    http://lehdadicas.blogspot.com

    ResponderExcluir
  4. Gostei muito do tutorial. Eu costumo ter dificuldade mesmo só na hora de escolher o modelo,porque o blogger tem modelos muito limitados. Só gosto mesmo é do modelo viagem.
    Ah,visitei o tutorial sobre menu deslizante,é complicadinho mas fica lindo.
    http://desconstruindoaspalavras.blogspot.com.br/

    ResponderExcluir
  5. Oi!! Aqui é o nicolas do dicas blogspot!!! Tu não tem link me né?? Vou colocar seu link como parceiro la o blog ok??^^
    Um abraço!!

    --> dicasblogspot-db.blogspot.com

    ResponderExcluir
  6. Amei a dica, to realmente precisando mesmo *-*
    http://themudancas.tk/

    ResponderExcluir
  7. Maravilhoso, gostei muito! Novo post comenta? http://dicasdeblogsemais.blogspot.com.br/2012/05/descricao.html

    ResponderExcluir
  8. adorei o tutorial, espero que ajude muita gente o/
    beijos
    bom domingo
    Amy - Macchiato

    ResponderExcluir
  9. Bota super nisso!
    http://www.vitrola3000.blogspot.com/

    ResponderExcluir
  10. Olá Amanda, passando pra dar aquele oi. Adorei o blog!

    ResponderExcluir
  11. Adorei a postagem , isso concerteza vai me ajudar muito com o novo desing que pretendo fazer pro meu blog , bjus ><
    -
    http://obscure-alternative.blogspot.com.br/

    ResponderExcluir
  12. Nossa que super tutorial!!
    vou até coolocar no favoritos aqui pq eu sou meia lerda pra html...
    =/
    adorei o blog a propósito!
    =D
    bjim e boa semana!

    ResponderExcluir
  13. Ameeeei muito seu site ele é todo lindo todo perfeitinho, tambem tenho um blog e sou iniciante, gostaria que voce desse uma olhada nele e desse sua opniao http://daoradesign.blogspot.com.br/ obrigada desde ja e beijos linda;

    ResponderExcluir