em HTML5

Utilizando ícones em forma de fontes FontAwesome no seu template do ZIBO Enterprise CMS

Screen Shot 2015-01-25 at 09.12.31

Um recurso muito interessante para utilização de ícones de redes sociais é a utilização destes ícones em formato de fontes. No repositório http://fortawesome.github.io/Font-Awesome/ você encontra uma opção fácil e robusta para utilização destas fontes envolvendo apenas CSS.

Neste post irei mostrar um exemplo de como utilizar esta família de fontes.

01) Primeiramente você deve baixar a biblioteca de fontes em http://fortawesome.github.io/Font-Awesome/assets/font-awesome-4.3.0.zip ;

02) Descompacte o arquivo e faça o upload para o local onde queira hospedar as fontes. No caso do Zibo Enterprise CMS o diretório padrão de templates fica em z.view/nome-do-template;

03) Depois de feito o upload você deve chamar o CSS padrão do FontAwesome utilizando o exemplo abaixo:

no caso do ZIBO entre com o seguinte código

 

04) Depois adicione as chamadas em seu CSS seguindo o exemplo abaixo:

 

 

05) Adicione a entrada da fonte no local que deseja aplicar:

OBS: Você consegue ter uma ideia geral dos códigos de cada ícone no link http://fortawesome.github.io/Font-Awesome/cheatsheet/

Confira alguns exemplos de aplicação em: http://fortawesome.github.io/Font-Awesome/examples/