Como Alterar as Cores do Template no Blogger
Como alterar as cores do Template no Blogger Guia Atualizado


Como Alterar as Cores do Template no Blogger

Quer dar uma cara nova ao seu blog? Um dos primeiros passos para personalizar seu layout é trocar as cores do template. Neste tutorial rápido, você vai aprender como fazer isso usando apenas um código simples de CSS.


 1. Escolha a Cor Desejada

Antes de começar, você precisa saber o código hexadecimal da cor que deseja usar. Esses códigos sempre começam com um # e são seguidos por números e letras (ex: #000000 para preto, #ffffff para branco).

Clique aqui para acessar uma tabela de cores completa


2. Entendendo o Código

O comando que você vai usar é:

background: #000000;

Esse exemplo aplica um fundo preto. Para mudar para outra cor, basta substituir o código. Por exemplo, para um fundo branco:

background: #ffffff;

 Dica: Se o trecho de código que você quer editar já tiver background, é só trocar o código da cor, sem duplicar a linha.


 3. Como Aplicar as Mudanças no Blogger

Agora que você já escolheu as cores, siga os passos abaixo:

🔧 Acesse o HTML do seu template:

  1. Vá em Layout > Editar HTML.
  2. Antes de tudo, clique em "Baixar modelo completo" para salvar uma cópia de segurança do seu template.

 4. Onde Alterar as Cores

Aqui estão as principais áreas do blog e onde você pode mudar a cor de fundo:

 Fundo geral do blog

body {
  background: #sua-cor;
}

📄 Área principal do conteúdo

#outer-wrapper {
  background: #sua-cor;
}

 Cabeçalho (header)

#header {
  background: #sua-cor;
}

 Barra lateral (sidebar)

#sidebar-wrapper {
  background: #sua-cor;
}

 Área dos posts

#main-wrapper {
  background: #sua-cor;
}

 Rodapé (footer)

#footer {
  background: #sua-cor;
}

 5. Visualize e Salve

Depois de aplicar as alterações, clique em "Visualizar" para conferir como ficou. Se estiver tudo certo, clique em "Salvar". E pronto — seu blog estará com um visual totalmente novo!


💬 Gostou da dica?

Se esse tutorial te ajudou, compartilhe com outros blogueiros! E não esquece de seguir nossa página no Facebook para mais dicas como essa. 

Post a Comment