Skip to main content

Best Practices: Ceres

Hier findest du Best Practices zu den Themen Ceres und Webshop.

1. Ceres-Updates sicher testen

In diesem Best Practice erfährst du, welche Schritte nötig sind, um neu veröffentlichte Versionen des Ceres Webshop-Templates zu testen, ohne dass dabei der produktive Betrieb deines Webshops beinträchtigt wird. Durch das Implementieren von neuen Features, das Beheben von Bugs und die Vereinfachung der Benutzeroberfläche kann es immer wieder dazu kommen, dass extern entwickelte Plugins, bei denen Abhängigkeiten zu Ceres bestehen (wie beispielsweise Themes ), bei einem Update auf eine höhere Ceres Version zu Problemen führen. Es ist daher ratsam, eine Kopie der Plugin-Set-Konfiguration zu erstellen, mit deren Hilfe die Kompatibilität zwischen einer neuen Ceres Version und anderen Plugins überprüft werden kann.

1.1. Plugin-Set kopieren

Du solltest zunächst ein neues Plugin-Set erstellen, auf welches du alle Einstellungen deines jetzigen Ceres Webshops überträgst. Gehe dafür wie folgt vor:

Plugin-Set kopieren:

  1. Öffne das Menü Plugins » Plugin Übersicht.

  2. Klicke auf Neues Plugin-Set erstellen.
    → Das Fenster Neues Plugin-Set wird geöffnet.

  3. Gib einen Namen für das Plugin-Set ein, der idealerweise ausdrückt, dass es sich um eine Kopie deines Ceres Shops handelt.

  4. Wähle aus der Dropdown-Liste Plugin-Set kopieren das Plugin-Set aus, dessen Konfiguration du auf das neue Plugin-Set übertragen willst.

  5. Speichere die Einstellungen.
    → Das neue Plugin-Set wird erstellt.

Deine Plugin-Set Kopie enthält nun die gleichen Einstellungen wie dein Ceres Shop. Zu diesem Zeitpunkt sind diese beiden Plugin-Sets deckungsgleich. Es bietet sich an, diesen Vorgang vor jedem größeren Update zu wiederholen, damit die Plugin-Set-Kopie auf einem aktuellen Stand ist.

1.2. Ceres Update auf die Plugin-Set Kopie aufspielen

Im nächsten Schritt solltest du nun die erstellte Kopie des Plugin-Sets auf die aktuelle Ceres Version setzen:

Plugin-Set Update:

  1. Öffne das Menü Plugins » Plugin Übersicht.

  2. Wähle die erstellte Kopie des Plugin-Sets.
    → Das Fenster Plugin-Set Details wird geöffnet.

  3. Klicke in der Zeile des Plugins Ceres auf Aktualisieren in der Spalte Aktion.
    → Das Fenster Plugin aktualisieren wird geöffnet. → Die aktuelle Version des Plugins ist vorausgewählt.

  4. Klicke auf installieren.
    → Das Plugin wird installiert.

  5. Wiederhole die Schritte 3 und 4 für das Plugin IO.

  6. Klicke auf Speichern & Plugins bereitstellen.

Die Kopie des Plugin-Sets befindet sich nun auf einem aktuelleren Stand, als das Plugin-Set, über welches dein Ceres Shop läuft. Klicke nun auf das neu erstelle Plugin-Set in der Plugin-Set Liste auf der linken Seite der Oberfläche. Über die Schaltfläche Plugin-Set Vorschau kannst du deinen Ceres Shop mit dem aktualisierten Plugin-Set im Vorschaumodus aufrufen. Überprüfe nun, ob die Änderungen an Ceres zu Inkompatibilitäten mit dem von dir genutzten Theme führen. Wenn die von dir genutzten externen Plugins nach dem Ceres-Update wie gewünscht laufen, kannst du nun entweder die erstellte Kopie des Plugin-Sets für den Mandanten aktivieren oder die Plugins deines ursprünglichen Plugin-Set wie oben beschrieben aktualisieren.

Manche Abhängigkeiten zwischen externen Plugins und Ceres/IO sind nicht sofort ersichtlich. Es ist daher ratsam, das ursprüngliche Plugin-Set nicht vorschnell zu verwerfen, sodass der Wechsel auf die vorherige Version auch nach ein paar Tagen noch möglich ist, ohne dass die Ceres Konfiguration erneut angepasst werden muss. Im Forum  erfährst du schnell, welche Probleme zwischen externen Plugins und neuen Ceres/IO Versionen bestehen können.

2. Umstieg von Callisto auf Ceres

In diesem Best Practice erfährst du, welche Dinge du beachten musst, damit dein Callisto Webshop ohne Probleme weiterlaufen kann, während du deinen Ceres Shop einrichtest. Die Nummern in den Schritt-für-Schritt Anleitungen beziehen sich auf die durchnummerierten Elemente in den darunter aufgeführten Screenshots.

2.1. Neues Plugin-Set anlegen

Damit du einen Ceres Shop im Vorschau-Modus aufsetzen kannst, ohne dass dein Callisto Shop in irgendeiner Weise davon betroffen ist, musst du zunächst ein neues Plugin-Set erstellen.

Plugin-Set erstellen:

  1. Öffne das Menü Plugins » Plugin Übersicht.

  2. Klicke in der linken oberen Ecke auf Neues Plugin-Set erstellen (1).
    → Das Menü Neues Plugin-Set wird geöffnet.

  3. Gib einen Namen für dein Plugin-Set ein (2).

  4. Speichere die Einstellung (3).
    → Das Plugin-Set wurde erstellt.

bp ceres umstieg neuesPluginSet
bp ceres umstieg neuesPluginSetFenster

Damit der Callisto-Webshop von den vorgenommenen Änderungen unberührt bleibt, darf das erstellte Plugin-Set nicht für einen Mandanten aktiviert werden.

In dem erstellten Plugin-Set kannst du nun damit beginnen, deinen Ceres Webshop einzurichten, ohne dass dein Callisto-Shop im produktiven Betrieb beeinträchtigt wird.

2.2. Plugin-Set einrichten

Nachdem du die Plugins Ceres und IO gekauft  hast, installierst und aktivierst du diese nun für das erstellte Plugin-Set.

Plugin-Set einrichten:

  1. Öffne das Menü Plugins » Plugin-Übersicht.

  2. Klicke auf das zuvor erstellte Plugin-Set (4).
    → Das Fenster Plugin-Set Details wird geöffnet.

  3. Wähle die Option Alle bei den Suchfiltern Herkunft, Installiert und Aktiv (5).

  4. Klicke auf Suchen.
    → Alle gekauften Plugins werden angezeigt.

  5. Klicke in der Zeile des Plugins Ceres auf Plugin installieren in der Spalte Aktion (6).
    → Das Installationsfenster wird geöffnet.
    → Die aktuellste Version des Plugins ist vorausgewählt (7).

  6. Klicke auf Installieren (8).

  7. Aktiviere das Plugin durch Klick auf die Weltkugel. (9)

  8. Wiederhole die Schritte 5 bis 7 für das Plugin IO.

  9. Klicke auf Speichern & Plugins veröffentlichen (10).
    → Solange der Bereitstellungsprozess noch nicht abgeschlossen ist, ist die Schaltfläche Speichern ausgegraut (11) und die Versionsnummer des Plugins in der Spalte Version aktiv entspricht nicht der des installierten Plugins (12) .

bp ceres umstieg pluginSetAuswahl
bp ceres umstieg installieren
bp ceres umstieg installierte version
bp ceres umstieg aktivieren und bereitstellen
bp ceres umstieg ausgegraut

Damit sind die Vorarbeiten geleistet und du kannst damit beginnen, deinen Ceres Shop einzurichten. Ziehe hierzu die Handbuchseiten Schnelleinstieg und Ceres einrichten zu Rate. Wie du Änderungen an deinem Webshop im Vorschaumodus testest, erfährst du im Folgenden.

2.3. Ceres Webshop im Vorschaumodus testen

Damit du deine Änderungen jederzeit im Webshop nachverfolgen kannst, bietet dir die Plugin Übersicht die Option, deinen Shop im Vorschaumodus aufzurufen. Bevor du deinen Ceres Shop im Vorschaumodus aufrufst, solltest du dein Plugin-Set erneut über die Schaltfläche Speichern & Plugin-Set veröffentlichen bereitstellen.

Plugin-Set als Vorschau öffnen:

  1. Öffne das Menü Plugins » Plugin-Übersicht.

  2. Klicke auf das zuvor erstellte Plugin-Set.
    → Das Fenster Plugin-Set Details wird geöffnet.

  3. Klicke auf den Plugin-Set Vorschau (13). → Der Webshop wird mit dem gewählten Plugin-Set in einem neuen Browser-Tab geöffnet.

bp ceres umstieg vorschau

Beachte, dass du Popups erlaubt haben solltest, damit der Shop im neuen Browser-Tab geöffnet werden kann.

2.4. Ceres Webshop produktiv schalten

Wenn alle deine Tests im Vorschaumodus abgeschlossen sind und du nun deinen Callisto Shop durch Ceres ersetzen willst, aktivierst du das Plugin-Set für den jeweiligen Mandanten. Diese Verknüpfung kann, falls nötig, auch wieder aufgehoben werden. Du kannst also jederzeit zu deinem alten Webshop zurückwechseln.

Plugin-Set für einen Mandanten aktivieren:

  1. Öffne das Menü Plugins » Plugin-Übersicht.

  2. Klicke auf das zuvor erstellte Plugin-Set.
    → Das Fenster Plugin-Set Details wird geöffnet.

  3. Klicke in der linken oberen Ecke auf Plugin-Set aktivieren.
    → Das Fenster Plugin-Set Aktivieren wird geöffnet.

  4. Wähle das Plugin-Set aus der Dropdown-Liste (14), das du mit dem jeweiligen Mandanten (15) verknüpfen willst.

  5. Speichere die Einstellungen (16).
    → Die Erfolgsmeldung Plugin-Set X ist für Mandant Y aktiv wird angezeigt.

