Para este exemplo vamos utilizar o template de administração Gentelella Alela! (click no link para fazer o Download).
Antes de começar a explicar como podemos utilizar este template, quero enumerar algumas razões para utilizarmos templates já criados no desenvolvimento de uma aplicação PHP:
- Economia de Tempo;
- Design Responsivo e Consistência;
- Melhores Práticas de UX/UI;
- Manutenção Facilitada;
- Foco nas Funcionalidades Específicas;
- Integração com Frameworks PHP;
- Flexibilidade e Customização.
Não é necessário reinventar a roda, uma vez que ela já foi criada!
Vamos prosseguir para a nossa aula. Após descarregar o ficheiro, descomprima-o. Em seguida, na diretoria do seu servidor (htdocs ou www), crie uma pasta para o novo projeto que iremos começar a desenvolver. O próximo passo consiste em efetuar uma cópia da pasta do Gentelella para esta diretoria.
Agora, aceda à pasta 'production'. Lá encontrará 3 index's. Selecione um deles e altere a extensão de .html para .php.
Abra o seu editor de código e vamos editar este ficheiro para o nosso mini projeto.
No entanto, o primeiro passo que vamos dar é abrir o ficheiro no nosso navegador e analisá-lo para identificar o que será comum em todas as páginas que vamos ter e o conteúdo que será diferente em cada link que possuirmos.
Concluímos que o cabeçalho e o menu lateral serão sempre iguais, enquanto a parte central, marcada com o retângulo vermelho, será sempre diferente para cada opção que o utilizador escolher.
Portanto, vamos analisar o código e identificar onde podemos encontrar este trecho no ficheiro index.php.
Após analisar todo o código, podemos verificar o seguinte:
O que pretendemos alterar está entre as linhas 275 e 953 do nosso código. Vamos recortar este código e criar um novo ficheiro, dashboard.php, onde iremos colar o código que acabamos de recortar.
No local onde realizamos o corte de código, vamos inserir um trecho de código PHP que nos servirá para indicar qual página queremos abrir nesse mesmo local.
Neste caso, verificamos através do método GET se a variável 'page' está definida na URL do nosso navegador. Se estiver, pegamos no seu valor. Caso contrário, atribuímos à nossa variável $page o valor 1, indicando que deve carregar a página dashboard.php neste caso.
Mas como adicionar novas páginas? Vamos considerar o seguinte caso: suponhamos que queremos criar uma área de administração de produtos, incluindo marcas, categorias e os próprios produtos. O primeiro passo é adicionar no menu lateral os links correspondentes, utilizando o seguinte código HTML:
Com o seguinte resultado:
Agora, basta indicar no PHP quais páginas devem ser carregadas para cada um dos links criados:
Agora, para dar continuidade ao projeto, precisamos criar cada uma dessas páginas, o que será abordado nas próximas lições.
