Execute js files doesn’t seem to work

I have developed a website that uses the “Royal Slider”. The post loads custom fields from the database without a problem and loops through the images and create a lovely slideshow as can be seen at

http://www.ccmediaservices.co.uk/property/2-bedroom-apartment-to-rent/

Read More

The problem is I want to pass some custom settings to customise the slider. Normally this is achieved with this block of js at the bottom of the html just before tag.
This is the settings js initialise code

<script>
jQuery(document).ready(function($) {
$('.royalSlider').royalSlider({
fullscreen: {
  enabled: true,
  nativeFS: true
},
controlNavigation: 'thumbnails',
autoScaleSlider: true, 
autoScaleSliderWidth: 960,     
autoScaleSliderHeight: 850,
loop: false,
imageScaleMode: 'fit-if-smaller',
navigateByClick: true,
numImagesToPreload:3,
arrowsNavAutoHide: true,
arrowsNavHideOnTouch: true,
keyboardNavEnabled: true,
fadeinLoadedSlide: true,
globalCaption: true,
globalCaptionInside: false,
thumbs: {
  appendSpan: true,
  firstMargin: true,
  paddingBottom: 4

}
});
});
</script>

In wordpress this is not possible as I am well aware so I did the standard procedure of placing two action hooks in the function file. One to register the script and one to print it from the footer. This is my code

/* Royal Slider Hooks */

add_action ('init', 'register_my_royal_slider_script');

add_action ('wp-footer', 'print_my_royal_slider_script');

/* Royal Slider Functions */

function register_my_royal_slider_script() {
wp_register_script('my-script', get_template_directory_uri() . '/royalslider/custom-slider-settings.js', array('jquery'), '1.0', true);
}


function print_my_royal_slider_script() {
global $add_my_script;

if ( ! $add_my_script )
    return;

wp_print_scripts('my-script');
}

Unfortunatly it is failing to have any effect. Is there something wrong with any of the above code you can see? I’m a bit confused I’m getting no errors with this

Related posts

Leave a Reply

1 comment

  1. Just hook to wp_enqueue_scripts for both registering and enqueueing. You’ve registered with in_footer (last parameter in your code) true so what you need is:

    function print_my_royal_slider_script() {
      global $add_my_script;
      if ( ! $add_my_script ) return;
      wp_enqueue_script('my-script');
    }
    add_action ('wp_enqueue_scripts', 'print_my_royal_slider_script');
    

    The problem is going to be with $add_my_script. That has to be set before wp_head runs. If that is not possible– if, for example, you are setting it in your Loop–, I believe your only choice is to echo the script hooked to wp_footer but you can (almost) do it properly by using the $wp_scripts object to do the work.

    function print_my_royal_slider_script() {
      global $wp_scripts,$add_my_script;
      if ( ! $add_my_script ) return;
      wp_enqueue_script('my-script');
      $wp_scripts->do_item('my-script');
    }
    add_action ('wp_footer', 'print_my_royal_slider_script');