Como instalar uma Google Web Font

01.10.11 | Pedro

Este post de ajuda mudou de endereço. Consulte-o, por favor, aqui.

37 comentários

amomoda

06.10.12

Eu não estou a conseguir colocar o tipo de letra (font-family: 'Source Code Pro', sans-serif;) na barra lateral, pode ajudar-me por favor?
Pedro

08.10.12

Bom dia,

Qual é o blog e a área (da coluna lateral) a que pretende aplicar o tipo de letra?
amomoda

11.10.12

É o blog Amo Moda
Pedro

12.10.12

Bom dia,

e a área a que pretende aplicar o tipo de letra?
amomoda

12.10.12

A barra lateral
Pedro

12.10.12

Aqui tem:

#extras {font-family: 'Source Code Pro', sans-serif;}

sweet

24.01.13

Boa tarde,
Não sei o que se passa mas eu tentei e não ocorreu qualquer alteração. Eu efectuei o 1º passo e de seguida como utilizo o template SAPO, utilizei o código fornecido neste post para aplicar o tipo de letra aos titulos dos posts, nos templates antigos, no entanto não houve qualquer alteração. Será que me podem ajudar?
Pedro

25.01.13

Bom dia,

O template SAPO foi atualizado recentemente para ter a mesma estrutura que os templates mais recentes. Precisa de seguir as instruções que damos para os templates "mais recentes" :)
sweet

25.01.13

Oh pois claro, esqueci-me completamente! Muito obrigada pela ajuda, ficou perfeito :)
Maria Delgado Carvalho

03.04.14

Boa tarde, fiz o que disse e continuo sem conseguir alterar a fonte nos posts. Obg
Pedro

04.04.14

Bom dia,

ontem só lhe perguntei pelo código ou códigos que está a usar no seu blog para instalar a webfont. Não me chegou a responder :) Pode deixar aqui os códigos para verificarmos se ficou tudo bem?
Maria Delgado Carvalho

04.04.14

Bom dia,

Antes de mais obrigada pela brevidade com que me respondeu. EStes foram os códigos que usei:

#header h1 {font-family: 'Amatic SC', cursive;}
#posts h2 {font-family: 'Voltaire', sans-serif;}
#posts {font-family: 'Voltaire', sans-serif;}
#extras {font-family: 'Amatic SC', cursive;}
.extras h2 {font-family: 'Amatic SC', cursive;}
.extras {font-family: 'Amatic SC', cursive;}
Maria Delgado Carvalho

04.04.14

Inclusivamente queria usar o mesmo tipo de letra para o menu (isso deu) mas a letra fica muito pequena.

obrigada
Pedro

04.04.14

Antes de irmos à questão do tipo de letra, noto que está a utilizar um domínio próprio (http://combichocarpinteiro.pt/), mas que o ainda não está devidamente associado ao blog. Está a ter problemas a configurar o domínio?
Maria Delgado Carvalho

04.04.14

:) estava agora mesmo a constatar que fiz alguma coisa errada com o domínio. Sempre que ponho "ver blog" dá-me inválido, aceita apenas se acrescentar o www.
Como posso resolver esta questão?

Basicamente, neste momento as minhas dúvidas são:

- esta em relação ao domínio
- colocar nos posts o tipo de letra: Amatic SC
- se possível, aumentar o tamanho da letra na barra lateral (vi que não aconselham a usar o nosso tipo de letra na barra lateral), acha que tenho de alterar ou é possível manter a minha?
- Aumentar, também, a letra do menu, para poder ficar com o meu tipo de letra

Muito obrigada pela ajuda!
Pedro

04.04.14

Vamos por etapas, só conseguimos ajudar se pudermos ver o blog, pelo que é melhor começar pelo problema do domínio.

Tal como alertamos na página Configuração, precisa de configurar corretamente o seu domínio antes de o associar ao blog. Consulte, por favor, o nosso post de ajuda para saber o que precisa de fazer: http://blogs.blogs.sapo.pt/137696.html
Maria Delgado Carvalho

04.04.14

Já fiz o que diz no link e continuo com problemas com o domínio. Demora tempo até ficar activo?
Pedro

04.04.14

Boa tarde,

aqui o blog já aparece corretamente associado ao domínio!

