Separar categorias por imagens

Vamos aprender neste tutorial à colocarmos uma imagem que separará
as categorias do seu fórum. Entretanto, precisaremos modificar os
templates do fórum, logo o tutorial é válido somente para as versões
phpBB 2 e punBB.

--> Tutoriais, Dicas e Astúcias <--
Separar categorias por imagens

Para que possamos prosseguir com o tutorial, é preciso que tenha noção sobre a edição dos templates, que serão necessárias para a continuação deste tutorial. Para isso, veja: Modificar os templates do fórum

phpBB 2 e punBB

1º - Aceder ao template que iremos modificar:
Teremos de fazer a edição de uma página de template, para que possamos o fazer teremos de aceder à:
Painel de controle -> Visualização -> Templates -> Geral -> index_box



2º - Alterar o código:
Atenção a esta parte. Primeiramente salve todo o template em um
bloco de notas para caso algo saia errado, você possa recolocá-lo. Assim
que o fizer, procure no template o seguinte código:
Código:Selecionar conteúdo1
2
3
4


E antes desta partícula, coloque o seguinte:
Código:Selecionar conteúdo1
2
3


Logo após salve e publique o template.

3º - Adicionar o código à folha de estilo CSS:
Agora vamos adicionar o código CSS que sustentará a imagem. Terá de aceder a:
Painel de Controle -> Visualização -> Imagens e cores -> Cores -> Folha de estilo CSS



E deverá colocar o seguinte código CSS, alterando a partícula "Link-da-imagem" pelo link da imagem que será exibida entre as categorias do seu fórum. Após as modificações salve:
Código:Selecionar conteúdo1
2
3
4
5
6
7
8
9
#CatImg{
background:url('Link-da-imagem') no-repeat;
width:100%;
height:70px;
padding:5px;
margin-left:-5px;
margin-top:10px;
}


Resultado