Tutorial: Personalizando o topo no template Little Things | Follow your dreams
Freebies

Tutorial: Personalizando o topo no template Little Things

No último post disponibilizei um template para download grátis, desde então estou recebendo algumas dúvidas sobre como personalizá-lo. No post de hoje vou ensiná-los a criar um topo mais bonito, já que o padrão é bem simples e apresenta apenas o nome do blog. Esse é o meu resultado:

 

1 – O primeiro passo é criar a imagem que será o topo, faça isso no programa de edições que desejar, eu utilizo o Adobe Photoshop. A imagem deve ter obrigatoriamente 930pixels de largura, a altura fica à critério.
O meu topo ficou assim:

 

Dica: se a sua imagem tiver fundo transparente (como a minha) salve-a no formato PNG, assim o fundo permancerá transparente e não será substituído por um fundo branco como acontece quando a imagem é salva em JPEG.

2 – Com a imagem criada, vá no painel do blogger, em LAYOUT. Clique para editar o Cabeçalho, widget com o nome do seu blog.


3 – Desmarque a opção “Reduzir para ajustar” caso ela esteja marcada. Em “Imagem” faça o upload do topo que você criou. Em “Posicionamento” deixe marcada a opção “Em vez de título e descrição”. Salve.

4 – O topo já deve estar aparecendo no seu blog, porém, deve estar com muito espaço acima e abaixo dele, como ficou o meu:

 

Para corrigir isso, vá no painel do seu blog, em MODELO. Clique para editar o modelo HTML do seu template. Procure pelo trecho:

.headerarea {

 

Atenção: No novo modelo do blogger você só deve abrir a barra de pesquisa (Ctrl + F) após clicar dentro da caixa de códigos, caso contrário a sua pesquisa não apresentará resultados. A caixa de pesquisa deve aparecer assim:

 

Ao encontrar o trecho pesquisado você deve ver isso:

 

Dentro da propriedade “margin”:
– Modifique o 1º valor para o espaço ACIMA do topo.
– Modifique o 3º valor para o espaço BAIXO do topo.
Quanto maior o valor, maior o espaço.

Vá clicando em “Visualizar modelo” para checar as mudanças e se estiver como você queria, é só salvar e conferir o resultado no seu blog.

 

Curtiram? O que mais vocês gostariam de personalizar no Little Things? Deixem suas dúvidas nos comentários que eu farei o possível para ajudar! ;)

Um beijo! ♥

31 Comentários

  1. Muito lindo esse modelo, vou baixar e deixar guardado pra quando resolver mudar o meu! :) Obrigada por compartilhar!!
    Também gostei do tutorial, nunca sei mexer direito no código.
    bjs!! ^^

  2. Olá Karoline gostaria de saber como faço para diminuir a coluna de post nesse template? pois a coluna de posts esta invadindo a coluna lateral, já tentei mudar pelo modo tradicional mais não encontro os códigos.

    Espero retorno , desde já agradeço

  3. Eu adorei o template e fiz algumas modificações referente a meu gosto, mas mantendo os créditos. Só que até agora não consegui alterar a fonte do titulo da postagem e nem seu tamanho, se puder me ajudar nesse quesito ficaria grata.

  4. Olá Karoline, o seu blog é fantástico. Eu queria saber se pode fazer alguns templates em tons de rosa e azul mas clarinhos, quase como aguarelas. E se pode dar algumas dicas para novatos como por no topo, por baixo do nome do blog, uma barra com o sobre mim, contacto, categorias, etc.
    E também se pode fazer mais alguns icones das categorias também nesses cores.

    Obrigada :D

Deixe uma resposta