Metaslider homepage not working correctly

Hey @dmykins,

It looks like styles are turned off. Go to the slider settings -> advanced and check that Print CSS is enabled.

@kbat82

Thank you for the quick reply. I check and Print CSS is enabled. Some of the other settings I have:

The size is set to the size of the slider I made 2250 x 450 px.
Center-Align is checked
I do not have 100% Wide Output Checked under metaslider, but under customize->home I have full width output selected.

Any other thoughts?

I noticed I cannot scroll through slides either, the arrows are missing to go to the next slide.

I have uninstalled and reinstalled the plug-in as well.

Thank you again!

• This reply was modified 7 years, 1 month ago by dmykins.
• This reply was modified 7 years, 1 month ago by dmykins.

Something is removing the JS and CSS files from the page. I don’t see any of them on your page. Two ways this could happen is if Print CSS/JS are not checked enabled (most common, so I’d double-check), or if the theme developer has manually disabled them (to use their own, so check theme settings too).

If you have a caching or minifying plugin you could try flushing that.

Vantage has been releasing updates lately, you could make sure you’re updated to their latest theme (an update may have caused the issue though).

@kbat82

Thank you for that. I double checked and both Print CSS and JS are checked. I messed around and unchecked NO Conflict Mode and the image is now centered. When I check No Conflict Mode it goes back to being un-centered. Again, missing the arrows to switch. So as of right now at least it is better than it was…

It looks like Vantage adds their own stlyes for MetaSlider, and they deregister the Javascript. Recently, I had to move from inlining the JS to using a WP hook as some themes were printing out code as if it were text. Plus, better to do it the right way. However, since Vantage removes it with a filter, the new inline hook never runs. I believe they released an update though

That might be confusing. Long story short, can you add Javascript to your theme somewhere? This should work:

jQuery(function($) { 
  $('#metaslider_5950').flexslider();
});

Then you can add options however you’d like:
https://gist.github.com/warrendholmes/9481310

jQuery(function($) { 
  $('#metaslider_5950').flexslider({
    slideshow: false
  });
});

Hi @dmykins,

I’ll mark this as resolved since we didn’t hear back from you please open a new issue if you have any more problems. Have a good week!