-1

I hope you can help me, I've scoured the internet for hours and can't seem to make this work. I'm trying to follow these directions for using MixItUp: https://mixitup.kunkalabs.com/learn/tutorial/get-started/

The HTML and the CSS show up correctly. But I can't get the jQuery to load. I've looked at other answers and several tutorial sites, tweaking the code here and there, but still nothing happens.

This is all that's in my file custom.js (I've changed the id/class 'Container' to 'projects' because I already have a Container class)

jQuery(document).ready(function($){
$('#projects').mixItUp();
});

This is in my functions.php

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
wp_enqueue_script( 'projects', get_stylesheet_directory_uri() . '/js/custom.js', array('jquery'), '1.0.0', true );
}

and I need to call the MixItUp js file, I've tried wp_enqueue_script ing it in the functions.php. I've tried pasting this

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://cdn.jsdelivr.net/jquery.mixitup/latest/jquery.mixitup.min.js"></script>
<script src="main.js"></script>

in the footer.php right before the </body> tag, I tried it in the individual page editor, in the header.php...

I am probably missing something so glaringly obvious! I'm new to coding so I don't understand. Any guidance is much appreciated!

  • When you say you can't get the jQuery to load, do you mean the files don't load or just that you don't see the effect you want? What HTML are you using and what do you want to happen? – Andy Macaulay-Brook May 24 '16 at 20:52
  • You're on the right track with wp_enqueue_scripts. Don't just put them all in your footer file, amongst other things you run the risk of loading more than one jQuery. – Andy Macaulay-Brook May 24 '16 at 21:02
  • Including your HTML in your question might be helpful. It'll help everyone here understand whether it's the loading of the file or the effect of the jQuery the actual problem. – RaajTram May 25 '16 at 2:11
  • And in your footer.php you refer to main.js and not to custom.js. What's in main.js? – Andy Macaulay-Brook May 25 '16 at 8:52
0

I would download the jquery.mixitup.min.js and place it in the same folder as your custom script (js), also makes sense to place the "main.js" file in there also, keeping your js together, if you can.

Not sure if your using a child theme or not,if not but add the following to your functions file, overwriting your original code:

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
wp_enqueue_script('jquery');
wp_enqueue_script( 'custom-script', get_template_directory_uri() . '/js/custom.js',array(), '1.0.0',false );
wp_enqueue_script( 'projects', get_template_directory_uri() . '/js/main.js',array(),false,false );

}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.