Im Demo-Shop (Standard, Version 6.4.20) läuft dass wie gewünscht. Der zusätzliche Tab wird eingeblendet, sobald das Plugin aktiv ist.
Im Produktiv-Shop (ebenfalls Version 6.4.20) werden diese Template-Änderungen einfach ignoriert. Es wurden alle anderen Plugins deaktiviert und das Shopware Standard-Theme aktiviert. Wenn ich Änderungen, z.B. im Footer reinbringe, werden diese korrekt angezeigt. Nur alle Änderungen bzgl. des Produktdetail-Register werden konsequent ignoriert. Woran könnte dass liegen?
Danke für die Hinweise. Es ist als Plugin realisiert.
Ich habe ein cache:clear auf dem Produktiv-Shop gemacht. Ein theme:compile nicht, da ich ja am Theme nichts geändert habe.
Der Twig-Code sollte eigentlich passen, nachdem was ich dazu gefunden habe. Es läuft ja auch im Demo-Shop. Irgendwie werden die Änderungen am Template nur im Produktiv-Shop ignoriert, obwohl dort kein einziges Plugin mehr aktiv ist und das SW Standard-Theme.
eventuell im Produktivshop ein Produktseiten-Layout zugewiesen und im Demoshop nicht? Das sind nämlich zwei verschiedene Twig-Dateien, die man anpassen muss, wenn man beides berücksichtigen möchte.
genau, dass ist der Grund. Es ist im Produktiv-Shop ein anderes Produktseiten-Layout zugewiesen.
Spannend ist, dass es auch nach Zuweisung des Standard-Layouts nicht funktioniert. Man muss die Layout-Zuweisung mittels des Löschbuttons komplett entfernen. Dann funktioniert es. Muss man auch erstmal draufkommen .
Kannst Du mir auch noch einen Hinweis geben, was ich im Plugin anpassen muss, damit es auch mit anderen Produktseiten-Layouts funktioniert.
Mit offcanvas="false" wird der Tab-Inhalt leider auch nicht angezeigt, weil der ganze .product-detail-tabs-content Container mobil auf display:none gesetzt ist. Wenn ich den Style überschreibe, dann wird mein Content erwartungsgemäß eingeblendet, aber dann sind leider die eingebauten Tab-Inhalte doppelt, bei denen Offcanvas funktioniert.
Aus den bisherigen Beschreibungen, Dokumentation und Forenbeiträgen hatte ich zunächst schlussgefolgert, dass auch Custom Tab Content bei Bedarf automatisch ins Offcanvas übernommen wird (vgl. off canvas - doppelter content), was aber bei mir leider nicht der Fall ist, wenn ich die Produktdetails in der Storefront um einen zusätzlichen Reiter erweitere.
Du musst in den Templates einen zusätzlichen offcanvas hinzufügen. Schau dir einfach an, wie das HTML-Gerüst von cart ist und baue es nach. Orientiere dich aber ggf. besser an der mobilen Navigation.
Aber die eingebauten Tabs (Produktbeschreibung und Reviews) haben diesen Code gar nicht in Twig stehen, sondern das scheint per JavaScript (Bootstrap-Offcanvas) dynamisch erstellt zu werden?
Im DOM sehe ich allerdings ein <div class="offcanvas-body"> als Wrapper von <div class="product-detail-review tab-pane-container">".
Sollte dieses Markup bei Custom Tabs explizit selbst erzeugt werden?
Sollte ich gar die views/storefront/utilities/offcanvas.html.twig erweitern, obwohl sie nach einem allgemeingültigen Template ausschaut?
Es wäre allgemein hilfreich, mobile Views ausführlicher zu dokumentieren, wenn responsives Webdesign nicht ausreicht. Wie ist die aktuelle Best Practice und wo ist sie dokumentiert?
Das komplette Plugin ist bei Bedarf auf GitHub zu sehen (Work in Progress, aber funktioniert soweit mit aktueller Shopware 6.5.8.2 im lokalen Dockware-Container). Update: mit 6.5.8.6 verhält sich alles ebenso wie beschrieben.
Hier zunächst das erweiterte Tabs-Template…
custom/plugins/IngoSCostTransparency/src/Resources/views/storefront/page/product-detail/tabs.html.twig
Die Lösung schien simpel, aber leicht zu übersehen. Laut aktueller Doku soll das Attribut data-off-canvas-tabs="true" statt des deprecateddata-offcanvas-tabs="true" verwendet werden (beachte den feinen Unterschied des einzelnen Bindestriches). Der „alte“ Core (6.5) prüft nur auf das alte, der neue (Shopware 6.6) nur auf das neue Attribut. Eine maximal abwärtskompatible Lösung müsste daher folgendermaßen aussehen:
<a
class="nav-link product-detail-tab-navigation-link"
data-bs-toggle="tab"
data-off-canvas-tabs="true" {# new attribute name #}
data-offcanvas-tabs="true" {# deprecated attribute name for backward compatibility #}
Update Ende März 2024: nachdem nun Shopware 6.6 offiziell released wurde, habe ich meinen Testshop aktualisiert, und siehe da: das Plugin funktioniert nicht, Tabs werden nicht angezeigt. Vermutung: es gibt noch weitere nötige Änderungen. Aber wer weiß das schon?
Bei der Suche nach weiteren Breaking Changes fand ich übrigens in der tabs.html.twig einen weiteren Deprecation-Hinweis für 6.7.0.: {# @deprecated tag:v6.7.0 - File will be removed as it is no longer loaded by default. #} mit dem Hinweis, das künftig stattdessen cms-element-product-description-reviews.html.twig zu verwenden ist.
Zusätzliche Herausforderung: falls wir mit JavaScript Event Handler setzen, müssen diese nicht nur im originalen DOM-Fragment funktionieren, sondern auch in der Version, die Shopware scheinbar per JavaScript im Off-Canvas rendert, vgl. offCanvas js events (seit 2020 unbeantwortete Frage) oder besser Im eigenen Plugin Events anderer Plugins empfangen, ebenfalls von 2020 aber vielleicht immer noch hilfreich.
Nach Off-Canvas-Rendering können wir nicht mehr davon ausgehen, dass es unsere Elemente jeweils nur einmal git. Somit verbietet es sich, mit document.getElementById oder analogen Selektoren zu arbeiten. Also arbeiten wir entweder über die Plugin-Instanz oder iterieren über alles passende, was wir mit getElementsByClassName finden?
P.S. Ein Fehler ist aufgetreten: Es sind nicht mehr als 3 aufeinanderfolgende Antworten erlaubt. Bitte bearbeite stattdessen deine letzte Antwort oder warte, bis dir jemand antwortet.
.