To main content

Como conectar fontes usando o arquivo CSS

A conexão de arquivos por meio de seu próprio CSS requer experiência em escrever código CSS e seu próprio servidor para armazenar o arquivo.
A primeira coisa de que você precisa é o(s) arquivo(s) de fonte WOFF.
Você pode obtê-los comprando uma fonte em um serviço de fontes, por exemplo, myfonts.com. Ao comprar, escolha a licença "WEB" para poder usá-la on-line.

Coloque os arquivos de fonte na Web
Você pode escolher qualquer servidor ou serviço CDN para colocar os arquivos. O principal é que o servidor deve oferecer suporte ao Access-Control-Allow-Origin CORS para distribuição em qualquer domínio. (Access-Control-Allow-Origin: *)
Se você hospedar arquivos em seu próprio servidor
Crie um arquivo .htaccess na raiz do site e adicione o seguinte código:
<FilesMatch "\.(ttf|otf|eot|woff)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>
Crie seu próprio arquivo CSS e coloque-o em seu servidor ou serviço de CDN.
Como criar um arquivo CSS

Abaixo está um exemplo de como o CSS é escrito. Você pode criá-lo em um editor de texto comum, salvá-lo com uma extensão .css e, em seguida, carregá-lo em um servidor ou CDN.
@font-face {
font-family: 'Gerbera';
src: url('http://yoursite.com/gerbera/Gerbera-Medium.woff') format('woff');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Gerbera';
src: url('http://yoursite.com/gerbera/Gerbera-Bold.woff') format('woff');
font-weight: 700;
font-style: bold;
}
Como usar CSS
Voltar para Tilda. Site Settings → Fonts and Colors → Your Own Font (Configurações do site → Fontes e cores → Sua própria fonte). Cole o link para o arquivo CSS. Adicione o nome da fonte conforme especificado no arquivo CSS.
Salvar e republicar todas as páginas.
Importante: você verá sua fonte somente quando publicar o site. No modo Editar ou Visualizar, nenhum arquivo CSS de terceiros pode ser conectado, o que significa que sua fonte não estará visível (isso é feito por motivos de segurança).
Fabricado em
Tilda