skip to Main Content

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!!!

2

Answers


  1. Chosen as BEST ANSWER

    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. 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