[TUTORIAL] 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:


    <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">         
   

E antes desta partícula, coloque o seguinte:

Código:


    <div id="CatImg"></div>
   

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:


    #CatImg{
    background:url('Link-da-imagem') no-repeat;
    width:100%;
    height:70px;
    padding:5px;
    margin-left:-5px;
    margin-top:10px;
    }


Resultado

---

© Fórum dos Fóruns

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: Separar categorias por imagens