# Override default responsive theme components

**URL:** <https://forum.shopware.com/t/override-default-responsive-theme-components/66877>\
**Category:** Themes & Design\
**Created:** [12. Mai 2020 um 10:37 UTC](https://forum.shopware.com/t/override-default-responsive-theme-components/66877 "2020-05-12T10:37:36Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![LivingEd](https://avatars.discourse-cdn.com/v4/letter/l/8edcca/32.png) [@LivingEd](https://forum.shopware.com/u/LivingEd)\
**Post date:** [12. Mai 2020 um 10:37 UTC](https://forum.shopware.com/t/override-default-responsive-theme-components/66877/1 "2020-05-12T10:37:36Z")

</div>

Hello,

I am trying to override the default values in the responsive theme. We have created our&nbsp; own theme which extends the responsive theme. In our website I am trying to use the jquery image slider component that is included in the responsive theme. The default value of autoSlide is set to false and I would like to change this to true so that the images slide automatically after every 5 seconds.  
I tried the following ways to do this:

1. Using the override method.  
Below is the new plugin that I have created ( jquery.image-slider.js) and added to&nbsp; themes / Frontend / MyTheme / frontend / \_public / src / js /. I also added  
protected $javascript = [  
&nbsp;&nbsp; &nbsp;‚src/js/jquery.image-slider.js‘  
]  
to my Theme.php file. My plugin file looks like this:

;(function (, window) { &nbsp;&nbsp; &nbsp;'use strict'; &nbsp;&nbsp;&nbsp; .overridePlugin(‚swImageSlider‘, {

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; defaults: {  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; autoSlide: true  
&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp;  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; },  
&nbsp;&nbsp; &nbsp;&nbsp; init: function () {  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var me = this;  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; me.superclass.init.apply(this,arguments);  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }&nbsp;&nbsp; &nbsp;  
&nbsp;&nbsp;&nbsp; });  
});

1. I also tried this in my plugin file:  
$.plugin(‚swImageSlider‘, {  
&nbsp;&nbsp;&nbsp; defaults: {  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ‚autoSlide‘: true  
&nbsp;&nbsp;&nbsp; }  
});

2. I added the below code to my html file

&nbsp;

These options did not work. Can somehow guide me as to what I am doing wrong.

Thak you in advance.

---

<div class="post-metadata">

**Author:** ![LivingEd](https://avatars.discourse-cdn.com/v4/letter/l/8edcca/32.png) [@LivingEd](https://forum.shopware.com/u/LivingEd)\
**Post date:** [12. Mai 2020 um 11:34 UTC](https://forum.shopware.com/t/override-default-responsive-theme-components/66877/2 "2020-05-12T11:34:29Z")

</div>

The html code is: div class=“image-slider” data-image-slider=“true” autoSlide = “true”
