Question 165943 in Wordpress Question posted in
The official Wordpress documentation can be found here.

Can’t get Magicmouse.js to load in custom WordPress theme?

Im building out a WP theme from the ground up and I have added tye js and css files for mightmouse.js to my themes css and js directory. I have enqueued both of the elements in the fuctions.php file using

function cursor_javascript() {
wp_enqueue_script( 'mousemagic-js', get_template_directory_uri() . '/js/magic_mouse.js' );
}
add_action( 'wp_enqueue_scripts', 'cursor_javascript' );

function cursor_stylesheets() {
    wp_enqueue_style( 'mousemagic-css', get_template_directory_uri() . '/css/magic-mouse.css' );
}
add_action( 'wp_enqueue_scripts', 'cursor_stylesheets' );

I am trying to get the cursor to show on all pages but im not getting it to present itself. When I use inspect on the page i can see the elements being loaded in. How would I go about adding the function to each page gloablly without using any plugins?

Thanks in advance!!!

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Thanks to the help of @Andrea Oliviato!

    Issue has been solved.

    The issue was lying with me not encapsulating the local js script properly. I have used the following;

    jQuery(document).ready(function(){
  options = {
    "cursorOuter": "circle-basic",
    "hoverEffect": "circle-move",
    "hoverItemMove": false,
    "defaultCursor": false,
    "outerWidth": 30,
    "outerHeight": 30
    }
  magicMouse(options);
})

    The cursor function is working beautifully thank you!


  2. 0

    You need to initialise magicmouse after loading it.

    Create a new script within your theme directory, e.g. magicmouse.local.js and in the file put the initialisation call.

    For example this is the content of magicmouse.local.js:

    options = {
  "cursorOuter": "circle-basic",
  "hoverEffect": "circle-move",
  "hoverItemMove": false,
  "defaultCursor": false,
  "outerWidth": 30,
  "outerHeight": 30
}
magicMouse(options);

    Then load this script as well with wp_enqueue_script

    For example this is the updated function

    function cursor_javascript() {
wp_enqueue_script( 'mousemagic-js', get_template_directory_uri() . '/js/magic_mouse.js' );
wp_enqueue_script( 'mousemagic-js-local', get_template_directory_uri() . '/js/magicmouse.local.js' );
}
add_action( 'wp_enqueue_scripts', 'cursor_javascript' );
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search