bp ceres umstieg aktivieren
bp ceres umstieg aktivierenFenster

Damit ist der Ceres Webshop produktiv geschaltet und ersetzt deinen Callisto Webshop.

3. Callisto EOL (End of Life) - Welchen Bestellvorgang nutze ich?

Der Webshop auf Basis des Ceres-Plugins wird mittelfristig alle alten Callisto-Webshops ersetzen. Bestimmte Funktionalitäten von Callisto werden in diesem Zuge nach und nach abgeschaltet. Auf der EOL-Seite findest du eine Übersicht über alle Daten, die für die Abschaltung relevant sind.
Dieses Kapitel soll dir dabei helfen, den Überblick über den Stand von Callisto zu behalten und erklärt dir, in welchen Fällen du zu welchem Zeitpunkt aktiv werden musst.

Das Wichtigste vorab
  • Dieses Kapitel richtet sich nur an Nutzer:innen, die einen Callisto-Webshop betreiben. Wenn dein Shop bereits komplett auf Ceres-Basis läuft, ist dieses Kapitel für dich nicht interessant.

  • Wir empfehlen, dass ihr euch rechtzeitig mit der Umstellung von Callisto auf Ceres beschäftigt. Selbst wenn manche Callisto-Webshops noch bis ins dritte Quartal 2020 funktionieren werden, haben wir die Softwarepflege bereits im Herbst 2018 eingestellt und unsere Ressourcen fließen in die Weiterentwicklung von Ceres.

3.1. Bestellvorgänge in Callisto

Da bestimmte Funktionen von Callisto zu unterschiedlichen Zeitpunkten abgeschaltet werden, besteht die Gefahr, dass Nutzer:innen sich gegebenenfalls nicht sicher sind, zu welchem Zeitpunkt sie aktiv werden müssen, um ihren Webshop weiter betreiben zu können.
Der wichtigste Aspekt hierbei ist der individuelle Bestellvorgang und der Termin an dem dieser eingestellt wird:

Tabelle 1. Bestellvorgang in Callisto
Bestellvorgang Termin der Abschaltung

Individueller Bestellvorgang

02.06.2020

Für Kunden und Kundinnen, die den Callisto-Bestellvorgang nutzen (also alle, deren Webshop nicht komplett auf Ceres aufbaut), bedeutet die Abschaltung, dass sie bis zum betreffenden Termin den Ceres-Checkout, also die Kaufabwicklung auf Basis des Ceres-Plugins, einbauen müssen. Im verlinkten Best Practice erfährst du Schritt für Schritt was dabei zu beachten ist.

Solltest du dich selbst nicht in der Lage dazu sehen, den Ceres-Checkout selbst einzubauen, findest du auf dem Marketplace  einige Angebote für den professionellen Umstieg.

Auch unsere Partneragenturen  können dir weiterhelfen.

Der Umstieg auf den Ceres-Checkout oder einen reinen Ceres-Webshop ist zu den betreffenden Terminen zwingend erforderlich, da ansonsten keine Bestellungen mehr über deinen Webshop abgeschlossen werden können.

3.2. Welchen Bestellvorgang nutze ich?

In diesem Forumsbeitrag  wurde angekündigt, dass ab sofort eine Meldung in deinem plentymarkets Backend angezeigt wird, die dich darüber informiert, welchen Bestellvorgang du nutzt und zu welchem Zeitpunkt dieser abgeschaltet wird.

  • Der Hinweis für den Individuellen Bestellvorgang wird rot dargestellt.

bp EOL hinweis
Bild 1. EOL-Hinweis im Backend

Dies reicht bereits aus um festzustellen, welchen Bestellvorgang du in deinem Callisto-Webshop nutzt. Wenn du dies allerdings selbst überprüfen möchtest, gehe wie folgt vor:

Bestellvorgang überprüfen:

  1. Öffne das Menü CMS » Webdesign.

  2. Wähle links in der Dropdown-Liste das entsprechende Layout, das du prüfen möchtest. Bei mehreren Mandanten können mehrere Layouts aktiv sein. In diesem Fall solltest du alle Layouts einzeln prüfen.

  3. Klicke auf Einstellungen.

  4. Wechsel in das Tab Mandanten.

  5. Wähle auf der linken Seite den für das Layout aktivierten Mandanten.
    → Um zu erfahren, für welche Mandanten das Layout aktiviert ist, fahre mit der Maus über die Layout Dropdown-Liste. Im Tooltip werden dir die Mandanten angezeigt.

  6. Wechsle auf der rechten Seite in das Tab Bestellvorgang.

  7. Unter Art des Bestellvorgangs wird dir angezeigt, welcher Bestellvorgang in diesem Layout im Einsatz ist.
    → Je nachdem ob du den Standard-Bestellvorgang oder den Individuellen Bestellvorgang nutzt, musst du zum oben genannten Zeitpunkt auf Ceres umsteigen.

3.3. Nächste Schritte

Du hast überprüft, welchen Bestellvorgang du nutzt und zu welchem Termin du spätestens auf Ceres oder den Ceres-Checkout wechseln musst.

Deine Optionen sind nun die folgenden:

  • Du kannst den Ceres-Checkout in deinen Callisto-Webshop integrieren und deinen Callisto-Shop noch bis Q3 2020 betreiben.

  • Du kannst direkt einen Ceres-Webshop einrichten und sparst dir damit eine erneute Umstellung im dritten Quartal 2020.

Egal ob neuer Ceres-Shop oder Callisto mit Ceres-Checkout: Führe Änderungen in einem separaten Plugin-Set durch, sodass der Live-Betrieb deines Webshops nicht beeinträchtigt wird. Hier erfährst du, wie du den Umstieg sicher über die Bühne bringst.

3.4. Weiterführende Informationen

4. Ceres-Checkout in Callisto einrichten

Du willst den neuen Checkout mit seiner Plugin-Fähigkeit und individuellen Anpassbarkeit in deinem Callisto-Webshop nutzen? Kein Problem – im Folgenden erfährst du Schritt für Schritt, was dafür nötig ist. Solltest du noch weitere Unterstützung bei der Integration des Ceres-Checkouts in Callisto brauchen, schau bei unserem Service-Angebot auf dem Marketplace  vorbei.

4.1. Ceres-Checkout für Callisto-Webshops mit individuellem Bestellvorgang

Das Wichtigste vorab …
  • Dieses Best Practice beschreibt die Einrichtung des Ceres-Checkouts in einen Callisto-Webshop. Kopiere dir bitte dein Design und führe keine Anpassungen an deinem aktiven Layout durch.

  • Diese Anleitung bezieht sich auf Ceres-Checkouts, die nicht mit dem ShopBuilder erstellt wurden.

  • Um den Ceres-Checkout zu nutzen, benötigst du neben deinem Callisto-Webshop die aktuellen Versionen der Plugins Ceres und IO . Beide findest du im plentyMarketplace. Die Plugins müssen in einer Plugin-Set-Kopie installiert und aktiviert sein.

  • Um deine Zahlungsanbieter im Ceres-Checkout benutzen zu können, musst du die jeweiligen Plugins aus dem Marketplace  laden und installieren. Bitte beachte, dass es Zahlungsanbieter gibt, die bislang kein Plugin zur Verfügung stellen und auf deren Leistungen du daher mit dem Ceres-Checkout nicht zurückgreifen kannst.

Callisto-URL-Struktur für Artikel aktivieren

Wenn du einen Callisto-Webshop mit Ceres-Checkout nutzen möchtest, raten wir dir von der Option Callisto-URL-Struktur für Artikel aktivieren Gebrauch zu machen, um deine SEO-Werte nicht negativ zu beinflussen. Du findest die Einstellung im Menü Plugin-Übersicht » Ceres » Konfiguration » Global.

In einer Plugin-Set-Kopie arbeiten

Damit der Live-Betrieb des Webshops beim Testen des Ceres Checkouts nicht beeinträchtigt wird, bietet es sich an, die Änderungen in einem separaten Plugin-Set zu testen. Wie du eine Kopie deines Plugin-Sets erstellst, erfährst du in diesem Best Practice. Führe die Änderungen zuerst im Vorschaumodus aus, bevor du sie in deinen Webshop übernimmst.

Wenn du in deinem Callisto-Shop den individuellen Bestellvorgang nutzt, musst du den Ceres-Checkout bis spätestens 02.06.2020 eingebunden haben, da ansonsten keine Bestellungen mehr über deinen Webshop abgeschlosen werden können.

Wenn du die folgenden Anweisungen Schritt für Schritt durcharbeitest, kannst du deinen Callisto-Shop mit wenigen Handgriffen mit dem Ceres-Checkout ausstatten.

4.1.1. Routen verwalten

Ceres baut auf der Logik des Plugins IO auf. Um den Checkout so zu nutzen, dass alle Links zwischen Callisto und Ceres korrekt funktionieren, verfährst du wie folgt:

Einstellungen in IO vornehmen:

  1. Öffne das Menü Plugins » Plugin-Übersicht.

  2. Klicke auf IO.
    → Das Plugin wird geöffnet.

  3. Klicke im Verzeichnisbaum auf Konfiguration.

  4. Wechsle in das Tab Routing.

  5. Entferne das Häkchen neben Routen aktivieren.
    → Alle Routen werden deaktiviert.

  6. Aktiviere die Routen /checkout, /confirmation, /login, /register, password-reset, /place-order & /execute-payment, und /my-account.

  7. Speichere die Einstellungen.

