Skip to main content

[WP] Slider looks correctly in preview, but when I add it to site it doesn't work

Reasons why slider may not work when you embed it to your theme:

1. RoyalSlider JavaScript and/or CSS files are not added to page​

To check if this is your issue, simply go to RoyalSlider Global Settings page and enable checkbox that will load slider files on all pages. If after enabling checkbox CSS and JS files are still not included, check issue #5 in this list. More about including JS & CSS files.

2. You have two jQuery.js scripts on one page​

This issue is caused when your theme or one of your plugins adds jQuery directly with a script tag. jQuery in WordPress should be added only with <?php wp_enqueue_script('jquery'); ?>.

You need to find <script> tag that adds jQuery, most likely it's in header.php or footer.php of your theme, but can be anywhere. And replace with <?php wp_enqueue_script('jquery'); ?> Usually inproper script tag looks something like:

<script type='text/javascript' src='http://some_path/jquery.min.js'></script>

3. You have old (or non-default) version of jQuery​

This issue is caused when your theme or one of your plugins deregisters default jQuery script using wp_deregister_script('jquery') and adds own. If error like: Object has no method 'on' appears on your JavaScript console then this is definitely your issue.

To fix this find where your theme or one of your plugins deregisters jQuery and leave just wp_enqueue_script part, or simply change path to newer version of jQuery. Deregistering of script usually looks something like this:

wp_deregister_script('jquery');
wp_register_script('jquery', "http://some_path_here/jquery.min.js");
wp_enqueue_script('jquery');

and should be replace just with:

wp_enqueue_script('jquery');

The easiest way to find this part of code is to just download theme or plugins folder that causes the issue and do a bulk search through its files.

Learn more: Why Loading Your Own jQuery is Irresponsible?

4. You have JavaScript error on your site that blocks JavaScript execution​

To check if this is your issue open javascript console in your browser and find from which script error appears. Then simply contact the developer of that theme or plugin or fix issue by yourself. The easiest way to find which one causes problem is to deativate all plugins and change theme to default twenty-ten.

If error comes from RoyalSlider script:

  • Error like Object has no method 'on' means that old jQuery script is used. Check section #3 in this aticle.
  • Error like Object has no method 'royalSlider' means that slider script is not included or you have two scripts on one page, check section #1 or #2.
  • If any other error appears, please open support ticket and provide link to page with problem slider.

If you use theme from trusted providers or you use default twenty* theme and you haven't modified code - 99% this is not your issue. wp_head() should be added in header, wp_footer() in footer, check WordPress codex for more info.

To find what's causing the issue​

  • Deactivate all other plugins
  • Switch to default theme
  • Check if RoyalSlider now works correctly, if it doesn't - open private support ticket and provide admin access.
  • Switch to your theme and start activating your plugins one by one to see which one causes the issue.

Side note

All issues above are caused third party themes and plugins that don't comply WordPress coding standards. If you've found the issue, contact the developer of that theme or plugin.

If you have problems figuring out this by yourself, please open a support ticket and send a link to page with broken RoyalSlider and I'll tell you what causes your issue.