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

Read More

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

Related posts

Leave a Reply

1 comment

  1. 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' );