Blogger: Mudar o plano de fundo de cada widget separadamente | Follow your dreams
Blogosfera

Blogger: Mudar o plano de fundo de cada widget separadamente

Olá dreamers,
Notaram que agora os widgets de categorias na minha barra lateral tem um plano de fundo diferente? Nesse post vou ensiná-los à fazer isso. :)

Blogger Mudar o plano de fundo de cada widget separadamente 4

Atenção: esse tutorial ensina a modificar cada widget separadamente, você pode atribuir um plano de fundo diferente para cada um. Vamos lá?

♥ 1 – No painel do blogger clique em Modelo > Editar HTML e marque a caixinha Expandir modelos de widgets.

 

♥ 2 – Agora você precisa descobrir o ID do widget que deseja modificar. Para descobrir, aperte Ctrl + F e procure pelo nome do widget como aparece no template, no meu caso Categorias.

 

Você verá algo parecido com isso:

O ID do meu widget é Label2.

 

♥ 3 – Ainda na caixinha do Ctrl + F pesquise por:

]]></b:skin>

E acima dele cole o código:

#label2 {
background:url(IMAGEM) repeat;
}

Substitua o texto em destaque pelo ID do seu widget descoberto no passo 2. Substitua também o texto IMAGEM pelo endereço da imagem que será o plano de fundo.

Caso você queira modificar apenas a COR do plano de fundo, e não colocar uma imagem, cole o código abaixo:

#label2 {
background: #e9f0f2;
}

Substitua o texto em destaque pelo ID do seu widget e o texto sublinhado pelo código da cor que você deseja.

 

♥ 4 – Visualize para garantir que está tudo ok e se estiver, salve.

DICA: use o plano de fundo o mais claro possível, caso contrário ele entrará em conflito com o texto do seu widget, o que dificultará a leitura.

 

E aí, gostaram do tutorial? Acharam fácil? :)
xoxo ♥

56 Comentários

  1. Karoline, faz um tutorial de como deixar o link dos comentários com esse fundo rosa tipo no seu blog quando está na página inicial! :)

    1. Dependendo do seu layout, inclui o título sim! No caso do meu não incluiu por que o título fica fora da área do widget.

      Não é preciso mexer nos links. Esse tutorial é só para adicionar um plano de fundo ao widget, ele não modifica o conteúdo.

  2. Oi, adorei seu blog. Mas, na verdade, meu problema é mais grave. rsrs Gostaria de uma luz de como mudar completamente o blog/blogger, tipo… Ali no início, onde tem “INÍCO / SOBRE / 20 SPRINGS…” ou ali no “Curta o blog”, no “compartilhe” etc. Deu pra entender? Essas coisas, esse tipo de personalização que você usou no seu blog. É preciso de uma ajuda de alguém que trabalhe com isso? Me ajude! rs Obrigada.

  3. O tutorial é muito bom mas no meu templante que é Janela de imagens ele fica sobrando no lado direito e o esquerdo fica colado, queria deixar o fundo do widget centralizado, teria como?

    1. Sandra vc pode clicar dentro do HTML e dar um crtl+F vai abrir uma caixinha de pesquisa dentro do código fonte para vc pesquisar! eu sei como é, tmbm demoro a encontrar algumas coisas no HTML do meu blog depois que o Blog mudou!
      E parabéns a Karoline pelo tutorial! me ajudou muito! Depois vou procurar aqui no seu blog algum tutorial para mudar o background do rodapé da página onde ficam os créditos! Se ainda não tiver um tutorial assim fica como sugestão!

  4. Karoline, muito obrigado pela dica, ajudou muito mesmo, muito obrigado! Mas tenho uma duvida, no caso de imagens, tem como colocar um width/height para posicionar melhor a imagem?! Obrigado novamente!

  5. Olá! Tentei fazer isso com o widget de seguidores, mas não foi modificado. Mudei o ID conforme o indicado e tudo bonitinho, mas nada. Existe a possibilidade de alguns templates não aceitarem a mudança?

Deixe uma resposta