Einstellungen in Ceres vornehmen:

  1. Öffne das Menü Plugins » Plugin-Übersicht.

  2. Klicke auf Ceres.
    → Das Plugin wird geöffnet.

  3. Klicke im Verzeichnisbaum auf Konfiguration.
    → Das Tab Global ist bereits vorausgewählt.

  4. Klicke auf Callisto-URL-Struktur für Artikel aktivieren.
    → Die Callisto-Routen werden aktiviert.

  5. Speichere die Einstellungen.
    → Der Ceres-Checkout ist in Ihrem Callisto-Webshop aktiv.

4.1.2. Bestellabwicklung anpassen

Für die Bestellabwicklung müssen Änderungen an deinen Kategorien vorgenommen werden. Gehe dazu wie folgt vor:

Kategorien erstellen:

  1. Öffne das Menü Artikel » Kategorien.

  2. Erstelle eine neue Hauptkategorie mit dem Namen login.

  3. Öffne die Kategorie login.

  4. Wähle den Kategorietyp Container.

  5. Speichere die Einstellungen.

  6. Erstelle eine neue Hauptkategorie mit dem Namen checkout.

  7. Öffne die Kategorie checkout.

  8. Wähle den Kategorietyp Container.

  9. Speichere die Einstellungen.

Anschließend verknüpfst du die neuen Kategorien mit den Bestellschritten von Callisto.

Bestellvorgang anpassen:

  1. Öffne das Menü CMS » Webdesign.

  2. Klicke auf Einstellungen.
    → Das Menü Design-Einstellungen wird geöffnet.

  3. Wechsle in das Tab Mandanten.

  4. Wähle den Mandanten, für den du die Änderungen vornehmen willst.

  5. Wechsle in das Tab Bestellvorgang.

  6. Klicke neben 2. Bestellschritt auf Suchen.

  7. Wähle die zuvor erstellte Kategorie login.

  8. Klicke neben 3. Bestellschritt auf Suchen.

  9. Wähle die zuvor erstellte Kategorie checkout.

  10. Speichere die Einstellungen.

Wenn du nun aus dem Warenkorb zur Kasse gehst, wirst du auf den Ceres-Checkout weitergeleitet, der alle neuen Funktionen wie z.B. Payment-Plugins wie PayPal ermöglicht.

Damit ein nicht angemeldeter Benutzer nach dem Klick auf Zur Kasse vom Login weiter zur Bestellabwicklung geleitet wird, müssen Änderungen am Callisto-Code vorgenommen werden. Gehe dazu vor wie im Folgenden beschrieben:

Backlinks für den Warenkorb setzen:

  1. Öffne das Menü Artikel » Kategorien.

  2. Klappe deine Callisto-Kategorie auf.

  3. Klicke auf die Kategorie Warenkorb.

  4. Wechsle in das Tab Beschreibung 1.

  5. Suche den folgenden Code: {% if ( $CustomerID ) { Link_Checkout(3); } else { Link_Checkout(2); } %}

  6. Ersetze den Code durch: $_check.$_backlink

  7. Speichere die Einstellungen.

In der Zeile vor dem gerade eingefügten $_check.$_backlink musst du nun noch den folgenden Code einfügen:

{% if( $CustomerID ) %}
	{% $_check = Link_Checkout(3); %}
	{% $_backlink = ''; %}
{% else %}
	{% $_check = Link_Checkout(2); %}
	{% $_backlink = '?backlink='; %}
	{% if $Lang !== 'de' %}
	  {% $_backlink = $_backlink . '/' . $Lang; %}
	{% endif %}
	{% $_backlink .= '/checkout'; %}
{% endif %}

Speichere deine Änderungen am Code.
Das de in der Zeile {% if $Lang !== 'de' %} bezieht sich hier auf die Standardprache des Webshops. Falls die Standardsprache nicht Deutsch ist, muss das Sprachkürzel entsprechend angepasst werden.

Backlinks für die Warenkorbvorschau setzen:

  1. Öffne das Menü CMS » Webdesign » Layout » ItemView » ItemViewBasketPreviewList.

  2. Suche den folgenden Code: {% if( $CustomerID ) { Link_Checkout(3); } else { Link_Checkout(2); } %}

  3. Ersetze den Code durch $_check.$_backlink

  4. Speichere die Einstellungen.

In der Zeile vor dem gerade eingefügten $_check.$_backlink musst du nun noch den folgenden Code einfügen:

{% if( $CustomerID ) %}
	{% $_check = Link_Checkout(3); %}
	{% $_backlink = ''; %}
{% else %}
	{% $_check = Link_Checkout(2); %}
	{% $_backlink = '?backlink='; %}
	{% if $Lang !== 'de' %}
	  {% $_backlink = $_backlink . '/' . $Lang; %}
	{% endif %}
	{% $_backlink .= '/checkout'; %}
{% endif %}

Speichere deine Änderungen am Code.
Das de in der Zeile {% if $Lang !== 'de' %} bezieht sich hier auf die Standardprache des Webshops. Falls die Standardsprache nicht Deutsch ist, muss das Sprachkürzel entsprechend angepasst werden.

Backlinks für das Warenkorb-Overlay setzen:

  1. Öffne das Menü CMS » Webdesign » Layout » ItemView » ItemViewItemToBasketConfirmationOverlay.

  2. Suche den folgenden Code: {% if( $CustomerID ) { Link_Checkout(3); } else { Link_Checkout(2); } %}

  3. Ersetze den Code durch: $_check.$_backlink

  4. Speichere die Einstellungen.

In der Zeile vor dem gerade eingefügten $_check.$_backlink musst du nun noch den folgenden Code einfügen:

{% if( $CustomerID ) %}
	{% $_check = Link_Checkout(3); %}
	{% $_backlink = ''; %}
{% else %}
	{% $_check = Link_Checkout(2); %}
	{% $_backlink = '?backlink='; %}
	{% if $Lang !== 'de' %}
	  {% $_backlink = $_backlink . '/' . $Lang; %}
	{% endif %}
	{% $_backlink .= '/checkout'; %}
{% endif %}

Speichere deine Änderungen am Code.
Das de in der Zeile {% if $Lang !== 'de' %} bezieht sich hier auf die Standardprache des Webshops. Falls die Standardsprache nicht Deutsch ist, muss das Sprachkürzel entsprechend angepasst werden.

Kunden, die zusätzliche individuelle Anpassungen an ihrem Layout vorgenommen haben, müssen überprüfen an welchen Stellen sie ihre Kunden zur Kaufabwicklung weiterleiten. Diese Stellen müssen so angepasst werden, dass sie auf die Route /checkout verlinken. Wir können diese individuellen Anpassungen nicht abfangen, da sie von Kunde zu Kunde anders ausfallen können.

Der Ceres-Checkout wird sich von deinem bisherigen Callisto-Layout optisch unterscheiden. Du kannst Header und Footer des Checkouts und des Warenkorbs global über den ShopBuilder bearbeiten. Den Checkout selbst wirst du mit Ceres Version 3.1.0 über den ShopBuilder bearbeiten können. Weiterhin kannst du eigene Anpassungen über ein Theme realisieren.

Passe nun noch die Pfade für deine rechtlichen Angaben an.

4.1.4. Rechtliche Angaben anpassen

Die vier rechtlich relevanten Angaben AGB, Datenschutzerklärung, Impressum und Widerrufsrecht müssen neu verknüpft werden, um weiterhin korrekt angezeigt zu werden.

AGB anpassen:

  1. Öffne das Menü Artikel » Kategorien.

  2. Klappe deine Callisto-Kategorie, in der die rechtlichen Angaben liegen, auf.

  3. Kopiere die Kategorie AGB als Hauptkategorie.
    → Die neue Hauptkategorie AGB wird geöffnet.

  4. Gib als URL-Name der Kategorie gtc ein.

  5. Speichere die Einstellungen.

Datenschutzerklärung anpassen:

  1. Öffne das Menü Artikel » Kategorien.

  2. Klappe deine Callisto-Kategorie, in der die rechtlichen Angaben liegen, auf.

  3. Kopiere die Kategorie Datenschutz als Hauptkategorie.
    → Die neue Hauptkategorie Datenschutz wird geöffnet.

  4. Gib als URL-Name der Kategorie privacy-policy ein.

  5. Speichere die Einstellungen.

Impressum anpassen:

  1. Öffne das Menü Artikel » Kategorien.

  2. Klappe deine Callisto-Kategorie, in der die rechtlichen Angaben liegen, auf.

  3. Kopiere die Kategorie Impressum als Hauptkategorie.
    → Die neue Hauptkategorie Impressum wird geöffnet.

  4. Gib als URL-Name der Kategorie legal-disclosure ein.

  5. Speichere die Einstellungen.

Widerrufsrecht anpassen:

  1. Öffne das Menü Artikel » Kategorien.

  2. Klappe deine Callisto-Kategorie, in der die rechtlichen Angaben liegen, auf.

  3. Kopiere die Kategorie Widerrufsrecht als Hauptkategorie.
    → Die neue Hauptkategorie Widerrufsrecht wird geöffnet.

  4. Gib als URL-Name der Kategorie cancellation-rights ein.

  5. Speichere die Einstellungen.

Wenn du deine rechtlichen Angaben gespeichert hast, die Routen wie beschrieben aktiviert wurden, die Kategorien angepasst wurden, die Backlinks gesetzt sind und du alle für deinen Shop relevanten Zahlungs- und Versanddienstleister über Plugins eingebunden hast, ist dein Ceres-Checkout einsatzfähig und du hast die Hürden des Callisto EOLs gemeistert.

5. Filter einrichten

Filter werden in Ceres mithilfe von Attributen und Merkmalen abgebildet. In diesem Best Practice wird beschrieben, wie der Filter Farbe mit den zwei Werten Rot und Schwarz in der Kategorie-Ansicht des Webshops angezeigt wird. Passende Filter werden in der Kategorie-Ansicht nur eingeblendet, wenn es auch Artikel gibt, die mit diesen Filterwerten verknüpft sind.

