Resenhas

A minha opinião sobre os mais variados produtos, de beleza a decoração.

Leia mais

Como Me Visto

O meu estilo pessoal e como me gosto de vestir.

Leia mais

Receitas

Receitas simples e fáceis, que dão certo!

Leia mais

29 de março de 2016

Personalizar Títulos da Sidebar || CSS para Blog

Personalizar Títulos da Sidebar || CSS para Blog

Há quanto tempo já não fazia um CSS para Blog! Já estava com saudades de vos trazer um tutorial novo, para deixarem o vosso blog bem bonito. No CSS para Blog de hoje venho-vos mostrar como podem personalizar os títulos da sidebar, para ficarem como os do meu blog (dentro de um quadradinho rosa). O processo é muito simples.


Primeiro copiem o código que vos forneço abaixo e sigam o passo-a-passo que vos mostrarei em seguida.

/* Personalizar os titulos da sidebar */ .sidebar h2 { padding: 8px; /* espacamento */ font-family: 'PT Sans'; /*tipo de letra da fonte */ color: #fff; /* cor da fonte */ font-size: 13px; /* tamanho da fonte */ text-transform: uppercase; /* letras em maiusculo */ background: #FFAEA1; /*Cor de fundo*/; text-align:center !important; /* deixar titulo centrado */ }

Personalizar Títulos da Sidebar || CSS para Blog
1 : Selecionar no menu a opção Modelo.
2 : Clicar no botão Personalizar.

Personalizar Títulos da Sidebar || CSS para Blog
3 : Selecionar no menu a opção Avançadas.
4 : Dentro do menu que aparece após o passo 3, selecionar a opção Adicionar CSS.
5 : Copiar o código fornecido para a caixa.

Personalizar Títulos da Sidebar || CSS para Blog
6 : Depois do código copiado, se no visualizador não tiver alterado nada, carregar na tecla return.
7 : Clicar no botão Aplicar ao blogue.

Personalizar Títulos da Sidebar || CSS para Blog
Antes || Depois

O código que forneci é apenas uma das imensas opções que têm. Podem mudar a cor do fundo, o tipo de letra, a cor da letra, etc. Na internet também encontram tutoriais onde podem personalizar os títulos da sidebar de outra maneira em sites como o da Elaine Gaspareto, por exemplo, o qual recomendo porque tem imensos tutoriais interessantes.

Outras publicações da rúbrica CSS para Blogs

8 comentários:

  1. Não conhecia o teu blog, este foi o primeiro post que li e gostei bastante desta dica! Embora não tenha muito a ver com o design do meu blog, acho este tipo de posts bastante úteis :)

    Beatriz | The Fashion Wink

    ResponderEliminar
  2. Oi, gostei do tutorial mas tenho uma dúvida, como faz para deixa-ló do tamanho que quero na sidebar? Exemplo, no Sobre mim ele está ultrapassando a minha foto!

    ResponderEliminar
  3. Ah, ja consegui hahaha <3 desculpa o incomodo

    ResponderEliminar
  4. Boa noite
    usei a tua dica mas agora estou com uma duvida como faço para mudar a cor quando quiser
    se poderes responde no meu blog
    pois já tentei e não consigo
    obrigada
    Beijinhos
    CantinhoDaSofia /Facebook /Intagram
    Tem post novos todos os dias

    ResponderEliminar
    Respostas
    1. Olá Sofia,

      Respondi no teu blog mas vou responder aqui também para quem tenha a mesma dúvida.

      As cores são representadas por #000000, é só mudares isso para a cor que tu quiseres. No caso, para mudares o fundo, vais ao background: #FFAEA1; e mudas para a cor que quiseres. Podes encontrar os códigos das cores aqui http://htmlcolorcodes.com/

      Beijinhos

      Eliminar
    2. Muito obrigada pela ajuda mas vou tentar fazer mas acho que não vou encontrar nada pois já tive a ver e não aparece nada

      Eliminar
    3. Obrigada aos poucos chego lá consegui

      Eliminar