Enqueue AWS Script

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

Topic amazon web-services wp-enqueue-script Wordpress

Category Web


Try to save jQuery.noConflict(); as jquery-no-conflict.js. Then enqueue everything with proper dependencies:

<?php
function img_scripts_with_jquery() {
    wp_enqueue_script(
        'jquery-no-conflict',
        'path/to/jquery-no-conflict.js',
        array(
            'jquery'
        ),
        'version',
        true
    );
    wp_enqueue_script(
        'aws-cba',
        'https://images-na.ssl-images-amazon.com/images/G/01/cba/js/common/cba_shared.js',
        array(
            'jquery-no-conflict'
        ),
        'version',
        true
    );
    wp_enqueue_script(
        'aws-merchant-cart',
        'https://images-na.ssl-images-amazon.com/images/G/01/cba/js/shoppingcart/merchant_cart.js',
        array(
            'jquery-no-conflict'
        ),
        'version',
        true
    );
}
add_action( 'wp_enqueue_scripts', 'img_scripts_with_jquery' );

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.