Das Wichtigste vorab …​
  • Hierbei handelt es sich um ein Best Practice für das Webshop-Plugin Ceres. Ceres ist im plentyMarketplace  verfügbar und läuft auf plentymarkets Systemen. Die Filter aus Ceres werden auch in individuellen Theme-Plugins angezeigt, sofern diese in den Themes nicht überschrieben wurden.

  • Eine Integration in individuelle oder veränderte Template-Plugins ist möglich, bedarf aber individueller Anpassungen, die an dieser Stelle nicht berücksichtigt werden können.

  • Filter können mittels Facetten über Attribute und Merkmale dargestellt werden. In diesem Best Practice werden Filter am Beispiel von Attributen eingerichtet. Filter über Merkmale werden analog eingerichtet. Hierbei legst du eine Merkmalgruppe an, in der du deine Merkmale vom Typ Kein organisierst. Die Merkmale verknüpfst du mit Facetten-Werten.

  • Das Menü Einrichtung » Mandant » Global » Dienste » Facettensuche ist bei plentymarkets Zero-System nur im zentralen Login aktiviert.

5.1. Attribut anlegen

Wir starten also mit einem Attribut.

  1. Öffne das Menü Einrichtung » Artikel » Attribute.

  2. Klicke auf Neues Attribut.

  3. Gib den internen Namen ein, z.B. Farbe.

  4. Speichere die Einstellungen.
    → Das Attribut wird angelegt und das Tab Einstellungen geöffnet.

  5. Wechsle in das Tab Name.

  6. Gib die Übersetzungen für dein Attribut ein.

  7. Wechsle in das Tab Werte.

  8. Klicke auf Neuer Wert.

  9. Gib den internen Namen ein, z.B. Rot.

  10. Wiederhole die Schritte 8 und 9 für den Wert Schwarz.

  11. Speichere die Einstellungen.

Das Attribut mit unseren beiden Werten Rot und Schwarz wird angelegt. Hier kannst du auch weitere Werte wie Fuchsrot oder Karminrot erstellen und in der gleichen Facette Rot verknüpfen.

5.2. Attribut mit Artikel verknüpfen

Attribute verknüpfst du beim Erstellen eines Artikels mit der Hauptvariante des Artikels. Wenn du weitere Varianten erstellst, verknüpfst du diese Varianten ebenfalls mit Attributwerten. Ich erstelle nun meine Varianten im Tab Varianten meines Artikels. Diese Varianten müssen im Webshop aktiv sein, damit später unser Filter eingeblendet wird.

bp ceres filter varianten
Bild 2. Varianten mit passenden Attributwerten

5.3. Facette einrichten

Unsere Filter werden mittels Facetten im Webshop abgebildet. Wir müssen also noch eine neue Facette einrichten und anschließend unsere Attributwerte und den gewünschten Mandanten mit dieser verknüpfen.

  1. Öffne das Menü Einrichtung » Mandant » Global » Dienste » Facettensuche.

  2. Klicke auf Neu, um eine neue Facette hinzuzufügen.

  3. Gib einen Namen für die Facette in der Systemsprache ein, z.B. Farbe.

  4. Wähle den Typ Attribut/Merkmal.

  5. Gib die Position ein, an der die Facette im Webshop erscheinen soll.

  6. Speichere die Einstellungen.

5.4. Attributwerte mit Facette verknüpfen

  1. Öffne das Menü Einrichtung » Mandant » Global » Dienste » Facettensuche.

  2. Öffne die Facette.

  3. Wechsle in das Tab Name.

  4. Gib die Übersetzungen für deine Facette ein.

  5. Wechsle in das Tab Werte.

  6. Klicke auf Wert hinzufügen.

  7. Gib den Namen ein, z.B. Rot.

  8. Gib die Position ein.

  9. Speichere die Einstellungen.
    → Der Facetten-Wert wird hinzugefügt.

  10. Gib im Tab Name die Übersetzungen für deinen Facetten-Wert ein.

  11. Wechsle in das Tab Verknüpfung.

  12. Öffne das Attribut Attribute » Farbe » Rot.

  13. Klicke auf Verknüpfen.

  14. Wiederhole die Schritte 6 bis 13 für den Wert Schwarz.

  15. Speichere die Einstellungen.

bp ceres filter facetten
Bild 3. Verknüpfte Facetten-Werte

5.5. Mandanten mit Facette verknüpfen

  1. Öffne das Menü Einrichtung » Mandant » Mandant wählen » Dienste » Facettenverknüpfung.

  2. Wähle die Facette aus.

  3. Klicke auf Facette verknüpfen.
    → Die Facette wird mit dem ausgewählten Mandanten verknüpft.

  4. Speichere die Einstellungen.

5.6. Plugin bereitstellen

Nun stellen wir unser Plugin-Set noch einmal im Menü Plugins » Plugin Übersicht durch Klick auf Speichern & Plugins bereitstellen bereit, um die Änderungen zu übernehmen und erhalten die Filter in der Suche und in der Kategorie-Ansicht.

bp ceres filter frontend
Bild 4. Gewählter Filter in Kategorie-Ansicht

6. Bestellmerkmale einrichten

In diesem Best Practice richten wir ein Merkmal ein, mit dem man einen Text eingeben kann, der auf ein T-Shirt gedruckt werden soll. Bei einer Eingabe wird ein Aufpreis auf das Produkt berechnet.

Das Wichtigste vorab …
  • Hierbei handelt es sich um ein Best Practice für das Webshop-Plugin Ceres. Ceres ist im plentyMarketplace  verfügbar und läuft auf plentymarkets Systemen.

  • Eine Integration in individuelle oder veränderte Template-Plugins ist möglich, bedarf aber individueller Anpassungen, die an dieser Stelle nicht berücksichtigt werden können.

6.1. Bestellmerkmal anlegen

Wir beginnen mit dem Merkmal.

  1. Öffne das Menü Einrichtung » Artikel » Merkmale.

  2. Wechsle in das Tab Neues Merkmal.

  3. Gib bei Name (intern) die Bezeichnung ein, die das Merkmal in deinem Backend haben soll.

  4. Unter Webshop gibst du bei Name die Bezeichnung ein, die deinem Kunden in der Artikelansicht angezeigt werden soll, in unserem Beispiel "T-Shirt-Druck".

  5. Unter Merkmaltyp wählst du Text aus.

  6. Unter Aufpreis gibst du die Kosten ein, die bei der Nutzung des Merkmals entstehen, z.B. 12,00 Euro für einen T-Shirt-Druck.
    → Setze einen Haken bei Als Zusatzkosten darstellen, damit der Kunde in der Artikelansicht sieht, welchen Aufpreis er für das Merkmal zahlt.

  7. Unter Anzeige setzt du einen Haken bei jeder Checkbox, um die Zusatzkosten im gesamten Bestellvorgang transparent zu halten.

  8. Setze einen Haken bei Bestellmerkmal, um das Merkmal als solches festzulegen.

  9. Speichere die Einstellungen.
    → Das Merkmal ist angelegt.

Deine Maske sollte nun aussehen wie hier:

bp ceres bestellmerkmale einstellungen
Bild 5. Einstellungen des Bestellmerkmals

6.2. Bestellmerkmal mit Artikel verknüpfen

Merkmale werden mit dem Artikel selbst verknüpft. Dazu gehst du wie folgt vor:

  1. Öffne das Menü Artikel » Artikel bearbeiten.

  2. Wähle einen Artikel, mit dem das Merkmal verknüpft werden soll.

  3. Wechsle in das Tab Merkmale.

  4. Setze unter Weitere Merkmale aktivieren » Merkmale ohne Gruppe einen Haken bei dem erstellten Merkmal.

  5. Speichere die Einstellungen.
    → Das Merkmal ist mit dem Artikel verknüpft und wird unter Merkmale angezeigt.

Aufpreise

Unter Merkmale kann abermals ein Aufpreis angegeben werden. Gibst du hier einen Wert ein, überschreibt dieser den im Merkmal hinterlegten Aufpreis.

bp ceres bestellmerkmale artikel
Bild 6. Einstellungen am Artikel

6.3. Plugin bereitstellen

Nun stellen wir unser Plugin-Set noch einmal durch Klcik auf Speichern & Plugins bereitstellen bereit, um die Änderungen zu übernehmen, und erhalten das Bestellmerkmal in Artikelansicht und im Warenkorb.

bp ceres bestellmerkmale artikelansicht
Bild 7. Artikelansicht im Webshop

Gibt der Kunde etwas in das Textfeld ein, wird der Text hinterlegt und der Aufpreis zum Artikelpreis addiert.

bp ceres bestellmerkmale warenkorb
Bild 8. Artikelansicht im Warenkorb

6.4. Bestellmerkmal als Checkbox einrichten

In diesem Best Practice richten wir ein Bestellmerkmal ein, welches als Checkbox in der Artikeleinzelansicht angezeigt wird. Beim Aktivieren der Checkbox wird ein Aufpreis auf das Produkt berechnet.

6.4.1. Merkmalgruppe erstellen

Zunächst legen wir eine neue Merkmalgruppe an. In unserem Beispiel möchten wir, dass Sofa-Zubehör über eine Checkbox zum Produkt dazu gebucht werden kann.

  1. Öffne das Menü Einrichtung » Artikel » Merkmale.

  2. Öffne das Tab Neue Merkmalgruppe.

  3. Gib bei Name (intern) einen Namen für die Merkmalgruppe im Backend ein.

  4. Im Bereich Sprache kannst du für jede Sprache einen eigenen Namen und eine Beschreibung eingeben, die im Webshop angezeigt werden.

  5. Wähle die Option Keine aus der Dropdown-Liste für Gruppierung von Bestellmerkmalen (Typ: "Kein").

  6. Speichere die Einstellungen.

bp ceres bestellmerkmale merkmalgruppe
Bild 9. Merkmalgruppe erstellen
Merkmalgruppe erstellen
BP Ceres Order Property Checkbox 1

6.4.2. Bestellmerkmal anlegen

Nachdem wir eine Merkmalgruppe für Sofa-Zubehör angelegt haben, möchten wir nun ein neues Merkmal, z.B. ein Sofakissen, anlegen und dieses mit der Merkmalgruppe verknüpfen.

  1. Öffne das Menü Einrichtung » Artikel » Merkmale.

  2. Wechsle in das Tab Neues Merkmal.

  3. Gib bei Name (intern) einen Namen für das Merkmal im Backend ein.

  4. Im Bereich Webshop kannst du für jede Sprache einen eigenen Namen und eine Beschreibung eingeben, die im Webshop angezeigt werden.

  5. Wähle bei Merkmalgruppe die eben erstellte Merkmalgruppe aus der Dropdown-Liste aus.

  6. Wähle die Option Kein aus der Dropdown-Liste Merkmaltyp aus.

  7. Unter Aufpreis gibst du die Kosten an, die bei der Nutzung des Merkmals entstehen, z.B. 15,00 Euro für ein Sofakissen.
    → Setze einen Haken bei Als Zusatzkosten darstellen, damit der Kunde in der Artikelansicht sieht, welchen Aufpreis er für das Merkmal zahlt.

  8. Setze im Bereich Anzeige die Haken an den Stellen, an denen das Merkmal angezeigt werden soll.

  9. Aktiviere die Checkbox bei Bestellmerkmal.

  10. Speichere die Einstellungen.

Das Bestellmerkmal Sofakissen wurde nun erfolgreich angelegt.

bp ceres bestellmerkmale neues merkmal
Bild 10. Neues Bestellmerkmal anlegen

6.4.3. Bestellmerkmal mit Artikel verknüpfen

Zu guter Letzt müssen wir die gewünschten Artikel mit dem gerade erstellten Bestellmerkmal verknüpfen.

  1. Öffne das Menü Artikel » Artikel bearbeiten.

  2. Wähle einen Artikel, der mit dem erstellten Merkmal verknüpft werden soll.

  3. Wechsle in das Tab Merkmale.

  4. Setze unter Weitere Merkmale aktivieren einen Haken bei dem Merkmal in der erstellten Merkmalgruppe .

  5. Speichere die Einstellungen.
    → Das Merkmal wird mit dem Artikel verknüpft.

bp ceres bestellmerkmale verknuepfung
Bild 11. Bestellmerkmal mit Artikel verknüpfen
Änderungen anzeigen

Bitte beachten Sie, dass es etwa 15 Minuten dauern kann, bis die Änderungen im Webshop abgezeigt werden, da dies das Intervall ist, in dem der ElasticSearch Index erneuert wird.

7. Cross-Selling einrichten

Diese Best Practice Anleitung unterstützt Sie beim Einrichten von Cross-Selling-Artikellisten in Ceres.

Das Wichtigste vorab …​
  • Hierbei handelt es sich um ein Best Practice für das Webshop-Plugin Ceres. Ceres ist im plentyMarketplace  verfügbar und läuft auf plentymarkets Systemen.

  • Dieses Best Practice setzt voraus, dass bereits Cross-Selling-Beziehungen am Artikel hinterlegt sind. Wie Sie Cross-Selling-Einstellungen für Ihre Artikel vornehmen, erfahren Sie hier.

7.1. Cross-Selling-Artikellisten konfigurieren

Öffnen Sie das Menü Plugins » Plugin-Übersicht » Ceres » Konfiguration » Item lists. Hier stellen Sie ein, welche Art von Artikellisten Sie in Ihrem Webshop verwenden wollen. Im Feld Cross-selling: Cross-selling relation (Punkt 1 im Bild) wählen Sie den Typ der Cross-Selling Beziehung aus, den Ihre Artikelliste abbilden soll. Ihnen stehen dabei die Optionen Similiar (für ähnliche Artikel), Accessory (für Zubehör), Replacement part (für Ersatzteile) oder Collection (für Artikelpakete) zur Verfügung. Diese Auswahl bezieht sich auf alle Cross-Selling-Artikellisten, die Sie in Ihrem Webshop einrichten möchten.

Im nächsten Schritt legen Sie fest, welche Artikeliste genutzt werden soll. Hierfür bearbeiten Sie das Feld First item list, Second item list oder Third item list und wählen Cross-selling aus der Dropdown-Liste. Im unteren Beispiel wurde die Second item list bearbeitet (Punkt 2 im Bild). In den Eingabefeldern Name of the second item list (DE) und Name of the second item list (EN) kann nun noch ein Name für die Artikelliste definiert werden, jeweils für die deutschsprachige und die englischsprachige Ansicht.

Wenn Sie alle Einstellungen getroffen haben, klicken Sie auf Speichern.

bp ceres cross selling konfig
Bild 12. Cross-Selling einrichten

7.2. Cross-Selling-Artikellisten im Webshop anzeigen

Nachdem Sie festgelegt haben, welche Artikelliste für Cross-Selling verwendet werden soll, legen Sie nun fest, an welcher Stelle im Webshop die Artikelliste angezeigt werden soll.

Öffnen Sie das Menü CMS » Container-Verknüpfungen. Hier scrollen Sie zu der Artikelliste, die Sie als Cross-Selling-Artikelliste konfigueriert haben, also First item list, Second item list oder Third item list. Nun wählen Sie den Layout-Container, in dem Sie die Artikelliste anzeigen lassen möchten. Im unteren Beispiel lassen wir die zweite Artikelliste im Container der Artikeleinzelansicht anzeigen.

bp ceres cross selling container
Bild 13. Container für Artikelliste wählen
Änderungen anzeigen

Bitte beachten Sie, dass es etwa 15 Minuten dauern kann, bis die Änderungen im Webshop abgezeigt werden, da dies das Intervall ist, in dem der ElasticSearch Index erneuert wird.

8. Weitere Cross-Selling Artikellisten anzeigen

Da Ceres nativ nur eine Cross-Selling Artikelliste gleichzeitig abbildet, erfährst du in diesem Best Practice, welche Anpassungen erforderlich sind, damit du mehrere unterschiedliche Cross-Selling Artikellisten in deinem Ceres Webshop verwenden kannst. Diese Anleitung richtet sich primär an erfahrene Nutzer:innen, da die Einbindung von mehreren Cross-Selling Listen gegenwärtig über ein eigens angepasstes Theme-Plugin geschehen muss.

Beachte dass du deinem Theme im Menü Plugins » Plugin Übersicht eine Positionsnummer zuweist, die zwischen IO und Ceres liegt.

8.1. Context-Klasse erstellen

Da die Einbindung der Cross-Selling Listen über die Erweiterung der SingleItem-Context-Klasse erfolgt, musst du zunächst eine PHP Context-Klasse in deinem Theme erstellen.

Lege in deinem Theme zunächst einen Ordner Contexts im src Ordner an. In dem Contexts-Ordner erstellst du nun eine PHP-Datei für deine eigene Context-Klasse, beispielsweise MyThemeContext.php.

Im nächsten Schritt fügst du den folgenden Code in diese Datei ein. Die erste Cross-Selling-Artikelliste, die wir hier einbauen, ist vom Typ Zubehör:

<?php
namespace ThemeName\Contexts;

use IO\Helper\ContextInterface;
use Ceres\Contexts\SingleItemContext;

use IO\Services\ItemSearch\Services\ItemSearchService;
use IO\Services\ItemSearch\SearchPresets\CrossSellingItems;

class MyThemeContext extends SingleItemContext implements ContextInterface
{
	public $accessory;

	public function init($params)
	{
		parent::init($params);
		$options = array(
        			"itemId" => $this->item['documents'][0]['data']['item']['id'],
        			"relation" => "Accessory"      // Nutze die Liste Zubehoer
       		);
     		$searchfactory = CrossSellingItems::getSearchFactory( $options );
     		$searchfactory->setPage(1, 4); // Begrenze auf 4 Artikel
      		$result = pluginApp(ItemSearchService::class)->getResult($searchfactory);
      		$this->accessory = $result['documents'];
	}
}

Nun speicherst du diese Datei und passt nun in 2 Schritten den Provider in deinem Theme an. Öffne die Datei des Providers unter dem Pfad /src/Providers/MyThemeServiceProvider.php.

Füge oben in der Datei die Zeile use Theme\Contexts\MyThemeContext; ein, damit der neu erstellte Kontext vom ServiceProvider berücksichtigt wird.

Zusätzlich fügst du nun innerhalb der boot Funktion folgenden Code ein:

$eventDispatcher->listen('IO.ctx.item', function (TemplateContainer $templateContainer, $templateData = [])
   {
       $templateContainer->setContext( MyThemeContext::class);
       return false;
   }, 0);

Speichere die Datei. Damit sind die Vorbereitungen für deine Context-Klasse abgeschlossen.

8.2. SingleItemView.twig anpassen

Um nun Cross-Selling-Listen in der Artikeleinzelansicht auszugeben, musst du die <single-item>-Komponente in einem Theme anpassen. In der Ordnerstruktur des unveränderten Ceres liegt die Datei unter /resources/views/item/SingleItemView.twig; diese muss von deinem Theme überschrieben werden, damit die von dir vorgenommenen Änderungen bei einem Update von Ceres und IO nicht verloren gehen.

Füge den folgenden Code vor dem schließenden </single-item>-Tag in der Komponente ein:

<div slot="CrossSellingAccessory">
	
	{% if accessory|length > 0 %}
        		<div class="crossSelling">
        			<span class="h3">Das passt dazu:</span>
        			<container-item-list :items="null"></container-item-list>
      		</div>
	{% endif %}
   </div>

Passe gegebenenfalls die Überschrift an. Nachdem der Slot für die Cross-Selling Liste definiert wurde, kannst du ihn über <slot name="CrossSellingAccessory"></slot> in der gewünschten Komponente (/resources/views/Item/Components/) einbauen. Wo du den Code eingeben musst, ist davon abhängig an welcher Stelle der Artikelansicht die Artikelliste erscheinen soll.

