- Seção
FC 15022 :: Como utilizar bibliotecas de fontes nos textos da loja?
Cansado das velhas fontes Arial, Verdana e Tahoma? Use as fontes do Google Fonts!
O Google Fonts oferece centenas de fontes para serem utilizadas na loja virtual. Todas as fontes foram otimizadas para uso na web e aprovadas pelo próprio Google. Ao utilizar as fontes hospedadas no Google, a loja carregará mais rapidamente do que utilizar fontes hospedadas em servidores de terceiros. Isto ocorre devido à alta velocidade e baixa latência de rede do Google. Além disso, é provável que as fontes do Google já estejam no cache do navegador do visitante, pois elas são utilizadas por milhares de sites de todos os tamanhos. Desta forma, essa fonte não precisará ser carregada novamente nos acessos à loja.
Segue o passo a passo para utilizar o Google Fonts:
1º Passo
Acesse o site Google Fonts.
2º Passo
Escolha a fonte através do campo de busca ou navegando pelas opções de fontes apresentadas na página:
3º Passo
Ao definir uma fonte, clique no botão Add to Collection:
4º Passo
Você definiu uma fonte, agora clique no botão Use:
5º Passo
Selecione os estilos da fonte que deseja (itálico, negrito etc):
6º Passo
Marque a opção Latin Extended (latin-ext).
7º Passo
Clique na opção @import e copie o código gerado:
@import url(https://fonts.googleapis.com/css?family=Roboto:400,700&subset=latin,latin-ext);
8º Passo
Insira o código com a fonte escolhida no topo do arquivo LojaSite.css:
@import url(https://fonts.googleapis.com/css?family=Roboto:400,700&subset=latin,latin-ext);
9º Passo
Insira a fonte na classe ou ID através do atributo font-family:
h1{font-family:'Roboto',Arial,serif;font-weight:400;}
|
