# overridePlugin defaults

**URL:** <https://forum.shopware.com/t/overrideplugin-defaults/32130>\
**Category:** Programmierung\
**Created:** [11. November 2015 um 13:55 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130 "2015-11-11T13:55:03Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![wontfix](https://avatars.discourse-cdn.com/v4/letter/w/b19c9b/32.png) [@wontfix](https://forum.shopware.com/u/wontfix)\
**Post date:** [11. November 2015 um 13:55 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/1 "2015-11-11T13:55:03Z")

</div>

[https://developers.shopware.com/designe … ry-plugins](https://developers.shopware.com/designers-guide/modify-jquery-plugins) gibt’s da ne möglichkeit auch ein defaults von eine plugin zu ändern? zbs. ich möchte das swImageSlider defaults.swipeToSlide auf false setzen.

---

<div class="post-metadata">

**Author:** ![dupp](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/dupp/32/7715_2.png) [@dupp](https://forum.shopware.com/u/dupp)\
**Post date:** [11. Januar 2016 um 12:27 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/2 "2016-01-11T12:27:57Z")

</div>

Stehe vor dem gleichen Problem, die default-Werte zu ändern. Beispiel: Möchte im Product-Slider die Mindestweite der Artikel verändern. Default-Wert: itemMinWidth: 350; Mit unterem Code habe ich die init bereits erfolgreich erweitert. `$.overridePlugin('swProductSlider', { init: function () { var me = this; me.superclass.init.apply(this, arguments); /\* Irgendwelcher neuer Code \*/ } });` Das hier hingegen mit default zu machen führt nicht zum erfolg… `$.overridePlugin('swProductSlider', { default: function () { /\*\* \* The minimal width a slider item should have. \* Used for horizontal sliders. \* \* @property itemMinWidth \* @type {Number} \*/ itemMinWidth: 350; var me = this; me.superclass.default.apply(this, arguments); } });` Weiß jemand mehr?

---

<div class="post-metadata">

**Author:** ![Shopwareianer](https://avatars.discourse-cdn.com/v4/letter/s/b4bc9f/32.png) [@Shopwareianer](https://forum.shopware.com/u/Shopwareianer)\
**Post date:** [11. Januar 2016 um 12:32 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/3 "2016-01-11T12:32:19Z")

</div>

Ich würde jetzt mal vermuten, da die default werte keine methods sind, sondern parameter kannst du diese nicht mit override überschreiben, da es nur bei methods geht.

---

<div class="post-metadata">

**Author:** ![dupp](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/dupp/32/7715_2.png) [@dupp](https://forum.shopware.com/u/dupp)\
**Post date:** [11. Januar 2016 um 14:11 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/4 "2016-01-11T14:11:40Z")

</div>

Dann kann man sowas nur in der entsprechenden .tpl-Datei mit einem Data-Attribut lösen? Meine da mal was gelesen zu haben? Wenn Shopware die Möglichkeit der Overrides bietet… warum dann nicht auch bei sowas Elementarem, wie die default-Werte?

---

<div class="post-metadata">

**Author:** ![carl](https://avatars.discourse-cdn.com/v4/letter/c/ee7513/32.png) [@carl](https://forum.shopware.com/u/carl)\
**Post date:** [8. Februar 2016 um 13:13 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/5 "2016-02-08T13:13:54Z")

</div>

die default Werte kannst du beim Aufrufen des Plugins in der jquery.shopware-responsive.js (etwas unglücklich gewählter Name für die zentrale JS-Datei) anpassen.

z.B. kannst du da

```
 // Default product slider .addPlugin('\*[data-product-slider="true"]', 'swProductSlider') 

```

durch

```
 .addPlugin('\*[data-product-slider="true"]', 'swProductSlider', { itemMinWidth: 350 }) 

```

ersetzen. Da der productSlider mehrfach benutzt wird, musst du entsprechend alle Aufrufe von

```
 .addPlugin(..., 'swProductSlider')

```

entsprechend anpassen.

---

<div class="post-metadata">

**Author:** ![Philipp\_Schuch](https://avatars.discourse-cdn.com/v4/letter/p/8797f3/32.png) [@Philipp\_Schuch](https://forum.shopware.com/u/Philipp_Schuch)\
**Post date:** [25. Februar 2016 um 12:55 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/6 "2016-02-25T12:55:13Z")

</div>

Hallo,

grundsätzlich können die Default Optionen auch über die _overridePlugin_ Methode überschrieben werden. Man sollte dabei allerdings beachten, dass diese dann auch wirklich die neuen Default-Werte für dieses Plugin darstellen und sich daher auch auf alle&nbsp;Instanzen des Plugins auswirken. Die Default Optionen sind außerdem ein Object. Wenn man dieses überschreibt, sollte man auch alle verfügbaren Properties übernehmen. Am besten wäre es, einzelne Optionen in der _init()_&nbsp;Methode zu überschreiben. Natürlich wird dann die Option global überschrieben.

```
$.overridePlugin('swProductSlider', {
    init: function () {
        var me = this;

        me.opts.itemMinWidth = 300;

    	me.superclass.init.apply(this, arguments);
    }
});

```

Der deutlich bessere Weg wäre daher wirklich die Einstellung bei Initialisierung des Plugins&nbsp;als Option reinzureichen.

```
// Klassische Initialisierung
$('.dein-selektor').swProductSlider({
    itemMinWidth: 300
});

// Initialisierung über den StateManager
window.StateManager.addPlugin(
    '.dein-selektor', 
    'swProductSlider', 
    { itemMinWidth: 300 }
);

```

Man kann die Options auch direkt über ein Data-Attribut auf dem DOM Element setzen:

```
    // ...

```

Weitere Infos zu den jQuery Plugins findet Ihr auch hier:  
[https://developers.shopware.com/designers-guide/javascript-statemanager-and-pluginbase/](https://developers.shopware.com/designers-guide/javascript-statemanager-and-pluginbase/)  
&nbsp;

Sonnige Grüße,  
Phil

---

<div class="post-metadata">

**Author:** ![HamdIT](https://avatars.discourse-cdn.com/v4/letter/h/e56c9b/32.png) [@HamdIT](https://forum.shopware.com/u/HamdIT)\
**Post date:** [17. November 2016 um 15:33 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/7 "2016-11-17T15:33:53Z")

</div>

Die globale Überschreibung habe ich verstanden. Die andere leider nicht.

Was ist „dein-selektor“?&nbsp;Wie sorge ich dafür, dass der swProductSlider bei einer bestimmten Displaygröße einen eigenen selektor hat?

&nbsp;

---

<div class="post-metadata">

**Author:** ![Philipp\_Schuch](https://avatars.discourse-cdn.com/v4/letter/p/8797f3/32.png) [@Philipp\_Schuch](https://forum.shopware.com/u/Philipp_Schuch)\
**Post date:** [18. November 2016 um 07:22 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/8 "2016-11-18T07:22:14Z")

</div>

Hey,

das “dein-selektor” im Code ist natürlich nur ein Platzhalter für das Beispiel. Da sollst Du Deine eigene Klasse eintragen 😉

LG,  
Phil

---

<div class="post-metadata">

**Author:** ![HamdIT](https://avatars.discourse-cdn.com/v4/letter/h/e56c9b/32.png) [@HamdIT](https://forum.shopware.com/u/HamdIT)\
**Post date:** [18. November 2016 um 15:14 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/9 "2016-11-18T15:14:01Z")

</div>

Danke. Aber wie bekomme ich die eigene Klasse in den swProductSlider (bei einer bestimmten Displaygröße)? Es nutzt ja nichts, wenn dieser eigene Klassenselektor bei allen swProductSlider vorkommt. Dann kann ich auch gleich die globale Überschreibung nutzen. Sorry für die Frage. Mir ist klar, dass sie mit diesem Thema hier nur zufällig zusammenhängt. Tatsächlich ergibt der Thread und deine sehr gute Antwort&nbsp;aber eben nur mit diesem mir fehlenden&nbsp;Grundwissen Sinn.

---

<div class="post-metadata">

**Author:** ![Philipp\_Schuch](https://avatars.discourse-cdn.com/v4/letter/p/8797f3/32.png) [@Philipp\_Schuch](https://forum.shopware.com/u/Philipp_Schuch)\
**Post date:** [21. November 2016 um 08:00 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/10 "2016-11-21T08:00:48Z")

</div>

Hallo,

Du würdest für Deinen eigenen Selektor eine neue Registrierung des Plugins am StateManager machen, so wie in dem Beispiel oben. Hier kann man als weiteren Parameter die Viewports angeben, für welche das Plugin aktiv sein soll.

z.B:

```
// Initialisierung über den StateManager
window.StateManager.addPlugin(
    '.dein-selektor', 
    'swProductSlider', 
    { itemMinWidth: 300 },
    ['m', 'l', 'xl']
);

```

Weitere Infos findest Du auch in der Doku:  
[jQuery plugins and the StateManager](https://developers.shopware.com/designers-guide/javascript-statemanager-and-pluginbase/#using-the-state-manager)

Sonnige Grüße,  
Phil

---

<div class="post-metadata">

**Author:** ![HamdIT](https://avatars.discourse-cdn.com/v4/letter/h/e56c9b/32.png) [@HamdIT](https://forum.shopware.com/u/HamdIT)\
**Post date:** [21. November 2016 um 12:41 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/11 "2016-11-21T12:41:31Z")

</div>

Danke für deine Hilfe. Ich frage es nochmal so: Wieso klappt es mit “.product-slider” dann nicht. Oder wenn ich in einer Einkaufswelt ein code-Element einfüge und ihm eine css-klasse “mein-selektor” gebe und die in die addPlugin methode einsetze, sehe ich auch nichts.

```
window.StateManager.addPlugin(
    '.product-slider', 
    'swProductSlider', 
    { itemMinWidth: 300 },
    ['m', 'l', 'xl']
);

```

&nbsp;

---

<div class="post-metadata">

**Author:** ![Philipp\_Schuch](https://avatars.discourse-cdn.com/v4/letter/p/8797f3/32.png) [@Philipp\_Schuch](https://forum.shopware.com/u/Philipp_Schuch)\
**Post date:** [22. November 2016 um 08:10 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/12 "2016-11-22T08:10:36Z")

</div>

Hallo,

also wenn Du das Ganze in den Einkaufswelten machst, musst Du natürlich beachten, dass die Einkaufswelt per Ajax nachgeladen wird. Dein JavaScript ist daher möglicherweise schon ausgeführt wenn die Elemente in den DOM eingefügt werden. Hier kannst Du Dich zum Beispiel auf folgendes Event subscriben:

```
 'plugin/swEmotionLoader/onInitEmotion'

```

&nbsp;

Sonnige Grüße,  
Phil

---

<div class="post-metadata">

**Author:** ![obertech](https://avatars.discourse-cdn.com/v4/letter/o/e9a140/32.png) [@obertech](https://forum.shopware.com/u/obertech)\
**Post date:** [24. November 2016 um 09:14 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/13 "2016-11-24T09:14:09Z")

</div>

Hallo

Wie und wo muss ich die Einstellung einbinden?

```
// Klassische Initialisierung
$('.dein-selektor').swProductSlider({
    itemMinWidth: 300
});

// Initialisierung über den StateManager
window.StateManager.addPlugin(
    '.dein-selektor', 
    'swProductSlider', 
    { itemMinWidth: 300 }
);

```

LG Mirko

---

<div class="post-metadata">

**Author:** ![lorenz1](https://avatars.discourse-cdn.com/v4/letter/l/ce7236/32.png) [@lorenz1](https://forum.shopware.com/u/lorenz1)\
**Post date:** [4. September 2017 um 13:29 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/14 "2017-09-04T13:29:43Z")

</div>

Hi,

ich möchte diesen Thread nochmal rauskramen. Ich stehe gerade auch vor dert Problematik, ich möchte nicht an die DOM&nbsp;Elemente um möglichst wenig templateseitig einzugreifen. Folgendes Ziel:&nbsp;

Ich möchte ohne DOM-Anpassungen (==data attr) die Konfigwerte der regulären Slider aus dem RWD Template nur auf der Detailseite anpassen können. Um beim Beispiel zu bleiben möchte ich ansich das der Shop die vorhandenen Slider so ausgibt als hätte ich sie folgend getriggert:

```
aber dabei nicht im Template data-itemMinWidth="350" bzw die includes Variable nachpflegen müssen. Ich habe versucht mich an irgendwelche events wie zB onInitSlider zu hängen um zB Rückgabewerte zu manipulieren leider ohne erfolg (ich habe in den Objects auch keine opts gefunden meine funktionen liefen aber sicher). Ich habe versucht per jQuery in einer schleife die Werte im DOM nachzutragen: 

$(this).find('.product-slider').attr('data-itemMinWidth', 400);

die Werte wurden auch nachgetragen aber vermutlich zu spät zumindest wirken Sie sich nicht aus. Ich habe versucht mit der overridePlugin methoode wie hier oder auch in der dev doku werte zu verändern auch das hat leide rnicht funktioniert (und wenn ich es richtig verstanden habe ja wenn eh nur global). Gibt es keine einfache möglichkeit die Defaults bzw auch mögliche Customwerte "von aussen" zu manipulieren?

Ich könnte ja bestimmt auch per:

// Initialisierung über den StateManager
window.StateManager.addPlugin(
    '.dein-selektor', 
    'swProductSlider', 
    { itemMinWidth: 300 }
);

den Wert wie hier beschrieben neu übergeben, sicher kann ich dann auch eine Einschränkung vornehmen anhand des Klassennamen zB.:

// Initialisierung über den StateManager
window.StateManager.addPlugin(
    '.detail .meineklasse .dein-selektor', 
    'swProductSlider', 
    { itemMinWidth: 300 }
);

Da ich per tpl anpassung eh eine eigene Klasse im DOM habe wäre das theoretisch auch alles so möglich, nur sind diese Slider Elemente ja bereits anhand des data-attrs data-Product-Slider initialisiert. Ich habe das Gefühl das ich hier die BestPractice einfach nicht sehe bzw. nicht verstehe. Ich finde die grundsätzliche js einbindung sehr gut gelungen und habe auch schon einiges an anpassungen vorgenommen oder kleinere Plugins geschrieben, aber hier stehe ich irgendwie total auf dem Schlauch. Ich hoffe irgendwer kann mir helfen.

 

Viele Grüße
```

---

<div class="post-metadata">

**Author:** ![lorenz1](https://avatars.discourse-cdn.com/v4/letter/l/ce7236/32.png) [@lorenz1](https://forum.shopware.com/u/lorenz1)\
**Post date:** [4. September 2017 um 13:39 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/15 "2017-09-04T13:39:05Z")

</div>

> [@obertech schrieb:](https://forum.shopware.com/profile/25127/obertech "obertech")
> 
> Hallo
> 
> Wie und wo muss ich die Einstellung einbinden?
> 
> // Klassische Initialisierung  
> $(‚.dein-selektor‘).swProductSlider({  
> itemMinWidth: 300  
> });
> 
> // Initialisierung über den StateManager  
> window.StateManager.addPlugin(  
> ‚.dein-selektor‘,  
> ‚swProductSlider‘,  
> { itemMinWidth: 300 }  
> );
> 
> LG Mirko

Hi,

beides würde theoretisch in nem, eigenen js file landen was idealer weise Shopware konform mit ins main js kompiliert wird. Brauchen würdest du aber nur entweder oder. Der erste Block bewirkt das Shopweit alle elemente mit der Klasse .dein-selektor in einen Slider gewandelt werden (daher sollten dann auch die Daten vorhanden sein) welcher nur den Parameter itemMinWidth=300 besitzt. Im zweiten Block würde das Element mit der Klasse .dein-selektor&nbsp;über den Statemanager initialisiert werden. Im Beispiel endet das in der gleichen Situation, man könnte hier aber zB optionale Parameter anhängen um auf verschiedenen Devices js seitig unterschiedlich reagieren zu können.

&nbsp;

vg

---

<div class="post-metadata">

**Author:** ![lorenz1](https://avatars.discourse-cdn.com/v4/letter/l/ce7236/32.png) [@lorenz1](https://forum.shopware.com/u/lorenz1)\
**Post date:** [6. September 2017 um 11:49 UTC](https://forum.shopware.com/t/overrideplugin-defaults/32130/16 "2017-09-06T11:49:37Z")

</div>

Hi,

&nbsp;

nochmal gibt es den wirklich keine Möglichkeit diese optionen anzupassen ohne das DOM zu bearbeiten?

&nbsp;

Viele Grüße