Continuando, para associar o tipo de letra aos textos dos posts, precisa de usar esta definição no campo CSS Personalizada:

#posts .posttext {font-family: 'Amatic SC',cursive;}

Não recomendamos usar tipos de letra muito trabalhos nos textos dos posts, pois estas fonts especiais têm maior leitura em títulos. Nos posts, convém usar um tipo de letra mais familiar dos leitores (aqueles que encontra no separador "Letras"). Mas é apenas uma recomendação, pode usar as fonts que quiser, claro.

Para aumentar o tipo de letra do menu, use esta definição na CSS Personalizada:

#menu {font-size: medium;}

Tamanhos: medium, large, x-large, xx-large

S.

03.03.13

Olá!

Eu queria modificar também o tipo de letra da barra lateral (conteúdo e títulos) no blog Vermelho Cerise e adicionar uma google web font. Quais são os códigos?

Muito obrigada,
Sara
Pedro

04.03.13

Bom dia,

o código para definir o tipo de letra dos títulos da coluna lateral é o seguinte:

.extras h2 {font-family: Tipo de letra;}

Não recomendamos alterar o tipo de letra do texto geral da coluna lateral, mas se quiser, o código é o seguinte:

.extras {font-family: Tipo de letra;}

By Armanduxa

23.10.13

olá boa tarde,
Precisava da vossa ajuda porque instalei Google web font.
Consegui alterar a letra no titulo do blog e no titulo dos posts mas não consigo alterar a letra dos títulos na barra lateral e na barra do menu.
Gostaria ainda de saber como activo a possibilidade de "seguir blog"
Obrigada
By Armanduxa
Pedro

23.10.13

Boa tarde,

para ativar o "seguir blog" só precisa de ativar o componente "Sobre mim", no separador Posições da Personalização Intermédia.

Quanto ao menu e títulos da coluna lateral, precisa de usar estas definições (com o tipo de letra dentro das chavetas, tal como nos exemplos do nosso post):
.extras h3 { }
#menu { }
By Armanduxa

23.10.13

feito.
Obrigada pela ajuda
By Armanduxa

24.10.13

Olá outra vez,
Desculpem mas ando sempre a tentar dar um ar diferente ao meu blog.
instalei Google web font também para a letra dos posts mas como é que funciona, ou seja se no texto do post só quiser que uma parte apareça com o tipo de letra que instalei como é que faço?
Outra pergunta, como é que eu crio etiquetas ou categorias?
Obrigada,
By Armanduxa
By Armanduxa

24.10.13

Olá outra vez,
Desculpem mas ando sempre a tentar dar um ar diferente ao meu blog.
instalei Google web font também para a letra dos posts mas como é que funciona, ou seja se no texto do post só quiser que uma parte apareça com o tipo de letra que instalei como é que faço?
Outra pergunta, como é que eu crio etiquetas ou categorias?
Obrigada,
By Armanduxa
Pedro

28.10.13

Bom dia,

se pretende alterar o tipo de letra do post, recomendamos que o faça na Personalização Intermédia, no separador Letras. Usar outros tipos de letra nessa área pode tornar o texto ilegível.

Quanto às categorias, basta usar tags nos posts e depois usar o link de cada tag no menu do cabeçalho.

Maria Delgado Carvalho

10.04.14

Bom dia,

Quais são os código para alterar a fonte de:
- rodapé dos posts com "tags", "publicado às...", "link do post", "comentar", "favorito"...
- data
- quando estamos num post, em cima, onde aparece "post anterior"
- retirar os bullets das tags, no menu lateral

Obrigada pela ajuda!
Pedro

10.04.14

Bom dia,

para retirar os bullets:
.extras li {list-style:none;}

para mudar o tipo de letra do rodapé dos posts (precisa de colocar a font-family que pretende):
.author, .tags {font-family:;}

Note que, tal como alertei antes, o tipo de letra que está a usar não tem muita leitura ao nível dos posts.
Maria Delgado Carvalho

10.04.14

Ficou só a faltar o código para a data e para quando estamos num post, em cima, onde aparece "post anterior".

Obrigada
Pedro

10.04.14

Penso que isto deve resolver todas as situações:
#container {font-family:;}

Maria Delgado Carvalho

22.04.14

Boa tarde,

