Eine Einführung in Magentos Layout-XML
Magento-Layouts im Griff

Vinai Kopp, t3n Nr. 18 (03/2010) | 3 Kommentare |
4 tweets  tweet this!
 |  Teilen

t3n Magazin kaufen!

Magento besitzt ein sehr leistungsfähiges und flexibles Templating-System. Vielen Magento-Einsteigern fällt aber besonders der Umgang mit den dabei zum Einsatz kommenden Layout-XML-Dateien nicht leicht. Dieser Artikel vermittelt das Grundwissen, um Layout-Updates in eigenen Magento-Projekten umsetzen zu können.

Alle modernen Webanwendungen bieten Template-Systeme an, durch die sich die Programmlogik und die Darstellung von Inhalten trennen lassen. Dabei kommen die verschiedensten Systeme zum Einsatz. Ein prominenter Vertreter ist Smarty, das von vielen Open-Source-Projekten eingesetzt wird. Bei Magento [1] wird PHP direkt als Template-Engine verwendet. Alle Systeme haben gemeinsam, dass die HTML-Blöcke für die Darstellung in einzelne Template-Dateien ausgelagert sind, in denen die Applikation die Platzhalter durch die Inhalte ersetzt.

Die Programmlogik setzt die Template-Blöcke so zusammen, wie sie für den jeweiligen Fall gebraucht werden. Die meisten Webentwickler haben damit reichlich Erfahrung.

Grundsätzliches zu Magento-Themes

Bei Magento liegen die Template-Dateien in „app/design/frontend/default/THEME/template“. „THEME“ wird dabei durch das in der Konfiguration festgelegte Layout-Theme ersetzt, standardmäßig ist das „default“. Änderungen sollten Sie nie direkt in „default“ durchführen, da die Anpassungen beim nächsten Magento-Update überschrieben werden könnten. Sie sollten also ein neues Theme anlegen, indem Sie „app/design/frontend/default/default“ nach „app/desgn/frontend/default/meintheme“ kopieren und im Admin-Interface unter System > Konfiguration > Gestaltung > Themes > Standard „meintheme“ eintragen.

Soweit gibt es noch keinen Unterschied zu anderen Template-Systemen, bei denen direkt im Code steht, welche Datei zum Formatieren der Ausgabe verwendet wird. Das kann in etwa so aussehen:

Direkte Verknüpfung von Code und Template

$template = 'templates/product/list.tmpl';
$html = $this->process($template);

Listing 1

Jetzt zu der Besonderheit bei Magento: Im Code steht statt des Namens der Datei ein Platzhalter für das Template.

Code in Magento

$blockName = 'product.list';
$html = $this->getChildHtml($blockName);

Listing 2

Welche Datei für den Platzhalter verwendet werden soll, wird durch den Inhalt der Layout-XML-Dateien bestimmt.

Ein Layout-XML-Block in Magento

<block type=“catalog/product_list“ name=“product.list“ template=“catalog/product/list.phtml“ />

Listing 3

Magento unterscheidet also zwischen Templates (PHP-Dateien mit der Endung .phtml) und den Layout-Dateien mit dem XML.

Das „type“-Attribut legt fest, welche Klasse den Block rendert. Vor dem Slash wird das Modul angegeben, dahinter der Pfad innerhalb des Blockverzeichnisses des Moduls. So eröffnen sich zahlreiche Möglichkeiten:

  • Ändern der zu verwendenden Template-Dateien
  • Ändern der Ausgabeposition von HTML-Blöcken
  • Hinzufügen und Entfernen von HTML-Blöcken
  • Daten zu der Ausgabe von anderen Modulen hinzufügen oder entfernen (z. B. Links in der Haupt-Navigation)
  • Hinzufügen von CSS- und JavaScript-Dateien
  • Ändern der Klasse für den Code-Block
  • Anpassung einzelner Kategorien und CMS-Seiten im Backend

Die Anpassungen sind möglich, ohne dass Sie Core-Code verändern müssen. Bei konsequenter Nutzung bleibt das System so trotz weitreichender Anpassungen upgradefähig.

» weiterlesen

1 2 3 4

Beitrag mit anderen teilen:

  • Twitter
  • Facebook
  • FriendFeed
  • t3n Social News
  • del.icio.us
  • MisterWong.DE
  • Digg
  • Identi.ca
  • Technorati
  • RSS
  • E-mail this story to a friend!

3 Antworten zu “Eine Einführung in Magentos Layout-XML: Magento-Layouts im Griff”

  1. #1 Tutorial: Einführung in Magentos Layout-XML » t3n News

    [...] 18 vermittelt das Grundwissen, um Layout-Updates in eigenen Magento-Projekten umsetzen zu können. Er steht jetzt kostenlos im Heftarchiv zur Verfügung. Zudem kann man t3n Nr. 18 versandkostenfrei in unserem Shop bestellen.Ads_BA_AD('CAD2'); magento [...]

  2. #2 mathiasschopmans

    Super! Endlich mal ein guter Einstieg. ;)

  3. #3 Till Heß

    Super Artikel! Hätte es den doch gegeben als ich das erste mal die xml Datein von Magento angepasst habe ;-)

4 Tweets:

  • Möchten Sie auch hier erscheinen? Dann hier Re-Tweeten

Du hast eine Ergänzung oder Frage zum Artikel? Teile sie jetzt mit!