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:
Apague-o e cole no lugar:
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:
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 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
Meu Deus que blog lindo, seguindo.
ResponderExcluirótimo tutorial, esses tutoriais explicados assim são ótimos.
● Adolescente Nerd // Oficial {♥}
Ownt, muito obrigada :33
ExcluirEu amo seu blog é tudo tão diwo aqui sabia??!Psé pura verdade!
ResponderExcluirEu tenho preguiça de fazer o meu própio heuheuehuehu'~
Beijokas ;3 ,
Meninas de Atitude
Sério? Eu olho outros blogs e penso "ah se meu blog fosse assim". ahuah fico feliz que as pessoas gostem do meu lay :))
Excluirbjs :3
Ótimo tutorial, lindo blog (Hayley diva haha)
ResponderExcluir- blogthistime.blogspot.com
Obrigada >< Também gosta da Hayley? *^*
ExcluirÓtimo tuto!
ResponderExcluirW-assup
Haha, obrigada (:
ExcluirOdeio chuva. Tirei 10 em história também, uahsdujasdh toca ae o/
ResponderExcluirAmeio o tutorial, bem explicado, com certeza ajudará muitos iniciantes.
Beijos ~
winter--html.blogspot.com
\o\ obigada :3
Excluirbjs~
eu também odeio chuva, e sou apaixonada por historia e já tirei 10 em historia também
ResponderExcluiramei seu blog já estou te seguindo
http://mundorealdegarota.blogspot.com.br/
ashuahsu o/
ExcluirParabéns pelo tutorial, e ah, não gosto de dias chuvosos, me desanimam.
ResponderExcluirhttp://papodemeninasaer.blogspot.com.br/
obrigada (: dias de chuva são horríveis ):
ExcluirBom Tutorial, e bem explicado ajudará bastante os iniciantes em seus layout´s <33
ResponderExcluirworldofthel.blogspot.com.br
Haha obrigada ;3
ExcluirAdorei seu blog!! super divo >< paramore <3 seguindo seu blog ><
ResponderExcluirobg pela sua visita lá no blog,beijos.
Choconut
Obrigada obrigada <3 paramore *^*
ExcluirBem facinho essa parte , as outras são meio complicadas mas vai ficar lindo! explica muito bem
ResponderExcluirhttp://euamotutoriais.blogspot.com.br/
haha vdd :x obrigada ><
ExcluirMuito útil a dica *-* amei ! Obrigada por sua visita ao meu blog...Gostei muito do seu :3 Já até estou seguindo rsrsrs :3
ResponderExcluirQuando puder dá uma passadinha no meu blog, tem post novo lá, convido você e seus leitores a darem uma conferida *u*
Beijocas de Morango!!! ❣
http://sorriso-jovem.blogspot.com.br
Obrigada por seguir <3 vou ir sempre lá o/
Excluirvou dar uma olhadinha, talvez eu participe u.u
ResponderExcluir' Quando entrei na blogosfera, também era assim, e acho que sou até hoje ahuahuah sempre procuro tutoriais assim, muito útil :3
ResponderExcluir~ Beijos ;*
cantinhodaslovelys.blogspot.com.br
Que legal o post, Hay!
ResponderExcluirLogo que criei meu primeiro blog, não sabia nada de html mas, com a ajuda de alguns blogs (o Cherry Bomb me ajudou muito!) consegui fazer uns ajustes aqui e ali. Espero que a maratona ajude muitos blogueiros iniciantes ;)
Beijos ♡
World Cutest | Twitter do blog | Twitter pessoal
adorei este big tutorial muito bom..........adorei visitar>>bjo<>
ResponderExcluirhttp://louca-por-html.blogspot.com.br/
Adorei o seu blog querida, tudo muito bem feito por aqui,ótimas postagens e fotos querida ^^
ResponderExcluirAdoro blogs com esse assunto.
Tenha certeza que irei indicar o seu blog para as minhas leitoras e amigas.
Também sou blogueira do Não Vivo Sem Esmaltes, um blog que fala sobre maquiagem, perfumes, cosméticos e tendências.
BEIJOOOS
JÁ ESTOU SUPER SEGUINDO AQUI, SE VOCÊ QUISER VISITAR E SEGUIR O MEU BLOG TAMBÉM:
WWW.NAOVIVOSEMESMALTES.COM
Super curti o tutorial!
ResponderExcluirAmo todo esse tipo de dicas :)
Seguindo aqui amore!
Beijinhos
Rubia =^.^="Unhas de Gato "