Sobald das Plugin-Set erneut gespeichert und bereitgestellt wurde, wird die Cross-Selling-Artikelliste vom Typ Zubehör an der gewählten Stelle angezeigt.

8.3. Weitere Cross-Selling-Listen einbauen

Um eine weitere Cross-Selling-Liste in Ceres darzustellen, muss die ursprünglich erstelle Context-Klasse erweitert werden:

<?php
namespace ThemeName\Contexts;

use IO\Helper\ContextInterface;
use Ceres\Contexts\SingleItemContext;

use IO\Services\ItemSearch\Services\ItemSearchService;
use IO\Services\ItemSearch\SearchPresets\CrossSellingItems;

class MyThemeContext extends SingleItemContext implements ContextInterface
{
	public $accessory;
  public $similar;

	public function init($params)
	{
		parent::init($params);
		$options = array(
        			"itemId" => $this->item['documents'][0]['data']['item']['id'],
        			"relation" => "Accessory"      // Nutze die Liste Zubehoer
       		);
     		$searchfactory = CrossSellingItems::getSearchFactory( $options );
     		$searchfactory->setPage(1, 4); // Begrenze auf 4 Artikel
      		$result = pluginApp(ItemSearchService::class)->getResult($searchfactory);
      		$this->accessory = $result['documents'];

    $options = array(
              "itemId" => $this->item['documents'][0]['data']['item']['id'],
              "relation" => "Similar"      // Nutze die Liste Ähnlich
          );
        $searchfactory = CrossSellingItems::getSearchFactory( $options );
      	$searchfactory->setPage(1, 4); // Begrenze auf 4 Artikel
        	$result = pluginApp(ItemSearchService::class)->getResult($searchfactory);
        	$this->similar= $result['documents'];
	}
}

Hier wurde unter public $accessory; zusätzlich public $similar; eingefügt; um die Cross-Selling-Liste vom Typ Ersatzteil darzustellen, müsste hier public $replacementPart verwendet werden.

Weiterhin wurde unterhalb von $this→accessory = $result[0]['documents']; ein zusätzlicher Codeblock eingefügt, bei dem "relation" ⇒ "Accessory" durch "relation" ⇒ "Similar" ersetzt wurde; für Listen vom Typ Ersatzteil verwendest du hier "relation" ⇒ "ReplacementPart".

Wie oben beschrieben, erstellst du nun noch einen neuen Slot in der <single-item>-Komponente und rufst diesen an der gewünschten Stelle auf.


Danke an Jens Volke für das Vorformulieren dieses HowTos. Den ursprünglichen Beitrag findet ihr hier im Forum 

9. Eigenschaften im Warenkorb und im Checkout ausgeben

Da Ceres zum gegenwärtigen Zeitpunkt die Ausgabe von Eigenschaften im Warenkorb und im Checkout noch nicht unterstützt, hilft dir dieses Best Practice dabei, den Code in deinem Theme so anzupassen, dass du die Eigenschaften, die du ausgeben möchtest, im Warenkorb anzeigen lassen kannst. Da der Checkout dafür die gleiche Komponente verwendet wie der Warenkorb, reicht es aus, die eine beschriebene Komponente anzupassen.

Du solltest die beschriebenen Anpassungen in einem eigenen Theme-Plugin verbauen, damit die Änderungen nicht bei einem Ceres-Update überschrieben werden. Du kannst die Anpassungen auch im Ceres-Plugin selbst durchführen, allerdings wirst du die betreffende Stelle dadurch nach jedem Ceres-Update erneut anpassen müssen, da dein Ceres durch das Update überschrieben wird.

9.1. BasketListItem.twig anpassen

Im ersten Schritt suchst du in der Dateistruktur des Ceres-Plugins die Komponente BasketListItem.twig unter /resources/views/Basket/Components/BasketListItem.twig. Dies ist die Komponente für Warenkorbartikel und muss angepasst werden, um Eigenschaften im Warenkorb darzustellen. In Zeile 101 der Komponente findest du die folgende Zeile:
<div class="item-properties" v-if="basketItem.basketItemOrderParams.length">
Binde nun darüber den folgenden Code ein:

<div class="item-properties" v-if="basketItem.variation.data.variationProperties">
    <template v-for="i in [5, 6, 2, 3]">
        <template v-for="property in basketItem.variation.data.variationProperties">
            <template v-if="property.property.id === i">
                <div>
                    <span v-text="property.property.names.name"></span>
                    <strong v-html="property.values && property.values.value"></strong>
                </div>
            </template>
        </template>
    </template>
</div>

Die CSS-Klasse "item-properties" wurde hier nur zu Illustrationszwecken aufgeführt und steht stellvertretend für die Möglichkeit, eine CSS-Klasse hier angeben zu können.

Das Array in Zeile 2 des Code-Snippets (<template v-for="i in [5, 6, 2, 3]">) enthält die IDs der Eigenschaften, die du im Warenkorb ausgeben möchtest, in diesem Beispiel also die Eigenschaften mit den IDs 5, 6, 2 und 3. Die IDs der Eigenschaften müssen kommasepariert eingegeben werden. Sie werden in der Reihenfolge im Warenkorb angezeigt, in der sie im Array angegeben sind. Die IDs deiner Eigenschaften findest du im Menü Einrichtung » Einstellungen » Eigenschaften » Konfiguration.

Die 3 <template>-Tags im Code-Snippet werden nicht im Frontend ausgegeben, sondern dienen hier als Schleifenelement, um über die einzelnen Eigenschaften zu iterieren. Diese solltest du nicht anpassen.+

Das <span>-Element gibt den Namen der Eigenschaft aus. Dieses Element kann durch andere Elemente, wie etwa ein <p>-Tag oder ein <strong>-Tag ersetzt werden. Die v-text Direktive darf allerdings nicht entfernt werden.

Im <strong>-Element wird, falls vorhanden, der Wert der jeweiligen Eigenschaft ausgegeben. Die hier verwendete Direktive ist v-html und nicht v-text, damit gegebenenfalls HTML-Formatierungen von Texteigenschaften berücksichtigt werden.

Im zweiten Schritt müssen nun 2 Ergebnisfelder ergänzt werden.

9.2. BasketItem.fields.json anpassen

Suche nun die Datei BasketItem.fields.json unter /resources/views/ResultFields/BasketItem.fields.json. In dieser Datei musst du die beiden Ergebnisfelder "variationProperties.values" und "variationProperties.property.id" hinzufügen. Bitte achte darauf, dass du nach jedem Ergebnisfeld außer dem letzten Feld in der JSON-Datei ein Komma setzt, sodass die Datei weiterhin valides JSON enthält.

Speichere deine Änderungen und stelle das Plugin-Set neu bereit. Deine Eigenschaften sollten nun im Warenkorb sowie in der Warenkorbübersicht im Checkout angezeigt werden.

10. Hinweise zur Senkung der Mehrwertsteuer (01.07.2020)

Zum 01.07.2020 wird der gesetzliche Mehrwertsteuersatz gesenkt. Hierbei kann es zu Problemfällen kommen, wenn Bestellungen vor dem 01.07. getätigt werden (bei denen also der vorherige Satz greift und im Webshop angezeigt wurde), aber erst nach dem 01.07. versendet werden (und demnach unter den gesenkten Satz fallen müssten). Um diesen Problemfällen entgegenzuwirken, empfehlen wir, einerseits sämtliche explizite Verweise auf den anzuwendenden Mehrwertsteuersatz aus dem Webshop zu entfernen und andererseits auch alle Auflistungen von Nettopreisen (für B2C-Verkäufe), bzw. Bruttopreisen (für B2B-Verkäufe) zu entfernen, da diese als Berechnungsgrundlage für die zugrundeliegenden Steuersätze genutzt werden können.

Weitere Informationen zur Rechtsgrundlage findet ihr im Blog von Trusted Shops .

Wenn du ein eigenes Theme im Einsatz hast, ist es möglich, dass du weitere Stellen im Webshop anpassen musst, an denen Preise oder Mehrwertsteuersätze ausgegeben werden. Diese individuellen Fälle können wir in diesem Best Practice nicht abbilden.

Du solltest die folgenden Anpassungen in einer Kopie deines aktiven Plugin-Sets durchführen. Du kannst die angepasste Plugin-Set-Kopie dann vor dem Stichtag aktivieren und später, nachdem alle Bestellungen bearbeitet wurden, die vor dem Stichtag getätigt, aber erst nach dem Stichtag versendet wurden, auf dein altes Plugin-Set wechseln, damit Preise und explizite Mehrwertsteuersätze wieder wie vorher im Webshop angezeigt werden. Weitere Informationen zur Arbeit mit Plugin-Sets findest du hier.

10.1. CSS-Anpassungen

Um sämtliche Verweise auf Nettopreise in deinem Webshop auszublenden, muss das CSS angepasst werden. Am einfachsten ist es, dafür das Plugin Custom CSS/JS im Frontend  zu verwenden.

Füge das Plugin deinem plentymarkets System hinzu wie hier beschrieben. Danach installierst du das Plugin.

Nachdem das Plugin installiert wurde, öffnest du die Plugin-Einstellungen über die Aktion Einstellungen. Im Tab Stylesheets findest du ein Textfeld für CSS, in welches du den folgenden Code-Schnipsel einfügst:

.cmp-totals dl dt:not(.font-weight-bold),
.cmp-totals dl dd:not(.font-weight-bold),
.cmp-totals .vatTotals,
.cmp-totals hr {
    display: none;
}

.cmp-totals dl {
    margin-bottom: 0;
}

.cmp-totals .vat-change,
.cmp-totals .totalSum hr {
    display: block !important;
}

.cmp-totals .rebate-hint {
    display: inline-block !important;
}

