Die Experten für Shopware Plugins

Helpcenter

jQuery Plugins

Grundlegende Informationen über den Aufbau und die Integration von jQuery Plugins in Shopware finden Sie hier:

https://developers.shopware.com/designers-guide/javascript-statemanager-and-pluginbase/ 

Das Bootstrap Theme enthält sowohl eigene jQuery Plugins als auch von uns erweiterte Shopware Plugins. Die meisten dieser Plugins können Sie über data Attribute in den Templates konfigurieren. Welche Möglichkeiten es im Einzelnen gibt finden sie under frontend/_public/src/js im entsprechenden File. 

Beispiel: Equal-Height

Die equal-height Funktion finden Sie in frontend/_public/src/js/swbt.helper.js ab der Zeile 48.

Aufruf im Template

Elternelement: data-equalheight=“true“

Kindelement:    data-equal=“*eindeutiger Name*”

Das äußerste Wrapper-Element muss immer das Data-Attribut equalheight besitzen, innerhalb davon können beliebig viele Elemente das Data-Attribut data-equal besitzen.

Nur Elemente mit gleichem data-equal Namen bekommen die gleiche Höhe.

Eine Verschachtelung der data-equal Elemente ist, außer auf der Produktlisten Seite (PLP), nicht möglich.

Beispiel:

<ul data-equalheight="true">

  <li data-equal="listItems"></li>

    <li data-equal="listItems"></li>

    <li data-equal="listItems"></li>

</ul>

 Beachten Sie, dass Sie als data-equal Namen weder „image“ noch „item“ verwenden können, da diese bereits von uns auf der PLP verwendet werden.

 Anpassen von Shopware Premium Plugins/Community Store Plugins

 Beim Anpassen von Shopware Premium Plugins oder Community Store Plugins müssen Sie die Datei-/ Ordnerstuktur ab dem Ordner frontend identisch mit der aus dem Plugin übernehmen.

Um Ihr Custom Theme an Shopware Premium oder Community Store Plugins anzupassen, müssen Sie die Ordnerstuktur inklusive Dateinamen ab dem frontend Ordner vom Plugin in Ihrem Theme übernehmen um die Vererbung zu ermöglichen.

Es wird die selbe Vererbungslogik der Themes auch auf Plugins angewandt.

Beispiel Shopware Bundle:

Pfad der zu überschreibenden Datei

Frontend/SwagBundle/Views/frontend/swag_bundle/product/image.tpl

Im Bootstrap Theme:

Frontend/BeispielCustomTheme/Themes/Frontend/BeispielCustomTheme/frontend/swag_bundle/product/image.tpl


Demo

Live Demo gefällig? Unser Demoshop steht für sie bereit.

Zur Demo wechseln

Support

Ihre Frage konnte nicht beantwortet werden? Kein Problem, wir unterstützen Sie gerne.

Support Ticket erstellen