Postagens | Dicas blog, Imagem, Pc Windows

Mudar a fonte da descrição do blogger

Aprenda como mudar a fonte da descrição do blogger, mudar o tamanho e cor da fonte usando um pequeno código css.
Isso não é possível para quem usa um modelo clássico(antigo), entenda o que é, por que mudar e como nesse post: Mudar modelo do blogger para layout(Design)

Nesse post parece ser complicada, isso porque eu coloquei bastante informação para até mesmo quem não entende de css ou Html poder fazer a mudança no estilo da fonte da descrição.

No blogger:
1-Clique em Design
2-Em seguida Editar Html,
3-Antes de começar faça um backup do seu código clicando em Baixar modelo completo, só por precaução e segurança, Salve em seu computador.
4-Em Editar Html tenha cuidado com os caracteres que devem ser respeitados({}: ; . etc).
5- Apenas observe se existi, no seu Html, um código parecido com esse abaixo, para dar certo:
<Variable name="bodyfont" description="Text Font" type="font" default="normal normal 100% Helvetica, Arial, sans-serif" value="normal normal 100% Helvetica, Arial, sans-serif">
Bom, tendo o código acima(parecido) você pode estar certo de que a pequena mudança a fazer vai lhe servir para aumentar ou diminuir a fonte do título ou descrição, e, que seu blog é o modelo atualizado.

Entenda que a descrição do blogger tem um nome que é description e tem qualidades(propriedades) como: cor, tamanho da fonte, borda, etc. As propriedades para a descrição estão {entre chaves} logo após um ponto e o nome dela.
.description {
propriedades; }
Para mudar a fonte da descrição do blogspot você deve encontrar esse código abaixo:

.description {
Deve existir varias palavras(propriedades) antes do caracter fecha-chaves}
Essas palavras podem variar de acordo com o modelo(layout) por você escolhido, mas o mais importante eu vou deixar com destaque.

6-Perceba que cada propriedade está numa linha e termina com ponto e vírgula; e deve continuar assim.

7- Substitua os códigos em vermelho ou se não existir adicione.
Você não deve copiar esse código inteiro, e sim apenas procurar se ja existe em seu código os valores(propriedades) color: e um número para cor e font-size: e número para tamanho seguido de em; Alguns tamanhos de fonte podem estar em px ou pt, nesses casos aumente ou diminua o numero

.description {
margin-$endSide: 0;
border: 1px solid #62C1FC;
margin-bottom: 0;
margin-$startSide: -6px;
color: #33595E;
font-weight: bold;
font-size: 0.8em;
}

8- Clique em Salvar alterações.

Veja abaixo alguns exemplos de código para tamanhos das letras(ou fonte) em vermelho e depois de cada o valor ou porcentagem

Tamanhos de fonte:

font-size: 0.5em; é metade da fonte "do texto"

font-size: 0.8em;
é 80% da fonte

font-size: 1.2em;
é 120% da fonte

font-size: 1.7em;
é 170% da fonte

font-size: 2em;
é 200% da fonte ou dobro

Você pode usar qualquer número, mas deve estar seguido de em;

Use os códigos acima para diminuir ou aumentar o tamanho da fonte da descrição, sabendo que o valor 1em; é o tamanho do texto do blog.
Uma fonte menor pode ser um número abaixo de 1 mas maior de zero ou pouco menor da já existente, se existir.

Veja alguns exemplos de código de cor da fonte, e, após cada, veja a Cor da fonte:

color: #33595E; é essa cor

color: #940f04; é essa cor

color: #FF6A2E; é essa cor

color: #0D8F63; é essa cor

Você pode usar os nomes das cores básicas em inglês sem o sustenido#

color: red; é essa cor

color: blue; é essa cor

Dica: vá ao blogger em Layout ou Design, fontes e cores ou Avançado e veja que ao clicar numa cor muda o código de cor hexadecimal.

Se não existir font-size: ou color: Você pode adicionar ela após .description {e, antes do caracteres fecha-chaves }
Respeite as propriedades existentes, algo como esse erro:
margin-bottom: color: blue;0;
poderia ser ruim para seu layout.