Speichere deine Änderungen. Aktiviere das Plugin in deinem Plugin-Set. Nach dem erneuten Bereitstellen deines Plugin-Sets werden keine Nettopreise mehr in deinem Webshop angezeigt.

10.2. Anpassungen im ShopBuilder

Im ShopBuilder musst du 2 Seiten anpassen: den Warenkorb und den Checkout. Auf diesen Seiten musst du jeweils ein Code-Widget einfügen.

10.2.1. Code-Widgets platzieren

Um deinen Webshop auch in der Übergangszeit rechtssicher zu betreiben, musst du einen Hinweis ausgeben, dass sich die angezeigten Preise inklusive Mehrwertsteuer (für B2C-Verkäufe), bzw. zuzüglich Mehrwertsteuer (für B2B-Verkäufe) verstehen. Damit dieser Hinweis auch automatisch in anderen Sprachen, die du pflegst, ausgegeben wird, verwenden wir dafür den Mehrsprachigkeits-Eintrag Ceres::Template.itemInclVAT für B2C- und Ceres::Template.itemExclVAT für B2B-Kund:innen. Dadurch wird B2C-Kund:innen der Preis als Bruttopreis inklusive Mehrwertsteuer, und B2B-Kund:innen der Nettopreis exklusive Mehrwertsteuer angezeigt.

  1. Öffne das Menü CMS » Mehrsprachigkeit.

  2. Klappe den Bereich Artikel aus.

  3. Überprüfe den Text in den Einträgen itemInclVAT und itemExclVAT und passe diese ggf. in deinen Webshop-Sprachen an.

  4. Speichere () die Einstellungen.

  5. Speichere () das Plugin-Set im Menü Plugins » Plugin-Set-Übersicht.

Öffne nun den ShopBuilder unter CMS » ShopBuilder. Auf deinen Inhalten für den Warenkorb und den Checkout musst du nun ein Code-Widget unterhalb der Summen-Widgets platzieren. In jedes dieser Code-Widgets fügst du den folgenden Code ein:

<div class="vat-change mb-2" v-if="!$store.state.basket.data.isExportDelivery && !$store.state.basket.showNetPrices">Ceres::Template.itemInclVAT</div>
<div class="vat-change mb-2" v-if="!$store.state.basket.data.isExportDelivery && $store.state.basket.showNetPrices">Ceres::Template.itemExclVAT</div>

Speichere () die Änderungen an deinem ShopBuilder-Inhalt.

10.3. Anpassungen an Ceres-Templates

Es gibt 2 Stellen im Webshop, auf denen der Mehrwertsteuer-Hinweis nicht über den ShopBuilder eingefügt werden kann: die Auftragshistorie und die Warenkorbvorschau. Um trotzdem rechtssicher verkaufen zu können, kannst du 3 kleine Code-Stellen im Ceres-Plugin anpassen, um den Hinweis auch an diesen Stellen ausgeben zu lassen. Die Anpassungen am Code, sorgen dafür, dass der gleiche Text aus der Mehrsprachigkeit genommen wird, der auch in den Code-Widgets angezeigt wird, die du vorher im ShopBuilder hinzugefügt hast.

Die 3 Anpassungen sind im Folgenden detailliert aufgeführt. Wir haben zusätzlichen einen Pull Request offen, in dem du die Code-Änderungen direkt nachverfolgen kannst. Diesen Pull Request findest du auf GitHub . Scrolle auf der Seite weiter nach unten, um die Datei-Änderungen einzusehen.

10.3.1. Auftragshistorie anpassen

Um den Hinweis zur Mehrwersteuer auch in der Auftragshistorie im Mein Konto-Bereich anzuzeigen, musst du ein Code-Schnipsel in einer Template-Datei einfügen. Gehe dafür wie im Folgenden beschrieben vor:

  1. Öffne das Menü Plugins » Plugin-Set-Übersicht.

  2. Klicke in der Zeile deiner Plugin-Set-Kopie auf die Aktion Plugin-Set bearbeiten.
    → Das Plugin-Set wird geöffnet.

  3. Klicke in der Zeile des Plugins Ceres auf die Aktion Einstellungen.
    → Die Ceres-Einstellungen werden geöffnet.

  4. Klicke links im Navigationsbaum auf den Tab Dateien.
    → Die Dateistruktur des Plugins wird geöffnet.

  5. Klicke auf den Ordner resources.

  6. Klicke darin auf den Ordner views.

  7. Klicke darin auf den Ordner Checkout.

  8. Klicke darin auf den Ordner Macros.

  9. Klicke auf die Datei OrderTotals.twig.
    → Die Datei wird im Editor geöffnet.

  10. Füge den unten aufgeführten Code nach dem {% endif %}-Element in Zeile 186 in einer neuen Zeile ein.

  11. Speichere () deine Änderungen.

<dt class="w-100 vat-change mb-2" v-if="!$store.state.basket.data.isExportDelivery && !$store.state.basket.showNetPrices">Ceres::Template.itemInclVAT</dt>
<dt class="w-100 vat-change mb-2" v-if="!$store.state.basket.data.isExportDelivery && $store.state.basket.showNetPrices">Ceres::Template.itemExclVAT</dt>

Durch diese Anpassung wird der Text, der in der Mehrsprachigkeit in den Einträgen itemInclVAT und itemExclVAT hinterlegt sind, auch in der Auftragshistorie angezeigt.

10.3.2. Standard-Header anpassen

Für ShopBuilder-Inhalte, bei denen du keinen eigenen Header verwendest, muss der Standard-Header angepasst werden, damit der Hinweis zur Mehrwertsteuer auch in der Warenkorbvorschau angezeigt wird. Gehe dafür wie im Folgenden beschrieben vor:

  1. Öffne das Menü Plugins » Plugin-Set-Übersicht.

  2. Klicke in der Zeile deiner Plugin-Set-Kopie auf die Aktion Plugin-Set bearbeiten.
    → Das Plugin-Set wird geöffnet.

  3. Klicke in der Zeile des Plugins Ceres auf die Aktion Einstellungen.
    → Die Ceres-Einstellungen werden geöffnet.

  4. Klicke links im Navigationsbaum auf den Tab Dateien.
    → Die Dateistruktur des Plugins wird geöffnet.

  5. Klicke auf den Ordner resources.

  6. Klicke darin auf den Ordner views.

  7. Klicke darin auf den Ordner PageDesign.

  8. Klicke darin auf den Ordner Partials.

  9. Klicke darin auf den Ordner Header.

  10. Klicke auf die Datei DefaultHeader.twig.
    → Die Datei wird im Editor geöffnet.

  11. Füge den unten aufgeführten Code nach Zeile 118 in einer neuen Zeile ein.

  12. Speichere () deine Änderungen.

<div class="vat-change mb-2" v-if="!$store.state.basket.data.isExportDelivery && !$store.state.basket.showNetPrices">Ceres::Template.itemInclVAT</div>
<div class="vat-change mb-2" v-if="!$store.state.basket.data.isExportDelivery && $store.state.basket.showNetPrices">Ceres::Template.itemExclVAT</div>

Durch diese Anpassung wird der Text, der in der Mehrsprachigkeit in den Einträgen itemInclVAT und itemExclVAT hinterlegt sind, auch in der Warenkorbvorschau des Standard-Headers angezeigt.

10.3.3. Eigenen ShopBuilder-Header anpassen

Für ShopBuilder-Inhalte, für die du einen eigenen Header angelegt hast, muss der Code des Top Bar-Widgets angepasst werden, damit der Hinweis zur Mehrwertsteuer auch in der Warenkorbvorschau angezeigt wird. Gehe dafür wie im Folgenden beschrieben vor:

  1. Öffne das Menü Plugins » Plugin-Set-Übersicht.

  2. Klicke in der Zeile deiner Plugin-Set-Kopie auf die Aktion Plugin-Set bearbeiten.
    → Das Plugin-Set wird geöffnet.

  3. Klicke in der Zeile des Plugins Ceres auf die Aktion Einstellungen.
    → Die Ceres-Einstellungen werden geöffnet.

  4. Klicke links im Navigationsbaum auf den Tab Dateien.
    → Die Dateistruktur des Plugins wird geöffnet.

  5. Klicke auf den Ordner resources.

  6. Klicke darin auf den Ordner views.

  7. Klicke darin auf den Ordner Widgets.

  8. Klicke darin auf den Ordner Header.

  9. Klicke auf die Datei TopBarWidget.twig.
    → Die Datei wird im Editor geöffnet.

  10. Füge den unten aufgeführten Code nach Zeile 210 in einer neuen Zeile ein.

  11. Speichere () deine Änderungen.

<div class="vat-change mb-2" v-if="!$store.state.basket.data.isExportDelivery && !$store.state.basket.showNetPrices"></div>
<div class="vat-change mb-2" v-if="!$store.state.basket.data.isExportDelivery && $store.state.basket.showNetPrices"></div>

Durch diese Anpassung wird der Text, der in der Mehrsprachigkeit in den Einträgen itemInclVAT und itemExclVAT hinterlegt sind, auch in der Warenkorbvorschau von Headern angezeigt, die ihr selbst im ShopBuilder bearbeitet habt.

Alternativ hast du die Möglichkeit, die Warenkorbvorschau über die Einstellungen des Top Bar-Widgets komplett auszublenden. Dadurch würdest du dir diese eine Template-Anpassung sparen.

Sowohl das Reparieren des Ceres-Plugins als auch ein Update des Ceres-Plugins machen diese Template-Anpassungen wieder rückgängig.

11. Bessere Werte bei Google Page Speed Insights erzielen

In diesem Best Practice lernst du, auf welche Dinge du achten musst, um deine Performance-Werte bei Google Page Speed Insights zu verbessern. Im ersten Schritt zeigen wir dir, wie du mit den Mitteln, die plentyShop Ceres bereits mitbringt, höhere PSI-Werte erzielen kannst. Zu einem späteren Zeitpunkt wird diese Anleitung auch Anpassungen enthalten, die du mit einem eigenen Theme umsetzen kannst, um von Google PSI besser bewertet zu werden. Die hier aufgeführten Maßnahmen erfordern keinerlei Programmierungskenntnisse.

