Google+ minha casa, meu mundo: Como customizar seu layout

27 de abril de 2010

Como customizar seu layout

Meu blog está de cara nova e eu estou imensamente feliz com o resultado.
Fiz tudinho sozinha, dá para acreditar?
Já me pediram para ensinar como fazer... como tudo na vida eu faço as coisas na cara e na coragem, vou tentando e se não dá certo começo tudo de novo, então vou tentar contar como fiz, se der errado não me responsabilizo, hehehe...
Durante muito tempo eu trabalhei no layout do blog mexendo no "tal" do HTML, naquela abinha "Editar Html", e não recomendo, é mais difícil que aprender o tal do photoshop... mas com o tempo fui me acostumando com aquela sopa de letrinhas e hoje eu consigo "ler" um template com bastante facilidade.
Mas o fato é que o blogger resolveu ajudar (e muito nossa vida) e está cada dia mais fácil customizar nossos templates a vontade e sem ter que mexer na tal sopa de letrinhas.
Então vamos lá:

1. Para fazer de um jeito fácil é preciso trabalhar no blogger em rascunho.
Não sabe o que é isso?
Abra seu Painel e lá no rodapé vai ter um link Blogger em Rascunho, basta clicar que no cabeçalho do Painel vai aparecer uma aba "Tornar o blogger em rascunho meu painel padrão", clica no quadradinho que tem na esquerda. Pronto.

2. Ainda no Painel, clica na aba Layout.

3. Peloamordedeus, ANTES de mexer no seu layout salve aquele que está usando. Se der tudo errado, ao menos você consegue voltar ao que tinha antes...
Na aba Layout clique em "Editar HTML".
Sobre a caixa do HTML tem uma abinha "expandir modelos de widgets", clique no quadradinho. NÃO ESQUEÇA DISSO.
Procure o link "baixar modelo completo", clique aí , baixe seu modelo e salve no seu PC!!!

4. Vá em "Escolher Novo Modelo"
Clique em Mínima.
SALVE

5. Vá em "Designer do Modelo". Agora começa a brincadeira. O meu template eu fiz como vou explicar, mas você pode escolher uma infinidade de outras possibilidades.
Clique na aba MODELO e escolha SIMPLE -
Clique APLICAR AO BLOG
Clique na aba PANO DE FUNDO e escolha SEM IMAGEM
Clique APLICAR AO BLOG
Clique em LAYOUT
Depois LAYOUT DO CORPO - escolha a distribuição que te agrada, 2 ou 3 colunas, etc e tal
Escolhe? Aplicar
Vá em LAYOUT DO RODAPÉ e escolha.
Aplicar
Vá em AJUSTAR LARGURA. O meu tem três colunas, e as medidas são:
*Todo o Blog: 1000 px
* BArra Lateral Esquerda: 210 px
* BArra LAteral Direita: 200px
Mas você pode mexer conforme o layout que escolheu. Visualize enquanto faz e escolha o que fica melhor.
APLICAR.
Clique AVANÇADO. Aqui é super divertido...
Vá clicando em todas as possibilidades para modificar cores e fontes. Não esqueça de APLICAR, senão não salva suas modificações.
IMPORTANTE: para ficar com o fundo branco como o meu, vá em PLANOS DE FUNDO e deixe branco o PLANO DE FUNDO EXTERNO E O PRINCIPAL. O PLANO DE FUNDO DO CABEÇALHO deixe transparente.
APLICAR
Eu não adicionei nenhum CSS.

5. Imagens (cabeçalho e plaquinhas das barras laterais):
Eu criei as imagens no photoshop, mas é possível carregar qualquer imagem, desde que com as medidas corretas.
Para acertar as medidas dá para usar o Microsoft Office Picture que vem com seu PC. É um editor bem simples e dá para fazer o básico. Abra a imagem, vá em IMAGEM e depois REDIMENSIONAR.
O cabeçalho tem 1000 X 217 pixels
As plaquinhas têm 171 X 71 pixels

6. Adicionar cabeçalho:

