Campaigns Question - How do I add two items to express checkout button

[motion2024]

Campaigns Question - How do I add two items to express checkout button.

So I see you can add express checkout buttons, in campaigns. I'd like it to add two items to the button.

Or add them in conjunction with the button.

Is this something you can do?

As it would increase sell through substantially as we all inherently want to do things efficiently for our customers.

[DaisyVo]

Hi @motion2024 

I see what you’re trying to achieve—you want customers to be able to add two specific items to their cart and then go straight to checkout using an express checkout button. This makes total sense because streamlining the checkout process can boost conversions and encourage higher order values.

The Short Answer:

Shopify’s default express checkout buttons (like Shop Pay, PayPal, Apple Pay, and Google Pay) don’t allow you to add multiple products directly. These buttons pull checkout details from the current cart, so they only work with what’s already there. However, you can work around this by tweaking the cart behavior or using a custom checkout link.

Solution 1: Use a Custom Checkout Link (Best No-Code Solution)

One of the easiest ways to get two items into the checkout is by creating a checkout link with pre-added products and placing that link behind a button. Here’s how:

1-Find Your Product Variants' IDs – Go to your Shopify Admin > Products > Select the products > Scroll down to the "Variants" section > Copy the variant ID from the URL.

Build a Checkout URL – Use this format:

https://yourstore.com/cart/productID1:1,productID2:1

Example:

https://mystore.com/cart/123456789:1,987654321:1

• Replace yourstore.com with your actual store’s domain.
• Replace productID1 and productID2 with the real variant IDs.
• The :1 means a quantity of 1 for each product.

2-Link This URL to a Button – Add this link to any campaign buttons, emails, or landing pages.

This method lets customers click once and go straight to checkout with both products pre-added.

Solution 2: Add Items Automatically When Clicking Express Checkout (Requires Custom Code)

If you want the Express Checkout button (Shop Pay, PayPal, etc.) to automatically include two specific products, you’ll need some custom Liquid and JavaScript.

1-Edit the "cart.liquid" or "theme.js" file in your theme.

Add this script before the express checkout button:

document.addEventListener("DOMContentLoaded", function() {

    let checkoutButton = document.querySelector('.shopify-payment-button button');

    if (checkoutButton) {

        checkoutButton.addEventListener("click", function(event) {

            event.preventDefault(); 

            fetch('/cart/add.js', {

                method: 'POST',

                headers: { 'Content-Type': 'application/json' },

                body: JSON.stringify({ quantity: 1, id: 123456789 }) // Replace with first product ID

            }).then(() => {

                return fetch('/cart/add.js', {

                    method: 'POST',

                    headers: { 'Content-Type': 'application/json' },

                    body: JSON.stringify({ quantity: 1, id: 987654321 }) // Replace with second product ID

                });

            }).then(() => {

                window.location.href = "/checkout";

            });

        });

    }

});

2-

• Replace the product IDs in id: 123456789 with your actual variant IDs.
• This ensures when customers click the Express Checkout button, both items get added before redirecting to checkout.

Which Solution Should You Use?

• If you don’t want to mess with code, the checkout link method is simple and effective.
• If you need it fully automated on the express checkout button, the custom script will work but requires some coding knowledge.

Let me know if you need more help setting this up!

Best regards,
Daisy