Personalizando as fontes do blog

Atendendo a pedidos finalmente vou mostrar como personalizar as fontes do blog através das fontes personalizadas do Google (como as que eu uso aqui no blog) . É um tutorial simples, mas requer um pouco de atenção. Ele consiste basicamente em instalar uma fonte no seu código HTML que permite que a fonte escolhida seja usada aonde você quiser. Como nos títulos da postagem, cabeçalho, títulos da sidebar, rodapé da postagem e etc. Instalando a fonte

01. Entre no site Google Web Fonts. Escolha a fonte que deseja e clique em Quick-use.
* Para visualizar melhor a imagem é só clicar sobre ela.

02. Na página que irá abrir, copie o código disponibilizado no passo 3.

* Para visualizar melhor a imagem é só clicar sobre ela.

03. Depois de copiar o código, vá em Modelo > Editar HTML e procure por:

‹head›

Cole o código ANTES de ‹head›, assim:

‹link href=’http://fonts.googleapis.com/css?family=Yellowtail’ rel=’stylesheet’ type=’text/css’ /‹head›

OBS: para o código ser aceito no template você deverá acrescentar uma barra (destacada no código) a mais antes de > .

04. Feito isso, copie o código do passo 4 :
* Para visualizar melhor a imagem é só clicar sobre ela.

Aplicando a fonte

Agora que a fonte já está instalada, você vai utilizar o código que você copiou no passo 4 para personalizar a fonte que você quer, seja do título do post ou do blog. Você deverá adicionar o código nas seguintes áreas:

Título do blog (código do modelo Minima)

#header h1 {   margin:5px 5px 0;   padding:15px 20px;   text-transform:uppercase;   letter-spacing:.1em;   font: $pagetitlefont; /* substitua essa parte pelo código do passo 4 */ }

Título das postagens (código do modelo Minima)

.post h3 {   margin:.20em 0 0;   padding:0 0 5px;   font-size:38px;   font-weight:normal;   color:$titlecolor;   font-family: ‘Yellowtail’, cursive; /* adicione o código antes do fechamento das chaves */}

Isto foi só um exemplo. Você pode adicionar fonte personalizada em outros locais também, como no título dos gadgets e no rodapé da postagem, é só procurar o trecho correspondente. Qualquer dúvida ou pedido em relação ao tutorial é só deixar um comentário ou entrar em contato.

Créditos: Jackie Dream e Camila Designs

Stay Inspired
Sign up to be the first to find out about new posts, latest home finds and style and skincare picks, to stay inspired!