Criei o blog "Off the record" e queria alterar todo o blog para o tipo de letra do google fonts "Loved by the King".

Fiz como dizem (em cima), aliás, já o tinha feito noutro blog que tenho, mas não surtiu qualquer efeito. Podem ajudar-me?

Obrigada
Pedro

23.04.14

Boa tarde,

qual é o código que está a utilizar?
Maria Delgado Carvalho

24.04.14

Estes são os códigos que estou a utilizar:

#header h1 {font-family: 'Fredericka the Great', 'cursive';}
#posts h2 {font-family: 'Fredericka the Great', 'cursive';}
#posts .posttext {font-family: 'Love Ya Like A Sister', 'cursive';}
#menu {font-size: large;}
.extras {font-family: 'Fredericka the Great', 'cursive';}
.extras h3 {font-family: 'Fredericka the Great', 'cursive';}
#menu {font-family: 'Fredericka the Great', 'cursive';}
.extras {font-size: large;}
.extras h3 {font-size: large;}
.extras li {list-style: none;}
.author,.tags {font-family: 'Fredericka the Great', 'cursive';}
.author,.tags {font-size: large;}
#container {font-family: 'Fredericka the Great', 'cursive';}
#container {font-size: x-large;}

Obrigada
Pedro

28.04.14

Bom dia,

e os códigos das meta tags?

Buzz

27.05.14

Boa tarde,

Como é que posso pôr a mesma fonte que tenho no título do blog, igual nos posts, título dos posts, em todo o lado?

Estes são os códigos que estou a usar.

Obg

<link href='http://fonts.googleapis.com/css?family=Cabin+Sketch' rel='stylesheet' type='text/css'>

#header h1 {font-family: 'Cabin Sketch', cursive;}

#posts h2 {font-family: 'Cabin Sketch', cursive;}

#menu {font-size: x-large;}

.extras {font-family: 'Cabin Sketch', cursive;}

.extras h3 {font-family: 'Cabin Sketch', cursive;}

#menu {font-family: 'Cabin Sketch', cursive;}

.extras {font-size: x-large;}

.extras h3 {font-size: x-large;}

.extras li {list-style: none;}

.author,.tags {font-family: 'Cabin Sketch', cursive;}

.author,.tags {font-size: x-large;}

#container {font-family: 'Cabin Sketch', cursive;}

#container {font-size: x-large;}

#posts .posttext {font-family: 'Cabin Sketch', cursive;}
- link
- responder

Comentar post

A equipa

O blog da equipa do SAPOBLOGS. Um espaço para falar de blogs, esclarecer dúvidas e partilhar boas ideias.

Dúvidas?

Pode deixar a sua dúvida sobre o SAPO Blogs nos comentários ou então consultar o nosso blog de Ajuda. Situações urgentes, relativas à autenticação ou a terceiros, devem ser reportadas diretamente ao Apoio ao Cliente SAPO.

Subscrever por e-mail

A subscrição é anónima e gera, no máximo, um e-mail por dia.

Links

Blogs SAPO

Arquivo

2022
J
F
M
A
M
J
J
A
S
O
N
D

2021
J
F
M
A
M
J
J
A
S
O
N
D

2020
J
F
M
A
M
J
J
A
S
O
N
D

2019
J
F
M
A
M
J
J
A
S
O
N
D

2018
J
F
M
A
M
J
J
A
S
O
N
D

2017
J
F
M
A
M
J
J
A
S
O
N
D

2016
J
F
M
A
M
J
J
A
S
O
N
D

2015
J
F
M
A
M
J
J
A
S
O
N
D

2014
J
F
M
A
M
J
J
A
S
O
N
D

2013
J
F
M
A
M
J
J
A
S
O
N
D

2012
J
F
M
A
M
J
J
A
S
O
N
D

2011
J
F
M
A
M
J
J
A
S
O
N
D

2010
J
F
M
A
M
J
J
A
S
O
N
D

2009
J
F
M
A
M
J
J
A
S
O
N
D

2008
J
F
M
A
M
J
J
A
S
O
N
D

2007
J
F
M
A
M
J
J
A
S
O
N
D

2006
J
F
M
A
M
J
J
A
S
O
N
D

Em destaque no SAPO Blogs

pub