I am working on the integration of an Amazon Webstore (Amazon Checkout) on a WordPress site using Amazon Documentation here. Has been a while since I worked with enqueueing external JScripts. I need to load two scripts from Amazon. I added some code to functions.php, but I seem to have made a mistake and I keep on getting errors such as:
TypeError: 'undefined' is not a function (evaluating '$(jQuery(document).find("#globalParameters"))').
On merchant_cart.js:5
Here is the code:
function img_scripts_with_jquery()
{
// Register the script like this for a theme:
wp_register_script( 'aws-cba', 'https://images-na.ssl-images-amazon.com/images/G/01/cba/js/common/cba_shared.js', array( 'jquery' ));
// For either a plugin or a theme, you can then enqueue the script:
wp_enqueue_script( 'aws-cba' );
//second script
wp_register_script( 'aws-merchant-cart', 'https://images-na.ssl-images-amazon.com/images/G/01/cba/js/shoppingcart/merchant_cart.js', array( 'jquery' ));
// For either a plugin or a theme, you can then enqueue the script:
wp_enqueue_script( 'aws-merchant-cart' );
}
add_action( 'wp_enqueue_scripts', 'img_scripts_with_jquery' );
What coding mistake am I making here? is the enqueueing of these two external scripts in need of jQuery OK?
Update
Loading scripts in footer makes things better, but when I added the button to load the cart I still got the same error. Current script is now:
/Enqueue AWS Scripts
function img_scripts_with_jquery()
{
// Register the First Script:
wp_register_script( 'aws-cba', 'https://images-na.ssl-images-amazon.com/images/G/01/cba/js/common/cba_shared.js', array( 'jquery' ),'version', true );
// Enqueue it:
wp_enqueue_script( 'aws-cba' );
//Register Second Script
wp_register_script( 'aws-merchant-cart', 'https://images-na.ssl-images-amazon.com/images/G/01/cba/js/shoppingcart/merchant_cart.js', array( 'jquery' ), 'version', true);
// Enqueue this one too:
wp_enqueue_script( 'aws-merchant-cart' );
}
add_action( 'wp_enqueue_scripts', 'img_scripts_with_jquery' );
Update II
Firebug described the error as follows:
TypeError: $ is not a function
https://images-na.ssl-images-amazon.com/images/G/01/cba/js/shoppingcart/merchant_cart.js?ver=version
Line 5
Seems like a jQuery conflict..
Try to save
jQuery.noConflict();
asjquery-no-conflict.js
. Then enqueue everything with proper dependencies: