Créer une interface d'admin sous magento 2

Ce tutoriel est le 6eme d’une longue série de tutoriel magento2. Il sera mis à jour au fur et à mesure des évolutions de la plateforme. Vous allez maintenant apprendre a créer une contrôleur pour le backend de magento2 c'est à dire ajouter votre module dans l'administration de magento2. Si vous ne connaissez pas magento (v1) ce n’est pas grave, je vais en parler bien sur mais il n’est pas nécessaire de connaitre la plateforme magento (v1) pour maitriser ce tutoriel sur magento2.

Dans le tutoriel précédent nous avons vu comment créer un installer sous magento2 pour notre extension ! Nous allons maintenant voir comment ajouter notre module à l'interface d'administration. Pour cela, on va repartir des fichiers de notre tutoriel précédent.

Rajouter une entrée dans le menu d'administration de magento2

Allez dans le répertoire etc/ de votre module et ajoutez un dossier adminhtml/ c'est ce dossier qui contiendra les fichiers de configuration de votre module qui concernent le backoffice.
Ajoutez un fichier menu.xml avec le contenu suivant:

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Backend:etc/menu.xsd">
    <menu>
        <add id="Pfay_Contacts" title="Pierre FAY Contacts" module="Pfay_Contacts" sortOrder="20" dependsOnModule="Pfay_Contacts" resource="Pfay_Contacts::contacts"/>
        <add id="Pfay_Contacts::index" title="Pierre FAY Contacts" module="Pfay_Contacts" action="contacts/test/index" parent="Pfay_Contacts" sortOrder="20" dependsOnModule="Pfay_Contacts" resource="Pfay_Contacts::contacts"/>
    </menu>
</config>

Dans la config, ajoutez dans "menu", une balise "add" qui va vous permettre de gérer simplement ce menu avec ses attributs :
- id est l'identifiant unique de l'entrée du menu
- title est le titre de votre onglet, c'est ce qui s'affichera dans le backoffice
- module indique sur quel module porte le lien de l'entrée du menu
- action permet d'indiquer sur quelle action du module on sera redirigé lorsqu'on clique sur cette entree du menu. ici on sera redirigé vers l'action contacts/test/index de la partie administration du module.
- parent doit être l'id d'une autre balise "add" du menu, c'est le parent de l'entrée du menu, c'est à dire que cette entrée sera "en dessous" de sa parente dans le menu
- sortOrder va vous permettre de prioriser certains onglet à l'affichage pour des onglets qui ont le même parent.
- dependsOnModule permet de n'afficher l'onglet que si le module indiqué est présent.

Déclarez la route adminhtml de votre module magento2

Connectez vous à votre interface d'administration et vous verrez donc l'onglet apparaitre dans le backoffice mais quand vous cliquerez dessous, c'est une 404 car comme sur le front office, une route à besoin d’être défini pour pouvoir trouver les controller du backoffice pour ce module.
Créez donc dans votre dossier adminhtml/ du dossier etc/ de votre module, le fichier routes.xml avec le contenu suivant :

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
    <router id="admin">
        <route id="contacts" frontName="contacts">
            <module name="Pfay_Contacts" />
        </route>
    </router>
</config>

Grâce à cette route vous allez pouvoir accéder au controller de la partie administration de votre module.

Créez votre controller d'admin magento2

Pour créer ce contrôleur, rendez-vous dans le dossier Controller/de votre module, créez y le dossier Adminhtml/avec dedans un dossier Test/ et dans celui ci un fichier Index.php avec le contenu suivant :

<?php
namespace Pfay\Contacts\Controller\Adminhtml\Test;
use Magento\Backend\App\Action;

class Index extends \Magento\Backend\App\Action
{
    public function execute()
    {
        die('test admin view');
    }
}

Puis on "met à jour" son module et on remet les droits sur les dossier si besoin, via les commandes suivantes :

    php bin/magento setup:upgrade
    chown www-data:www-data -R .
    chmod 777 -R var/
    
Retournez dans votre interface d'administration, rafraichissez la page et vous pouvez maintenant cliquez sur l'entrée du menu qui vous redirigera vers votre controlleur Index de la partie administration de votre module magento2.

Et voilà ! c'est la fin de ce tutoriel. Cela ne fonctionne pas chez vous ? Récupérer les sources de ce module en bas de cette page et trouvez plus facilement votre erreur.

Vous savez maintenant ajouter une entrée dans le menu d'administration de magento2 et créer l'action du contrôleur associé...Félicitation !

Si vous avez aimé ce tutoriel, s’il vous plait remerciez moi en 1 clic en partageant cet article sur twitter, googleplus ou facebook, ça peut paraitre inutile mais pour moi c’est très important. Merci à ceux qui le feront ;) N’hésitez pas également à poser vos questions dans les commentaires (pour ceux qui partagent l’article), j’essaierai de répondre rapidement.
Bon courage à tous pour la suite de ces tutoriels sur magento2 !
Documents disponibles pour cet article :
Les livres qui peuvent vous aider :
  • Livre Magento 2 Developer's Guide by Branko
  • Livre Magento 2 Cookbook
  • Livre Mastering Magento2 Second Edition
Questions sur cette leçon
Pas de questions pour cette leçon. Soyez le premier !

Vous devez etre connecté pour demander de l'aide sur une leçon.