Share
In diesem Lernprogramm werden wir das Konzept von Layouts in OpenCart untersuchen. Wir untersuchen zunächst die in OpenCart verfügbaren Kern-Layouts. Im weiteren Verlauf werden wir uns ansehen, wie Sie neue Layouts erstellen können. Außerdem werden Layouts mit Produkten, Kategorien und Modulen verknüpft.
Ich gehe davon aus, dass Sie die neueste Version von OpenCart 2.0 verwenden. Natürlich sind Layouts auch in früheren Versionen von OpenCart verfügbar, aber wir bleiben bei der neuesten Version, da die Benutzeroberfläche nicht exakt mit der der OpenCart 1.x-Versionen übereinstimmt.
"Layouts" in OpenCart sind das Konzept der Organisation und Bereitstellung von Vorlagen für verschiedene Arten von Seiten im Frontend. Was bedeutet es, wenn Sie eine andere "Art" von Seite sagen? Wenn Sie die verschiedenen Seiten in OpenCart betrachten, werden Sie feststellen, dass die "Struktur" des Layouts nicht auf jeder Seite gleich ist. Das Layout der Seite "Produktliste" stimmt beispielsweise nicht mit dem der Seite "Produktdetails" überein.
Außerdem wird die Struktur in den verschiedenen Seiten wie "Kontoseiten", "Kontaktseite", "Checkout-Seite" usw. variiert. Hier kommt also das Layout ins Bild. Sie können sagen, dass Layouts die Dekorateurvorlagen sind, die die gesamte Seite vorbereiten, indem sie die für das jeweilige Layout verfügbaren Steckplätze und Module ausfüllen.
Andererseits sind Layouts in OpenCart auch hilfreich, um der Seite verschiedene Module zuzuweisen. Wenn Sie beispielsweise ein "Banner" -Modul auf der Produktdetailseite anzeigen möchten, können Sie dies vom Backend aus tun, da das Detaillayout "Produkt" bereits im Kern verfügbar ist. Mit OpenCart können Sie auch neue Layouts vom Backend aus erstellen, sodass Sie die Standardlayouts überschreiben können, die den verschiedenen Seiten des Frontends zugewiesen sind.
Schauen wir uns die in OpenCart verfügbaren integrierten Layouts an. Gehen Sie zum Backend von OpenCart. Gehen Sie in der Navigation zu System> Design> Layouts, Die Kernlayouts werden aufgelistet.
Wie Sie sehen, gibt es eine ganze Liste bereits vorhandener Layouts. Klicke auf das Bearbeiten Ikone der Zuhause Layout (siehe Abbildung oben), um die Layouteinstellungen zu konfigurieren.
Lassen Sie uns verstehen, wofür genau jeder Abschnitt der Konfiguration steht.
Es ist nur der Name des Layouts. Es sollte auf etwas Vernünftiges eingestellt werden, da es uns später während der Modulzuweisung helfen wird.
Wichtig ist hierbei der Wert der Spalte "Route", die OpenCart vorschlägt, immer dann, wenn sich auf der Front-End-Seite eine URL mit "common / home" befindet, diese layoutbezogene Einstellung zu aktivieren. Das bedeutet, dass alle Module, die diesem Layout zugewiesen wurden, während der Homepage-Anfrage im Frontend aktiviert werden.
In diesem Abschnitt können Sie sehen, dass die Module bereits für die Anzeige auf der Startseite konfiguriert sind. Der Position "Inhalt oben" sind drei Module zugeordnet. Sie können jedoch weitere Module hinzufügen, um sie an verschiedenen Positionen auf der Startseite anzuzeigen. Sie können beispielsweise ein Modul "Banner" an der Position "Content Bottom" hinzufügen.
Auf die gleiche Weise können Sie auch die Einstellungen für die anderen Layouts vornehmen. OpenCart bietet eine sehr praktische Schnittstelle, um den verschiedenen Positionen des Layouts Module zuzuordnen.
In den nächsten Abschnitten erfahren Sie, wie Sie ein neues Layout erstellen und dieses Layout verwenden können, um die Kernlayouts von OpenCart zu überschreiben.
Geh rüber zum System> Design> Layouts Seite. Klicke auf das + unterschreiben, um das neue Layout hinzuzufügen. Geben Sie die erforderlichen Informationen wie im folgenden Screenshot gezeigt ein und speichern Sie sie.
Wir haben "Custom Product Layout" als Layoutnamen eingegeben. Wir haben auch das Modul "Banner> Category" der Position "Column Right" zugewiesen. Das bedeutet, dass jedes Mal, wenn unser Layout für jede Anforderung im Frontend aktiviert wird, das Modul "Banner" in der rechten Seitenleiste angezeigt wird.
Es gibt zwei Möglichkeiten, das Layout für jede Frontend-Anforderung zu aktivieren. Die erste Zuordnung, die "Route", wurde bereits in den Layout-Konfigurationseinstellungen beschrieben. Die andere Option ist die Option "Überschreiben", die für bestimmte Seiten des Frontends verfügbar ist. Wir werden mit der zweiten Option für den Verlauf dieses Tutorials fortfahren.
Nachdem wir nun das benutzerdefinierte Layout erstellt haben, prüfen wir, wie Sie die Layout-Überschreibungsfunktion in OpenCart verwenden können. Ich werde das Beispiel der in OpenCart verfügbaren Standardprodukte verwenden, um die Dinge zu vereinfachen.
Gehe zu Katalog> Produkte, Darin werden alle im Geschäft verfügbaren Produkte aufgelistet. Lassen Sie uns das Produkt "iMac" in der Kategorie "Desktops> Mac" bearbeiten.
Wechseln Sie in der Produktbearbeitungsoberfläche zum Design Tab, wo Sie das sehen sollten Layout überschreiben Option für den Standardspeicher. Wählen CustomLayout in der Dropdown-Box und speichern Sie das Produkt.
Sie haben gerade das Standardproduktlayout des Produkts "iMac" mit unserem Layout "CustomLayout" überschrieben! Das bedeutet, dass bei jedem Besuch der Produktdetailseite "iMac" im Frontend "CustomLayout" für diese Seite aktiviert wird. Und wie wir im vorherigen Abschnitt besprochen haben, wird das Modul "Banner" in der Position "Column Right" angezeigt. Testen wir es im Frontend!
Auf die gleiche Weise können Sie Layouts auch für Kategorien überschreiben!
Ich hoffe, Sie sollten ein grundlegendes Verständnis dafür haben, wie Layouts in OpenCart funktionieren. Layouts sind wirklich nützlich, um die Standardlayouts zu überschreiben und Module an verschiedenen Positionen in OpenCart zuzuweisen. Teilen Sie Ihre Gedanken in Form von Kommentaren und Abfragen mit dem folgenden Feed mit!
Accentsconagua