Die Maßnahmen, die wir hier vorschlagen, können deinen PSI-Wert nur in einem bedingten Maß verbessern. Mit dem Release von plentyShop Ceres 6.0 werden wir eine Reihe von Änderungen vornehmen, die sich positiv auf deine PSI-Werte auswirken werden. Wir sind bemüht, die Performance von plentyShop Ceres in jeder Version weiter zu verbessern.

Im Folgenden sind einige Anpassungen aufgeführt, die du für deinen plentyShop durchführen kannst, um die von Google erfassten Werte zu verbessern:

11.1. Live-Modus im Ceres-Plugin aktivieren

Im Plugin Ceres hast du die Möglichkeit, zwischen dem Entwicklungsmodus und dem Live-Modus zu wählen. Im Entwicklungsmodus kannst du Debugging-Optionen nutzen und die Dateien des Plugins werden nicht minimiert und gebündelt, was sich negativ auf die Webshop-Performance auswirkt. Wir raten dir daher, den Live-Modus zu verwenden, um deinen Webshop performanter zu machen. Gehe wir im Folgenden beschrieben vor, um den Live-Modus zu aktivieren:

Live-Modus aktivieren:

  1. Öffne das Menü Plugins » Plugin-Set-Übersicht.

  2. Wähle das Plugin-Set aus deines Webshops aus.

  3. Klicke auf Plugin-Set bearbeiten.

  4. Klicke in der Zeile des Plugins Ceres auf Einstellungen.
    → Die Ceres-Einstellungen werden geöffnet.

  5. Klicke auf das Tab Logging und Performance.

  6. Wähle für die Einstellung Performance-Level die Option Live-Modus.

  7. Speichere () die Einstellungen.

Dadurch, dass du diese Einstellung aktiviert hast, werden die Ceres-Dateien gebündelt und minimiert, was zu einer schnelleren Auslieferungszeit der Seiten im Webshop führt.

11.2. Bilder-Widgets optimal einstellen

Bilddateien sind eine der größeren Problemquellen für einen performanten Webshop. Du solltest also darauf achten, dass du nur so viele Bilder-Widgets in deinen Seiten verbaust, wie für deine Zwecke nötig sind. Eine geringere Zahl von Bilder-Widgets wird sich positiv auf die Webshop-Geschwindigkeit auswirken.

11.2.1. Moderne Bildformate verwenden

Darüber hinaus raten wir dir, die Bilder, die du im Webshop anzeigen willst, in möglichst modernen Bildformaten abzulegen. Wir empfehlen dir, in den Widgets Bilderbox, Bilderkarussell und Hintergrundbild das Feld Bildauswahl zu nutzen, um dort Bilder im WebP-Format zu hinterlegen. Wenn du eine WebP-Datei nutzt, wird dir zusätzlich die Option Bildauswahl für ältere Browser eingeblendet, um Bilder auch in Browsern anzuzeigen, die bisher keine WebP-Formate unterstützen. Dort solltest du nach Möglichkeit das Format JPEG verwenden.

11.2.2. Lazy Loading aktivieren

Weiterhin emfehlen wir dir, für sämtliche Widgets, die Bilder beinhalten, die Option Nur sichtbare Inhalte laden in den Widget-Einstellungen zu aktivieren. Diese Option, das sogenannte "Lazy Loading", sorgt dafür, dass die Bilddateien, die sich beim ersten Aufruf der Seite nicht im aktuellen Sichtbereich befindet, zu einem späteren Zeitpunkt nachgeladen wird. Dies wirkt sich positiv auf die Performance des Webshops aus.

11.3. Anzahl der Widgets reduzieren

Die Zahl der Widgets, die du auf deinen Webshop-Seiten verbaust, können die Performance deines Webshops negativ beeinflussen: Je mehr Widgets du pro Seite nutzt, desto langsamer lädt diese Seite. Dies gilt insbesondere für Bilder-Widgets und für Widgets, die eine große Menge an Artikeldaten enthalten. Jedes zusätzliche Widget beinträchtigt die Zeit bis zur ersten vollständigen Interaktivität der Seite.
Wir empfehlen dir daher, nur so viele Widgets pro Seite zu verwenden, wie für deine Zwecke nötig sind. Vor allem auf Kategorieseiten, auf denen große Datenmengen und komplexes Javascript geladen werden muss, solltest du, wenn möglich, die Anzahl der dargestellten Artikel reduzieren und dadurch die Ladezeit verbessern.

11.4. Unsichtbaren Text durch eigene Schriftarten vermeiden

Falls du eigene Schriftarten einbindest, ohne dabei auf die Design-Einstellungen des ShopBuilders zurückzugreifen, kann es dazu kommen, dass manche Browser versuchen, den Text darzustellen, bevor die betroffene Font-Datei geladen wurde. Dadurch kommt es zu einem sogenannten Flash of invisible text (FOIT), also einer kurzen Zeit, in der der darzustellende Text vom Browser nicht angezeigt werden kann.
Um dies zu vermeiden, kannst du über eine CSS-Anweisung vorübergehend eine Systemschriftart anzeigen lassen, bis die betroffene Schriftart geladen wurde. Dazu fügst du in deinem eigenen CSS (beispielsweise über das Plugin Custom CSS/JS im Frontend) die Anweisung font-display: swap in deinen @font-face Styles ein. Dadurch vermeidest du unangenehme FOIT, was sich positiv auf den PSI-Wert deines Webshops auswirkt.

11.5. ShopBooster aktivieren

Die Time-to-first-Byte (TTFB) ist ebenfalls Bestandteil der PSI-Erfassung, auch wenn sie nur einen geringen Teil der Wertung darstellt. Um deine TTFB zu verbessern, kannst du für deinen plentyShop Ceres das kostenpflichtige Zusatzmodul ShopBooster aktivieren. Dadurch werden Seiteninhalte von Ceres Webshops bei einem zweiten Aufruf in den Cache geschrieben, um dadurch deutlich bessere Ladezeiten für deine Nutzer:innen zu erzielen.

Zusätzliche Kosten

Durch das Aktivieren des ShopBoosters fallen pro Mandant zusätzliche Kosten in Höhe von 0,004 € pro 100 Seitenaufrufe und -änderungen an. Ein Seitenaufruf ist der Vorgang, bei dem ein Shop-Besucher oder ein Webcrawler eine URL des Online-Shops aufruft; eine Seitenänderung wird durch folgende Vorgänge ausgelöst:

  • Aktualisieren von Kategorien- und Artikeldaten

  • Aktualisieren von ShopBuilder-Seiten

  • Bereitstellen von Plugins

  • Speichern von Einstellungen in der Ceres Konfiguration

  • Invalidieren des Caches bei Deaktivierung des ShopBoosters

Die Zusatzkosten des ShopBoosters betragen monatlich maximal 100€ pro Mandant.

ShopBooster aktivieren:

  1. Öffne das Menü Einrichtung » Mandant » Mandant wählen » Webshop » ShopBooster.

  2. Klicke auf ShopBooster aktivieren.
    → Ein Fenster öffnet sich, welches dich auf entsprechende zusätzliche Kosten hinweist.

  3. Klicke auf Bestätigen um den ShopBooster zu aktivieren.
    → Die Meldung ShopBooster wurde aktiviert wird eingeblendet.

Auf die gleiche Weise kannst du den ShopBooster wieder deaktivieren.

ShopBooster deaktivieren:

  1. Öffne das Menü Einrichtung » Mandant » Mandant wählen » Webshop » ShopBooster.

  2. Klicke auf ShopBooster deaktivieren.
    → Ein Fenster öffnet sich, welches dich auf zusätzliche Kosten hinweist.

  3. Klicke auf Bestätigen um den ShopBooster zu deaktivieren.
    → Die Meldung ShopBooster wurde deaktiviert wird eingeblendet.

11.6. Javascript in Code-Widgets vermeiden

Im ShopBuilder steht dir ein Code-Widget zur Verfügung, über das du zusätzliche Anpassungen vornehmen kannst, die der ShopBuilder nicht von selbst bereitstellt. Wenn du eigenen Code einbinden möchtest, raten wir dir dazu, eigenes Javascript nicht über Code-Widgets zu realisieren, sondern beispielsweise über das Plugin Custom CSS/JS im Frontend oder ein eigenes Theme. Zusätzliches Javascript in Code-Widgets zu verarbeiten, wirkt sich negativ auf die Ladezeit der Seite aus.
Falls du eigenes Javascript über ein Plugin oder ein Theme einbindest, empfehlen wir dir, das Javascript ganz am Ende des HTML-Body zu verbauen.

11.7. Plugins für Zahlungsarten richtig verknüpfen

Wenn du Plugin-Zahlungsarten für deinen plentyShop verwendest, die eine große Menge an eigenen Daten beinhalten, wie beispielsweise AmazonPay oder PayPal, ist es für die Performance deines Webshops unerlässlich, dass du diese Plugins mit den richtigen Layout-Containern verknüpfst. In Ceres 5.0 wurden neue Layout-Container hinzugefügt, um Javascript und CSS der Zahlungsplugins nur an den Stellen zu laden, an denen sie wirklich gebraucht werden.
Die Plugin-Beschreibungen der jeweiligen Zahlungsarten, z.B. PayPal, enthalten bereits detaillierte Anleitungen, wie du die Plugins mit den richtigen Containern verknüpfst. Generell gilt, dass du das Javascript der jeweiligen Zahlungsart mit dem Container Checkout.AfterScriptsLoaded und nicht mehr mit dem Container ScriptLoader.AfterScriptsLoaded verknüpfen solltest, um die Performance deines Webshops zu verbessern.

Zum Seitenanfang