I put together a tutorial in the YouTube video below to show you exactly how to cross-reference EVERY video on your Amazon Storefront!

New code below for the updates Storefont layout!

Step 1: ID Fetch Code (Run this first!)

NOTE

Original Storefront Layout

Go to your Storefront, right click and select Inspect. Then in the new window on the right, select Console from the top. Paste this code into the window as I do in the video:

(async function() {
function getASINs() {
const asinElements = document.querySelectorAll('.video-item-wrapper');
const asins = [];
asinElements.forEach(el => {
const asin = el.querySelector('span[data-video-item-click]').getAttribute('data-video-item-click');
const asinData = JSON.parse(asin);

// Extract related products
const relatedProducts = asinData.lightboxParams.relatedProducts;
if (relatedProducts) {
const relatedProductList = relatedProducts.split(','); // Split the comma-separated string into an array
asins.push(relatedProductList);
}
});
return asins;
}

async function logAllRelatedProducts() {
console.log('Starting to log related products');
let foundRelatedProducts = new Set();
let totalProducts = 0;

const currentASINs = getASINs();

for (const relatedProducts of currentASINs) {
totalProducts++; // Increment for each video element (product) found
for (const product of relatedProducts) {
if (!foundRelatedProducts.has(product)) {
foundRelatedProducts.add(product);
console.log(`Logging related product: ${product}`);
}
}
}

console.log(`Final Related Products: ${Array.from(foundRelatedProducts).join(',')}`);
console.log(`Total number of video elements processed: ${totalProducts}`);
}

// Start the process of logging all related products
await logAllRelatedProducts();
})();


Updated storefront layout (BETA)

(async function() {
    function getASINs() {
        console.log("Fetching ASINs from the page...");
        
        // Select all elements with the 'data-asin' attribute
        const asinElements = document.querySelectorAll('[data-asin]');
        console.log(`Found ${asinElements.length} elements with 'data-asin'.`);
        
        const asins = [];

        asinElements.forEach((el, index) => {
            const dataAsin = el.getAttribute('data-asin'); // Extract the ASIN
            console.log(`Element ${index}: data-asin = ${dataAsin}`);

            // Extract the ASIN if it starts with "amzn1.asin."
            if (dataAsin && dataAsin.startsWith('amzn1.asin.')) {
                const actualAsin = dataAsin.replace('amzn1.asin.', ''); // Remove the prefix
                console.log(`Valid ASIN extracted: ${actualAsin}`);
                // Format the ASIN as an array to match the original structure
                const relatedProducts = [actualAsin];
                asins.push(relatedProducts);
            } else {
                console.log(`Invalid or missing ASIN for element ${index}`);
            }
        });

        console.log(`Total ASINs extracted: ${asins.length}`);
        return asins;
    }

    async function logAllRelatedProducts() {
        console.log('Starting to log related products...');
        let foundRelatedProducts = new Set();
        let totalProducts = 0;

        const currentASINs = getASINs();

        for (const relatedProducts of currentASINs) {
            totalProducts++; // Increment for each product found
            for (const product of relatedProducts) {
                if (!foundRelatedProducts.has(product)) {
                    foundRelatedProducts.add(product);
                    console.log(`Logging related product: ${product}`);
                }
            }
        }

        console.log(`Final Related Products: ${Array.from(foundRelatedProducts).join(',')}`);
        console.log(`Total number of elements processed: ${totalProducts}`);
    }

    // Start the process of logging all related products
    try {
        await logAllRelatedProducts();
    } catch (error) {
        console.error('An error occurred:', error);
    }
})();


When the script is complete, click the copy button at the end of your list. If “Show More” is there, click that until you’re at the end of your list, and then click copy.

If the number of products isn’t high enough, you won’t have the “copy” option. You’ll just have to highlight the ideas and copy them manually.

Step 2: Check ID Code

Now, you are ready for the second step. Paste the copied list of product ASINs below, where it says PASTE IDS HERE. Make sure to leave the apostrophe before and after the IDs.

(async function() {
    // Paste your comma-separated list of IDs here as a single string
    const idString = 'PASTE IDS HERE'; // Example: Replace this with your actual IDs
    const idList = idString.split(','); // Convert the string into an array of IDs

    const inputSelector = '#request-card-search-input'; // The actual input field selector
    const successClass = 'ReactVirtualized__Grid__innerScrollContainer'; // Class that indicates successful result
    const successIDs = [];

    function setNativeValue(element, value) {
        const valueSetter = Object.getOwnPropertyDescriptor(element, 'value').set;
        const prototype = Object.getPrototypeOf(element);
        const prototypeValueSetter = Object.getOwnPropertyDescriptor(prototype, 'value').set;

        if (valueSetter && valueSetter !== prototypeValueSetter) {
            prototypeValueSetter.call(element, value);
        } else {
            valueSetter.call(element, value);
        }
    }

    async function simulateNativeInput(element, text) {
        // Focus the input field
        element.focus();

        // Set the value using the native value setter
        setNativeValue(element, text);

        // Dispatch all relevant events
        const events = ['input', 'change', 'focus', 'blur', 'keydown', 'keypress', 'keyup'];
        for (const eventType of events) {
            const event = new Event(eventType, { bubbles: true });
            element.dispatchEvent(event);
        }

        // Refocus the element to mimic user behavior
        element.blur();
        element.focus();
    }

    async function checkID(id) {
        const inputField = document.querySelector(inputSelector);

        if (!inputField) {
            console.error('Input field not found!');
            return;
        }

        // Simulate native input for the ID
        await simulateNativeInput(inputField, id);

        // Wait for 2 seconds to load new content
        await new Promise(resolve => setTimeout(resolve, 2000));

        // Check if the success class is present
        const successElement = document.querySelector(`.${successClass}`);
        if (successElement) {
            console.log(`Results found for ID: ${id}`);
            successIDs.push(id);
        } else {
            console.log(`No results found for ID: ${id}`);
        }
    }

    for (const id of idList) {
        await checkID(id);
    }

    console.log('Successful IDs:', successIDs.join(','));
})();

Open your Creator Connections and ensure you are on the available campaigns tab. Right-click on the page and select inspect again, just as we did before. Take your code with the inserted IDs and paste it into the second tab, which says Console.

If it’s working correctly, you should see each ID auto-populate in the text field one at a time. When the code is completed, you will see a list of any matching IDs in the side window at the end, just as you see in the video that I shared with you.