wordpress jquery version conflicts - javascript

In Wordpress use hook wp_enqueue_script to override jQuery version but it does not work.And i need both jquery.
I want to add new jquery version for website customization.
But when i add new version of jquery the old version of jquery functionally not working
function.php:
function themeslug_enqueue_script(){
wp_enqueue_script('child_theme_script_handle', 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js',
array( 'jquery' ), '3.2.1', true );
wp_enqueue_script( 'my-great-script', get_stylesheet_directory_uri() . '/core/assets/js/multi-vendors.js',
array( 'jquery' ), '1.0', true );
}
add_action('wp_enqueue_scripts', 'themeslug_enqueue_script');
jQuery.js:
$(document).ready(function(){
alert('Hello');
});
Some functionally is not working. For example, the slider.

You need to first de register you old version script and enqueue new the version.
Please use this code to change the jquery version.
<?php function modify_jquery() {
if (!is_admin()) {
wp_deregister_script('jquery');
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js', false, '1.7.2');
wp_enqueue_script('jquery');
}
}
add_action('init', 'modify_jquery'); ?>

Thanks Every one to give suggestion.
I put my code in custom.js file and It's work.
There is no need to add new jquery.
Sorry to misguide you.

Related

wordpress jquery is not responding as dependency

I have converted a html ecommerce template into woocommerce. but it is not working properly.the nivo slider and some other product is not working. maybe they are not finding wordpress jquery. although I enqueue custom jquery and other js file. here are the nivo slider js code below.
$(document).ready(function() {
$('#slideshow').nivoSlider();
}
);
its dependencies is jquery 1.7.1
First of all, if there's an issue with jQuery like $ is not defined then you need to use jQuery instead of $. Your new code will be
jQuery(document).ready(function($) {
$('#slideshow').nivoSlider();
}
Now, if you need a jQuery version other than the one WP uses. You can deregister and enqueue your specific jQuery again. Add this to your functions.php file
add_action( 'wp_enqueue_scripts', function(){
wp_dequeue_script( 'jquery' );
wp_deregister_script( 'jquery' );
wp_register_script( 'jquery', 'URL_OF_YOUR_NEW_JQUERY_FILE', array(), NULL, false );
wp_enqueue_script( 'jquery' );
});

wp_enqueue not working at all

I'm trying to create a wordpress theme and start learning the best way to include javascript and css files using wp_enqueue. After couple hours, I still can't load the files. Here is the code I use
function compro_scripts() {
wp_register_style( 'style', get_template_directory_uri() . '/css/materialize.css', array(), '20150208', 'all');
wp_enqueue_script( 'style' );
}
add_action( 'wp_enqueue_scripts', 'compro_scripts' );
It looked simple on every tutorial I've read, but it still not work for me. Would anyone mind helping me solve this ?
This very basic knowledge of Wordpress, but as a newbie I found out this is pretty confusing. If you want to use the best practice to include javascript and css files make sure to add wp_head() and wp_footer(). The rest of it is described clearly here How to Load Javascript like Wordpress Master
You've registered the "style" handle with wp_register_style() and you're enqueuing it by using wp_enqueue_script() which is incorrect. wp_enqueue_script() in your code needs to be replaced by wp_enqueue_style(), since it's a style that you are including, not a script.
Alternatively, you can simply enqueue scripts and styles directly without the need to register them separately - like this
function compro_scripts() {
$template_dir = get_template_directory_uri();
//enqueue a style
wp_enqueue_style( 'style', $template_dir . '/css/materialize.css', array(), '20150208', 'all');
//enqueue a script
wp_enqueue_script( 'custom', $template_dir . '/js/custom.js', array( 'jquery' ), false, false );
}
add_action( 'wp_enqueue_scripts', 'compro_scripts' );

How to include jQuery in a WordPress theme?

I am pretty new to WordPress and I am figuring out how to include jQuery into a theme.
I create the following function into functions.php theme:
function load_java_scripts() {
// Load FlexSlider JavaScript that handle the SlideShow:
wp_enqueue_script('jQuery-js', 'http://code.jquery.com/jquery.js', array(), '1.0', true);
}
add_action('wp_enqueue_scripts', 'load_java_scripts');
So I think that I can add it as some other JavaScript or CSS local resources but I am not sure about this method because in this case the jquery.js is not a local resource but is an online resource (is it the same thing?)
I also have some doubts because searching online I have found different methods to add jQuery to my theme, like this one.
Can you give me some information about how to correctly complete this task?
Is there any specific reason why you're not using the jQuery found in WordPress?
If you need to add your JavaScript file which depends on jQuery, you can add jQuery as a dependency.
<?php
function my_scripts_method() {
wp_enqueue_script(
'custom-script',
get_stylesheet_directory_uri() . '/js/custom_script.js', #your JS file
array( 'jquery' ) #dependencies
);
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );
?>
Note that WordPress loads jQuery in no conflict wrappers. so your code should be like:
jQuery(document).ready(function($) {
// Inside of this function, $() will work as an alias for jQuery()
// and other libraries also using $ will not be accessible under this shortcut
});
Since WP already comes with jQuery, I would simply load it for your theme, add it like this into your functions.php
function load_scripts(){
//Load scripts:
wp_enqueue_script('jquery'); # Loading the WordPress bundled jQuery version.
//may add more scripts to load like jquery-ui
}
add_action('wp_enqueue_scripts', 'load_scripts');
There are several ways to include jQuery into a theme. I always use WP bundled version which I find very simple.
In wordpress No need for Custom Jquery.
Add dependencies as 'jquery' it'll automatically get loaded.
try this,
<?php
function load_external_jQuery() {
wp_deregister_script( 'jquery' ); // deregisters the default WordPress jQuery
$url = 'http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'; // the URL to check against
$test_url = #fopen($url,'r'); // test parameters
if( $test_url !== false ) { // test if the URL exists if exists then register the external file
wp_register_script('jquery', '//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js');
}
else{// register the local file
wp_register_script('jquery', get_template_directory_uri().'/js/jquery.js', __FILE__, false, '1.7.2', true);
}
wp_enqueue_script('jquery'); // enqueue the jquery here
}
add_action('wp_enqueue_scripts', 'load_local_jQuery'); // initiate the function
?>
You can use the methods below to include jQuery:
wp_enqueue_script( 'jquery' );
wp_enqueue_script( 'load-js-validate', 'foldername/jquery.js' );
Directly add in header file.<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.js"></script>
function js_scripts() {
wp_enqueue_script( 'jquery', get_template_directory_uri() . '/js/example.js');
}
add_action( 'wp_enqueue_scripts', 'js_scripts' ); // add this in function file

Wordpress unSlider issue

I'm trying to get unlider.js working on Wordpress. My guess is that the registration of the script is not working properly.
I am using a child theme, and this is the code I put in functions.php to register the script (taken from WP guide).
Clearly, I am doing something wrong, perhaps the script is being inserted before jQuery.
What is the best way to attach a script from a child theme, after jQuery?
One I have so far is this:
<?php
add_action( 'wp_enqueue_scripts', 'child_add_scripts' );
function child_add_scripts() {
wp_register_script(
'google-analytics',
get_stylesheet_directory_uri() . '/unslider.js',
array( 'jquery' ),
false,
'1.0',
true
);
wp_enqueue_script( 'google-analytics' );
}
?>

Bootstrap3.js and Wordpress jQuery v1.10.2 do not work properly

I have a problem with Bootstrap.js 3. More precisely, my problem is with collapse.js for menu scrolling function and jquery library from Wordpress 1.3.7.
I would like to use jquery from WP. When I enqueue bootstrap js, scrolling simply doesn't work. If I delete Wordpress jquery.js from wp-includes/js/jquery and add an older version of JQuery (i.e: v1.9.1) the scrolling function works great!
Is that possible that boostrap.js has some conflict with new jquery.js?
This is my code in functions.php
function my_scripts() {
wp_enqueue_script( 'jquery');
wp_enqueue_script( 'bootstrap', get_template_directory_uri() . '/assets/js/bootstrap.js', array('jquery'), true );
}
add_action( 'wp_enqueue_scripts', 'my_scripts' );
Thanks in advance
It is because of jQuery's no conflict mode. You need to have following statement in between jQuery script inclusion and bootstrap script inclusion
var $ = jQuery.noConflict();
or go to wp-includes/js/jquery and delete or comment last statement which is like
jQuery.noConflict();

Categories