> For the complete documentation index, see [llms.txt](https://help.memberply.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.memberply.com/how-to-skyrocket-the-number-of-members-joining-your-membership/enable-cart-page-upsell.md).

# Enable cart page upsell

**Setup time is approximately 3 minutes**

VIP Checkout+ promotes your membership beneath the store's normal checkout button. It works in cart drawers and on full cart pages, making it the recommended cart upsell setup for most stores.

In Memberply, open **Cart Upsell** under **Grow** for the storefront preview, customer journey, prerequisites, setup checklist, and Shopify theme editor shortcut.

## Why it can increase membership sign-ups

VIP Checkout+ presents membership beside the final purchase decision. It highlights the savings and benefits shoppers can unlock, giving them a timely, concrete reason to join before checkout.

Before enabling VIP Checkout+, [select the membership tier used for upsells](/how-to-skyrocket-the-number-of-members-joining-your-membership/select-a-membership-tier-as-the-upsell-offer.md) and [create a member discount benefit](/how-to-skyrocket-the-number-of-members-joining-your-membership/create-a-member-discount-benefit.md). A clear member saving makes the membership checkout option more compelling than a generic invitation to join.

## How VIP Checkout+ turns shoppers into members

1. When the customer clicks **VIP Checkout+**, Memberply adds the selected membership tier to the existing cart and continues directly to Shopify checkout.
2. Shopify recalculates the order and automatically applies enabled member discounts to eligible products.
3. If free shipping is enabled and the order meets its conditions, it is applied when Shopify calculates shipping rates, normally at checkout.
4. Product and collection exclusions, minimum requirements, and other benefit conditions are respected. Memberply also prevents the same membership from being added twice.

### Conversion tip

You can [offer the first month free](/how-to-skyrocket-the-number-of-members-joining-your-membership/offer-a-free-first-month-optional.md) on an eligible monthly membership tier. The customer pays nothing for the membership today, receives its benefits immediately, and sees when the first renewal charge will occur. This reduces the initial commitment and gives them an extra reason to join.

<figure><img src="https://2037526248-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVJXUszoUtB7SAceDihaK%2Fuploads%2Fgit-blob-af3c42e782a74ea2749d794c54e311d2851458c6%2FVIPCheckoutHero.svg?alt=media" alt="Example of VIP Checkout Plus beneath the normal Shopify checkout button with membership benefits and pricing"><figcaption><p>VIP Checkout+ can appear in cart drawers and on full cart pages.</p></figcaption></figure>

## Recommended: Enable VIP Checkout+

1. Make sure an enabled membership tier is selected for storefront upsells.
2. In Memberply, open **Cart Upsell** under **Grow**.
3. Click **Open Shopify editor for VIP Checkout+**.
4. Shopify opens **App embeds** with **VIP Checkout+** ready to enable.
5. Enable **VIP Checkout+**.
6. Customize the button text, colours, benefit icons, benefit text, pricing presentation, and other styling settings. Membership pricing is loaded automatically from Memberply and cannot be entered manually here.
7. Click **Save**.
8. Test the cart drawer and full cart page before publishing.

The app embed automatically looks for checkout buttons in cart drawers and on full cart pages. If your cart drawer uses a different checkout structure, configure a custom placement below.

## Custom placement for cart drawers

Use **Placement selector** when automatic placement does not find your cart drawer's checkout button, or when you want to choose the position yourself. This works with matching elements in the page, without an app-specific integration.

1. Open **Online Store → Themes → Customize → App embeds → VIP Checkout+**. Make sure you are editing the theme you intend to publish and the embed is enabled.
2. Enter a CSS selector in **Placement selector**. For example, `.upcart-checkout-button-container` identifies the checkout container in the UpCart layout we tested. Cart app layouts can change, so check that this selector matches your store.
3. Choose **Position**: **Before**, **After**, or **Inside (at the end)**. For the example above, choose **Before**. Use Inside only with a container, not a checkout button or link.
4. Click **Save**. Add a regular product to your cart and open the drawer from a product page. Check the placement on desktop and mobile, then change quantities, remove items, and close and reopen the drawer.
5. Confirm the regular checkout still works. The offer requires an eligible upsell tier and is hidden when the cart contains a membership or the signed-in customer is already a member.

A custom selector **replaces automatic placement everywhere**. It places one offer at each matching element. To target both a drawer and a cart page, use specific selectors separated by a comma. Clear the field to restore automatic placement. If a selector is invalid or has no matching element, no custom offer is inserted; normal checkout remains available. Custom placement overrides the automatic Cart Page Upsell duplicate check, so avoid selecting the full cart page if it already has that block.

### Adjust the gap beside checkout

In **App embeds → VIP Checkout+**, use **Space above** and **Space below** under **Checkout button**. Both sliders support 0 to 60 pixels and adjust the space outside the membership offer.

* If VIP Checkout+ is **before** the normal checkout button, increase **Space below**. For the UpCart example above, start with **16 px**.
* If VIP Checkout+ is **after** the normal checkout button, increase **Space above**.
* With **Inside (at the end)**, the space applies within the selected container; check the result in your drawer.

Save, then check the drawer on desktop and mobile. Existing theme or cart-app spacing may also contribute to the visible gap. **Space below** starts at 0 px to preserve existing layouts.

### Find a placement selector

On a desktop browser, open the cart drawer, right-click near its checkout button and choose **Inspect**. Look for a stable class or ID on the container around the button. A class such as `cart-checkout-footer` becomes `.cart-checkout-footer`; an ID such as `drawer-checkout` becomes `#drawer-checkout`. Prefer meaningful names over generated identifiers or a long copied path. Avoid broad selectors such as `div`, `button`, or `a`, which can match unrelated elements. Ask your theme developer or Memberply support if you are unsure.

Memberply inserts the offer when the matching element appears and restores it when the drawer rebuilds its contents. If the cart app changes its markup, you may need to update the selector. Elements inside an iframe or shadow root cannot be targeted by this setting. Enabling the embed only on a draft theme does not enable it on the published storefront.

## Alternative: Use Cart Page Upsell on the full cart page

Use the manually placed **Cart Page Upsell** block when you want a larger promotional membership card on the full cart page. This block does not appear in cart drawers, so VIP Checkout+ remains the recommended setup for broader cart coverage.

1. In the Shopify theme editor, open the cart template.
2. Near the checkout button, click **Add section**, select **Apps**, and add **Cart Page Upsell**.
3. Move the block to the required position and configure its content and styling.
4. Click **Save**.
5. Check the full cart page on your storefront before publishing.

You can enable this block together with VIP Checkout+ when you want the larger Cart Page Upsell card on the full cart page and VIP Checkout+ in the cart drawer. Memberply prevents VIP Checkout+ from displaying as a second membership offer on the full cart page.

## Sign-in and purchase errors

If the membership has a rejoin waiting period, customers must sign in so Memberply can check whether they are eligible to join. When a signed-out customer tries to add the membership, the upsell explains the requirement and opens Shopify sign-in. After signing in, they return to the storefront and can select the membership offer again. This also applies to VIP Checkout+.

If Shopify rejects the purchase for another reason, such as a rejoin waiting period that has not ended or an unavailable product, the upsell displays that explanation. A temporary connection or server problem displays your configured fallback error message.

## Temporary pricing interruptions

The manually placed Cart Page Upsell block automatically retries once if the pricing service reports that it is temporarily unavailable. The membership offer appears if that retry succeeds. If pricing remains unavailable, the offer is hidden; shoppers can still use the store's normal purchase flow. Reload the page to try again after the service recovers.