- Modul bauen
- Frontend-Seite bauen
- Backend-Seite bauen
- neue Datenbanktabelle
Magento 2 - Backend-Seite bauen
Die Erklärungen auf dieser Seite bauen auf der Seite Modul bauen auf. Wer noch nicht weis, wie man ein Magento-Modul baut. Sollte zuerst das erlernen, bevor er hier weiterliest.URL
Wenn man eine neue Backendseite in Magento erstellen will, muss man erst überlegen, unter welcher URL diese erreichbar sein soll. Die Syntax dieser URL ist.
http://magento2.local/admin_7kwn6k/route_name/controller/action/
- admin_7kwn6k Ein möglichst zufälliger Text, um die Backend-Seite zu verstecken. Dieser lässt sich konfigurieren.
- route_name ist ein eindeutiger Name, mit dem alle URLs beginnen, die in diesem Modul definiert werden. Dieser Name muss eindeutig sein und darf nicht schon in einem anderen Modul verwendet worden sein.
- controller ist der Name des Verzeichnisses innerhalb des Controller/Adminhtml-Verzeichnisses (in Kleinbuchstaben)
- action ist der Name der PHP Klasse innerhalb des Controllernamen-Verzeichnisses. Innerhalb dieser PHP-Klasse muss eine execute-Funktion vorhandenn sein, die letztendlich angesprochen wird, um die URL-Anfrage abzuarbeiten.
Eine Beispiel-URL wäre also:
http://magento2.local/admin_7kwn6k/helloworld/say/hello/
controller oder action kann weggelassen werden. Wird das getan gilt folgendes:
- http://magento2.local/admin_7kwn6k/helloworld/say/ ist gleichbedeutend mit http://magento2.local/admin_7kwn6k/helloworld/say/index/
- http://magento2.local/admin_7kwn6k/helloworld/ ist gleichbedeutend mit http://magento2.local/admin_7kwn6k/helloworld/index/index/
routes.xml
Der route_name muss einmal pro Modul festgelegt werden. Für Frontend-Seiten muss hierfür im Verzeichnis etc/adminhtml eine Datei mit Namen routes.xml mit folgendem Inhalt angelegt werden.
<?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 frontName="helloworld" id="helloworld">
<module name="ErichWeigand_HelloWorld"/>
</route>
</router>
</config>
- <router id="admin"> bedeutet, dass dies eine routes.xml für Admin-Seiten ist.
- route -> frontname : Dies ist der route_name der URL.
- route -> id : Dies ist Teil des Namens für die Layout-XMLs der Seiten für dieses Modul. Meist wird hier derselbe Name wie beim frontname genommen.
- module -> name Hier muss der vollständige Name des Moduls stehen.
Wenn diese Definition in einem Modul gemacht ist, können Backend-Seiten erzeugt werden.
menu.xml
Soll die Backend-Seite über das Menü aufrufbar sein, muss ein neuer Menü-Eintrag generiert werden. Es empfiehlst sich dabei eine Art Überschrift für das Modul zu generieren und darunter alle Menü-Einträge für dieses Modul einzutragen.
<?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="ErichWeigand_HelloWorld::greetings"
title="Greetings"
translate="title"
module="ErichWeigand_HelloWorld"
parent="Magento_Backend::system"
sortOrder="50"
dependsOnModule="ErichWeigand_HelloWorld"
resource="ErichWeigand_HelloWorld::greetings"/>
<add
id="ErichWeigand_HelloWorld::greetings_helloworld"
title="Hello World" translate="title"
module="ErichWeigand_HelloWorld"
parent="ErichWeigand_HelloWorld::greetings" sortOrder="10"
dependsOnModule="ErichWeigand_HelloWorld"
action="helloworld"
resource="ErichWeigand_HelloWorld::greetings"/>
</menu>
</config>
Der erste add-Eintrag erzeugt unterhalb des Menü-Eintrages System eine Überschrift Greetings. Unter diesen Menü-Eintrag
wird der Link zur neuen Seite eingetragen (Hello World). Der fertige Menü-Eintrag sieht dann so aus.
Controller-Klasse
Die PHP-Klasse die den Aufruf der URL nun tatsächlich abarbeitet, muss im Verzeichnis Controller/Adminhtml des Moduls vorhanden sein. Ich baue hier zuerst den Controller für http://magento2.local/admin_7kwn6k/helloworld/ bzw. für http://magento2.local/admin_7kwn6k/helloworld/index/index nach obiger Regel.
Hierfür lege ich im Verzeichnis Controller/Adminhtml das Verzeichnis Index an und darin die Datei Index.php mit folgendem Inhalt.
<?php
namespace ErichWeigand\HelloWorld\Controller\Adminhtml\Index;
use Magento\Backend\App\Action;
use Magento\Backend\App\Action\Context;
use Magento\Framework\App\Action\HttpGetActionInterface;
use Magento\Framework\View\Result\Page;
use Magento\Framework\View\Result\PageFactory;
class Index extends Action implements HttpGetActionInterface
{
const MENU_ID = 'ErichWeigand_HelloWorld::greetings_helloworld';
protected $resultPageFactory;
public function __construct(
Context $context,
PageFactory $resultPageFactory
) {
parent::__construct($context);
$this->resultPageFactory = $resultPageFactory;
}
public function execute() {
$resultPage = $this->resultPageFactory->create();
$resultPage->setActiveMenu(static::MENU_ID);
return $resultPage;
}
}
Layout
Um auf die neue Seite etwas anzuzeigen, wird folgendes benötigt.
- Eine Beschreibung des Layouts, wie die Einzelteile der Seite zusammengesetzt werden. (layout.xml)
- Eine Block-Klasse pro Einzelteil, die alle Daten und PHP-Funktionen enthält, das für diesen Teil gebraucht werden.
- Eine Template-Datei, die das HTML enthält in das diese Daten eingefügt wird.
layout.xml
helloworld_index_index.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<referenceBlock name="page.title">
<action method="setPageTitle">
<argument name="title" xsi:type="string">Greetings</argument>
</action>
</referenceBlock>
<body>
<referenceContainer name="content">
<block class="Magento\Backend\Block\Template" template="ErichWeigand_HelloWorld::helloworld.phtml"/>
</referenceContainer>
</body>
</page>
Block-Klasse
Hier wird keine eigene Block-Klasse verwendet, sondern in der layout.xml die Standard-Klasse Magento\Backend\Block\Template definiert.
Template-Datei
<p>Hello World!</p>
Danach sieht die selbst gebaute Seite folgendermassen aus.
Datei-Struktur
Alle Dateien des Moduls, das hier entstanden ist, sieht dann letztendlich so aus.