13 comentários:

  1. Olá.

    Gostaria de mudar a fonte dos posts do meu blog,
    mas a fonte que queria ( Bradley Hand ITC ) não está disponível no meu modelo.
    O que eu faço? Tem como mudar mesmo assim?

    Obrigada.Abraços.

    ResponderExcluir
  2. Este comentário foi removido pelo autor.

    ResponderExcluir
  3. Olá.

    Obrigada por me responder, mas não deu certo.
    Inseri o código no local que indicou, mas a fonte não mudou e o código apareceu escrito logo acima do nome do blog.Se tiver um outro caminho agradeceria, se não, muito obrigada pela atenção.

    Abraço.

    ResponderExcluir
  4. Parole

    Desculpe, esqueci de dizer algo, para adicionar esses códigos Css é exatamente antes/acima de ]]></b:skin>, vai o comentário anterior corrigido:

    Vou te dar uma dica apenas para você tentar, é algo um pouco difícil, você deve baixar seu modelo completo antes ou usar um blog de testes para praticar primeiro.

    Ir em Blogge > Designer >Editar HTML e encontrar esse código ]]></b:skin> e antes ou acima dele adicionar:

    .post-outer{font-family: 'bradley hand itc', arial, serif;}
    .post{font-family: 'bradley hand itc', arial, serif;}

    Veja que arial é a segunda opção, quem não tiver a fonte Bradley Hand ITC instalada vai ver em arial, você pode trocar arial por outra fonte bastante usada. Você deve saber que as pessoas só vão ver aquela fonte se elas tiverem ela instalada no Pc delas, o que você pode tentar descobrir sobre a opção import para fonte Css, mas para isso precisa bom conhecimento em Css, ter opção de hospedar essa fonte na web ou muita dedicação.

    ResponderExcluir
    Respostas
    1. Este comentário foi removido pelo autor.

      Excluir
  5. Bom dia, eu de novo.

    Quase deu certo.Coloquei o código agora acima e mudou a fonte dos comentários apenas, os posts continuam com a mesma fonte que estavam.Mantive a mudança, se quiser dar uma olhadinha como ficou...

    Abraço e obrigada.

    ResponderExcluir
  6. Parole

    O que acontece é que quando você criou as postagens você pode ter usado a opção de fonte no editor de post do blogger ou copiou o texto de um local onde já havia uma formatação de fonte, se você colou um texto na área de criação de postagem esse texto pode já estar formatado com um tipo de fonte, toda vez que fizer isso use a opção Editar Html da área de criar postagem, as postagens prontas você pode editar novamente, qualquer estilo usado no momento de criar posts, com as opções disponíveis no editor, vai ficar impossível de mudar por outro meio que não seja reeditando a postagem.

    ResponderExcluir
  7. Deu certo!!!! Adorei.Costumo mudar a fonte quando faço o post, por isso não dava certo.Deixei em fonte padrão e deu tudo certo.

    Obrigada pela ajuda.Já tive vários blogs, mas nenhum com uma fonte bonita assim...

    Beijinhos.Tenha um ótimo dia.

    ResponderExcluir
  8. Anônimo29/3/11

    como faço para diminuir o espaçamento entre linhas do post do meu blog???antigamente tinha um espaçamento bom...naum sei o q aconteceu derepente ficou muito distante...

    ResponderExcluir
  9. Anônimo

    Primeiro verifique se não é uma configuração em seu navegador ou Pc, se não for, terá que alterar o código, faça um backup de seu modelo e prefira fazer primeiro em um blog de testes, se é só no post do blogger você poderá localizar no Css do Html uma das seguintes class:

    .post-outer{

    ou

    .post{

    Após o primeiro caracter abre-chaves { veja se contem line-height: e se tiver você terá que diminuir o valor do numero logo após ele, se não tiver, você pode adicionar line-height:90%; logo após o abre chaves, ficaria parecido com isso:

    .post-outer{line-height:90%;

    ou então:

    .post{line-height:90%;

    Dependendo do modelo é usado .post ou .post-outer como não sei qual ele usa, você terá que testar ou descobrir qual tem em seu modelo.

    line-height: define a altura da linha, coloquei em porcentagem porque acho mais fácil, se você diminuir o valor diminuirá mais a altura, se for acima de 100% deverá aumentar a altura da linha.

    Para saber onde adiciona Css no blogger, clique aqui

    ResponderExcluir
  10. tem como eu mudar a cor só de algums trechos da descrição do blog.
    Quero que o texto em baixo do cabeçalho,fique diferente do resto da descrição.

    ResponderExcluir
  11. Bill Prisma

    Você deve perceber que tem a descrção e o título do blog, ambos ficam bem próximos, sendo assim, se você mudar apenas a cor da fonte da descrição já fará uma diferença.

    Porém, a descrição é um elemento único e o blogger não permite uso de códigos e tags Html, mas, o que você pode fazer é usar o Css para dar um efeito diferente na primeira linha dela, no caso do que você quer, mudar a cor, primeiro, veja como e onde adiciona Css no blogger, clique, depois altere e pode adicionar esse trecho:

    .description:first-line{color:red;}

    Você pode substituir red por outro nome de cor básica escrita em inglês.

    Se você quisesse a ultima linha da descrição em vermelho, usaria o seguinte código no seu Css:

    .description:last-line{color:red;}

    Sobre sua outra pergunta, faz uma busca por 'colocar comentários do blogger', escrevi uns três posts sobre o assunto, um deve ser o que você quer.

    ResponderExcluir
  12. Oi pessoal parabens pelo site_muita dicas_seguinte:.
    estou tentando mudar o estilo(tipo) da fonte na descrição do meu blog (Blogger)_na parte Avançado no design tem como mudar a côr etc.. mas o estilo não_tem como mudar?? se alguem souber de alguma dica ficarei muito grato.
    abraço

    ResponderExcluir

→Dê sua opinião. Faça comentário relacionado ao post.
Comentário com e-mail será excluído
Antes de perguntar leia o texto até comentários e pesquise, a resposta virá no comentário, para ser avisado use uma conta e o link: Subscribe by email(abaixo)
Será excluído comentário não relacionado ou com Url de blog/site(Divulgar? Clique)

Comentário reflete a opinião do comentarista. Desde já, Obrigado!

Postagens Populares