Introduzindo em seu fórum phpbb
É muito simples. Primeiro você deve acessar o site do F.A. e baixar o pacote oferecido aqui.
Feito isso, você deve descompactar as duas pastas que baixou para seu diretório
theme
do estilo. As duas pastas são:css
fonts
Meio caminho andado. Agora só precisamos referenciar os arquivos de estilo.
Abra
seudiretorio/styles/seuestilo/template/overall_header.html
Dentro da tag
<head>
cole o seguinte código:Código: Selecionar todos
<link rel="stylesheet" href="{T_THEME_PATH}/css/font-awesome.min.css">
Todos os ícones, seus nomes, classes e unicodes você encontra clicando aqui.
Pra utilizar é muito simples. Você só precisa usar as classes
fa
e fa-
junto do nome do ícone e dentro da tag <i>
, veja:Código: Selecionar todos
<i class="fa fa-circle-thin" aria-hidden="true"></i>
Usando em pseudo-elementos
É possível também usar os pseudo-elementos e posicionar seu ícone de maneira diferente diretamente do CSS usando os unicodes. Veja:
Código: Selecionar todos
<a class="antes" href="http://suportephpbb.com.br">Página do Suporte</a>
<br>
<a class="depois" href="http://suportephpbb.com.br">Fóruns</a>
Código: Selecionar todos
a.antes:before {
content: "\f005";
font-family: FontAwesome;
}
a.depois:after {
content: "\f2b9";
font-family: FontAwesome;
}
after
e o before
.Você também pode fazer ícones animados, coloridos e etc., mas isso é assunto pra outro tutorial.