Sidr Jquery Plugin & wordpress

  • Resolved artlover578

    (@artlover578)


    10 years, 11 months ago

    Hello All,

    I am new to this so please bare with me, I want to create a slide out Navigation using the primary menu. I would like to use the Sidr jquery plugin. I have attached all the necessary code including a init.js script to initialize the Sidr Plugin and the necessary .css for the template. below you will find the code that I am using in my functions.php file:

    //* Enqueue Sidr and Touchwipe jQuery plugins
add_action( 'wp_enqueue_scripts', 'enqueue_sidr_touchwipe' );
function enqueue_sidr_touchwipe() {

	wp_enqueue_script( 'sidr',  get_stylesheet_directory_uri() . 'https://www.isisboutiqueinc.com/dev2014/wp-content/themes/isisboutiquestore/js/jquery.sidr.min.js', array( 'jquery' ), '1.0.0', true );
	wp_enqueue_script( 'sidr-init',  get_stylesheet_directory_uri() . 'https://www.isisboutiqueinc.com/dev2014/wp-content/themes/isisboutiquestore/js/jquery.sidr.min.init.js', array( 'sidr' ), '1.0.0', true );
	wp_enqueue_style( 'sidr-css', get_stylesheet_directory_uri() . 'https://www.isisboutiqueinc.com/dev2014/wp-content/themes/isisboutiquestore/css/jquery.sidr.dark.css' );

	// to make the right/left swipe touch event open or close the responsive menu
	wp_enqueue_script( 'touchwipe',  get_stylesheet_directory_uri() . 'https://www.isisboutiqueinc.com/dev2014/wp-content/themes/isisboutiquestore/js/jquery.touchwipe.min.js', array( 'jquery' ), '1.0.0', true );
	wp_enqueue_script( 'touchwipe-init',  get_stylesheet_directory_uri() . 'https://www.isisboutiqueinc.com/dev2014/wp-content/themes/isisboutiquestore/js/jquery.touchwipe.min.init.js', array( 'touchwipe' ), '1.0.0', true );

}

    the files include on my server are:

    jquery.sidr.min.js
    jquery.sidr.min.init.js :

    jQuery(document).ready(function($) {

	$('#primary-nav-link').sidr({
		name: 'sidr-primary-nav',
		source: '#primary-nav-container'
	});

});

    jquery.touchwipe.min.js
    jquery.touchwipe.min.init.js
    jquery.sidr.dark.css

    is there anyone that could help me out on this issue, it would be highly appreciated.

    thanks:)

Viewing 1 replies (of 1 total)

  • Can you explain what issue you are experiencing? Is the menu not loading? Are you getting any errors in the console of the development tools in you browser?

    I have just added the Sidr script to a WordPress site today and it worked just fine. This is using the latest version of WordPress and Sidr.

    One thing that I did differently from your set up is to register the scripts before enqueuing them in your functions.php.

    I did the following:

    wp_register_script('sidr-js', get_stylesheet_directory_uri() . '/js/jquery.sidr.min.js', array('jquery'), '1.2.1', false);
        wp_enqueue_script('sidr-js');

    I am not sure if that will make a difference but could be worth a try. If not please elaborate on your issue and I’ll see if I can help you out.

    Edit:
    I just realised that your paths are not going to work. You are pointing to the stylesheet directory and then and full url. The Url needs to be relative to the stylesheet directory. What you can do is refactor the url to be relative or just remove the get_stylesheet_directory_uri(). I would do the first option as it gives you more flexibility.

Viewing 1 replies (of 1 total)
  • The topic ‘Sidr Jquery Plugin & wordpress’ is closed to new replies.