“No conflict mode” is an option in MetaSlider that can prevent issues with some themes.
- Go to “MetaSlider” in our WordPress admin menu.
- Edit your slideshow and look for the “Advanced Settings”.
- Check the “No Conflict Mode’ box.
- Save the slideshow.
The Technical Details Behind No Conflict Mode
When you use MetaSlider slideshow, our plugin will output a slideshow with markup that looks like this example below for the Flexslider option.
<div id="metaslider_123" class="flexslider"> <ul> <li>... slide 1 ...</li> <li>... slide 2 ...</li> </ul> </div>
Looking at this code, you’ll see a “flexslider” class on the slideshow wrapper. This is needed to apply the flexslider styling to the slideshow.
Because the MetaSlider slideshow has a “flexslider” class, the theme’s call to FlexSlider will be run on the MetaSlider slideshow, but without the MetaSlider specific settings.
When “No Conflict Mode” is enabled, the slideshow output looks something like this:
<div id="metaslider_123"> <ul> <li>... slide 1 ...</li> <li>... slide 2 ...</li> </ul> </div>
In this code avoce, the “flexslider” class is absent. This means the themes call to FlexSlider will not target this slideshow.
Delaying the addition of the “flexslider” class to the slideshow markup will stop a theme from “hijacking” the MetaSlider initiation code. The “flexslider” class is added later in order to apply the correct styling to the slideshow.