Ainda na aba LAYOUT vá em ELEMENTOS DE PÁGINA. No cabeçalho clique em EDITAR. Vai abrir uma nova janela. Clique em "em vez de título e descrição" e "redimensionar". Carregue a imagem que está salva no seu PC (não está? então faça isso). Salve.

7. Adicionar imagens na barra lateral:
Em elementos de página clique em ADICIONAR UM GADGET. Vai abrir uma nova janela. Nesta janela procure por IMAGEM e clique, daí é só carregar a imagem que você salvou. Depois arrume os gadgts como quiser.

Fácil né?

Beijos

Lu

38 comentários:

  1. Duplo parabéns, Lu! Pelo resultado de todo esse trabalhão, que ficou lindo!, e pela paciência e dedicação em repassar o PAP tão minuciosamente (outro trabalhão, não é?)Vamos ver se uma hora dessas me encorajo. Obrigada! Beijo

    ResponderExcluir
  2. Muito legal, Lu. Ficou ótimo, super clean. QQ hora vou tentar fazer , adoro mexer nessas coisas, mas morro de medo de mudar tudo...rs
    Obrigada por compartilhar.
    Bjsssssssss

    ResponderExcluir
  3. nossa!!!!! que bicho é esse de 7 cabeças????
    sera que aprendo ainda??....rs qualquer hora vou tentar ,porque o meu esta feinho.e dificil de postar.

    beijossssss

    ResponderExcluir
  4. Oi Lú vivo no seu blog! Adoroooo muito! Eu queria muito saber como vc adicionou o menu? Já tentei de tudo mas não consegui. Visite meu blog www.mycraftemporium.blogspot.com

    ResponderExcluir
  5. Oi Lu, amanhã, com calma e desperta, vou ler tudinho e tentar fazer no meu.
    Parabéns pela iniciativa e por nos passar o pap tão minucioso!
    Beijosssssss!

    ResponderExcluir
  6. Lú, vc é DEMAIS!!!!!!!!
    Generosa e coisa mais querida!
    Bloguito ta lindo!
    To pensando em modernizaro o meu tb!
    O que é CSS? Só pra começar pelo básico, pq essa tua aspirante é quase analfa, viu?!! hehehe
    bjoaksssss

    ResponderExcluir
  7. UAU! Muuuuuuuuito obrigada pelas dicas!
    Eu tb vivo tentando entender o tal do HTML, mas consigo pouquíssima coisa.
    Agora, quando você conseguir colocar a caixa para comentários no corpo do post você me ensina???
    :)

    ResponderExcluir
  8. Lu,Gostei muito da sua casa nova,quando conquistamos algo por nossa própria conta a alegria é enorme é um sentimento de que podemos abraçar o mundo,né?!Beijos ficou muito bom.
    Carla.

    ResponderExcluir
  9. Ôoo meu Deus! Vou ter que fazer como vc: estudar muito para aprender isso!
    Vivo tentando mexer no meu mas ainda não tive sucesso com nadica de nada...
    Obrigada pelo PAP, vou tentar por ele agora!
    Bjs

    ResponderExcluir
  10. Lu, e como é que faz pra colocar embaixo do post esses "quadradinhos" pra posts passados?

    Bjão,
    Caty =**

    ResponderExcluir
  11. Lu....
    Acho que você leu meus pensamentos....
    Estou querendo mudar a cara do meu blog, que tadinho..anda tão caidinho....
    Vou ler com calma e tentar fazer o seu passo a passo...
    Obrigada por compartilhar conosco...
    Depois venho e mostro como ficou...
    bjs

    ResponderExcluir
  12. Ficou legal,mas senti falta de cor,de algo meio vintage,que é sua cara!!!!! bjus CIDINHA ARAUJO

    ResponderExcluir
  13. Este blog está irreconhecível, cada vez que passo por aqui, tem uma novidade!!
    Tá se achando né? Isso mesmo! Você tá podendo!
    Vou aproveitar as dicas e melhorar o meu, assim que puder, como disse antes, vc sempre me ajuda, de alguma forma, obrigada!!
    Bjs

    ResponderExcluir
  14. Vou tenta fazer! Muuuito obrigada.
    Beijos.

    ResponderExcluir
  15. Lu...
    Eu de novo !!!!
    Segui seu PAP e consegui...
    Ainda farei alguns ajustes, mas AMEI
    Obrigada mais uma vez
    beijo grande

    ResponderExcluir
  16. Olá!

    Antes de mais, os nossos Parabéns pelo bonito blogue que tem!

    Há já algum tempo que seguimos o seu blogue, mas depois de ler esta postagem, não podemos deixar de comentar! Muito engraçada a sua forma de escrever... hihihihi...
    Já agora, também nós fomos modificando o nosso blogue com a técnica do "tentativa-erro"... e No fim de uma fase de grande stress e dor de cabeça... Ficámos tão orgulhosas do resultado final...e umas craques nisso do HTLM... hihihiheheheh =).

    Continuação de bom trabalho!

    bjinhos de Portugal!

    Feltro & Companhia!

    feltroecompanhias.blogspot.com

    ResponderExcluir
  17. É por isso que "eu te sigo" kkk
    Aliás, você sabe que eu me aventurei nesse mundo "bloguístico" de postar comentários por sua causa!
    Valeu !
    Vou,finalmente, modificar o meu modestinho bloguinho !!!
    bj, obrigada
    Adriana Muylaert

    ResponderExcluir
  18. Tá lindo o blog Lu...vc já tinha me dado umas dicas, mas essas,hein? Muito especiais...se eu conseguir depois te conto!
    Beijos
    Cae

    caefernandes.blogspot.com

    ResponderExcluir
  19. Parabéns, ficou muito legal, e fácil de achar as coisas...Nossa trabalho com Corel e Photoshop, mas nada se compara a mecher com html, acho muito difícil.
    Parabéns pela paciencia e a criatividade.
    Quando tiver um tempinho da uma olhada no meu blog, estou tentando manter o meu...BJ
    http://jaqueline-cunha.blogspot.com/

    Obs: não repara pq o meu blog é de iniciante, rsrsrs

    ResponderExcluir
  20. Amei, amei, amei seu blog! Já estou seguindo para acompanhar sempre suas novidades! Obrigada por compatilhar tantas coisas legais! Deus te abençoe, bjss

    ResponderExcluir
  21. Parabéns pelas mudanças, e especialmente, pela dedicação de passar tudinho pra nós... você é um amor...
    tenho medo de começar e fazer besteira... mas vou tentar....
    beijos
    telma linhares

    ResponderExcluir
  22. Amei a sua dica! Há um tempão queria mudar o layout do meu blog, mas não sabia como mexer pelo tal html! Vou me aventurar neste final de semana!! :)

    ResponderExcluir
  23. Lu,parabéns!!!! Ainda estou sem coragem de enfrentar esta maratona toda...quem sabe outro dia,rsrs.
    Obrigada mesmo!!!
    beijo

    ResponderExcluir
  24. Lu ,ia esquecendo do mais importante...ficou muito fácil de navegar na tua casinha virtual,ficou ótimo!!!!!!
    beijo da Necca

    ResponderExcluir
  25. Oi Lú!!!!

    Adorei!!!! agora vou tentar!!!! vamos ver o que vai dar!!!!!

    Bjus

    ResponderExcluir
  26. Lu!!! Impressionante!! Seu blog é uma caixinha de surpresas e uma melhor que a outra! Nem acreditei quando vi essa postagem! Corri tentar fazer e meu blog já está com outra cara. Fiz uma postagem falando de você, tudo bem?? Não tinha como te agradecer só por aqui!! Muito obrigada!!
    Se quiser espiar está em www.umcoracaodemae.blogspot.com

    ResponderExcluir
  27. Lú,também mudei meu blog, mas confesso...com a ajuda de meus filhos!!Estes nomes estranhos me assustam ,até me arrisco a mexer e fazer mudanças, mas, outro dia,perdi todos os blogs da lista de blogs que gosto de visitar!!Fiquei muito triste, mas meu filho me salvou!!Obrigada oelas dicas, quem sabe me arrisco mais!!Beijos!!!

    ResponderExcluir
  28. Olá, Luciane !!

    Há tempos te visito, mas agora estou te seguindo...seu blog é xhow! Parabéns! Moro aqui em Curitiba também! Que delícia conhecer pessoas que tem a paciência de nos ensinar !! Menina, vou ter que estudar a sua explicação...com tempo...senão a minha "loirice" não me deixa entender...com pressa não, né?
    Tô linkando teu blog lá no meu!
    Quando puder passa por lá pra uma visitinha,tá? Será um prazer recebê-la!
    Beijocas
    Helena Garcia
    http://diaadiacorridinho.blogspot.com

    ResponderExcluir
  29. Lu Parabéns pelo novo layout, tá lindão!!!!
    Vc como sempre inovando e repassando informações!
    Vc é uma querida mesmo.

    Mostrei as fotos do Atacama pro meu maridinho e ele ficou encantado...me propôs para irmos até lá....AMEI =)

    Bjs bjs bjs

    ResponderExcluir
  30. Amei de paixão, já faz um tempão que eu tentava mudar a cara do meu glog e não conseguia sair do canto.Obrigada, obrigada, mil vezes obrigada....
    Beijos........

    ResponderExcluir
  31. Oi ´Lú ... sou blogueira a bem pouco tempo , e tudo pra mim é novidade. Tenho feito alguns progressos ao passo de tartaruga, e também consegui mudar a cara do meu a dois dias se você quizer visitar esse blog lá tem tudo ,(http://gifspintando-o-sete.blogspot.com/2010/04/layout-para-seu-blog.html ) cada fundo lindo , agora se você souber como é que eu consigo colocar uma coluna na lateral para postar as promoções de outros blogs me ensina até hoje não consegui .bjo e muita Luz. Obrigada vou tentar também do seu jeito usando o rascunho

    ResponderExcluir
  32. Olá Amiga Lu!
    Seu blog está lindo!!!!!!Obrigada pelas dicas!!!
    Já estou te seguindo. Quando tiver um tempo venha me visitar. Sua opinião é muito importante para mim.
    Bjossssssss

    ResponderExcluir
  33. OLÁ muito prazer, tenho q te agradecer e lhe dar os parabens, muito dificl alguem ajudar assim da forma gentil q vc ajudou com essa dicas..vou te seguir sempre, q lhe encher de adimiraçoes pq vc simplesmente é uma pessoa maravilhosa.. dividindo com a gente a sua descoberta..tenho q falar que existem pessoas q ve q vc é inexperiente e nem ajuda, se a acha a ultima batainha do saco, mas vc foi um maximo nos dando essa dica..olha q eu consegui mexer pq foi super facil a sua explicaçao. muito obrigada querida mil beijokas q papai do ceu lhe abençoe sempre

    ResponderExcluir
  34. Esse post é de uma ajuda absurda! quebro muito a cabeça pra mexer nessas coisas e até consigo um progresso, mas nada assim! rsrs...Tô querendo colocar 3 colunas no blog, o background até já é de 3, mas não consegui dividir isso no lay out...mexendo nas dimensões como vc falou eu consigo?

    Tô seguindo...depois eu volto pra explorar cada cantinho desse blog! mas super-parabéns e obrigada por esse post.

    Beijo!

    ResponderExcluir
  35. AMEI AS DICAS!!!
    O MEU JÁ ESTÁ DE CARA NOVA! ANTES EU NEM IMAGINAVA COMO... hehehehe
    Muito obrigada pela dica!!!
    BJS

    ResponderExcluir
  36. Parabéns, pelo seu blog. Consigui mudar a apraencia do meu blog com a indicação desse blog por minha amiga, porque se num tivesse sida ela e esse blog eu não tinha saido do lugar. #)

    ResponderExcluir
  37. Já sou sua fã!!!
    Alguem finalmente me ajudou a mudar a cara do meu blog!!!!!
    Suas dicas foram ótimas e realmente foi bem fácil mudar.
    Obrigada!
    Renata

    ResponderExcluir

Obrigada pela visita!

LinkWithin

Related Posts Plugin for WordPress, Blogger...

ShareThis