Add Checkout Extension

[Yodit]

Hi, 

I want to add an extension in my checkout, but i only can add it on one page (in this case only in the information page). I tried to add in an another page (in this case on the shipping page), but that doesn't work. How can i solve this issue?

Regards, 

Yodit

[Liam]

Yodit,

The ability to add extensions to different pages of the checkout process depends on the extension point you're using. Each extension point determines where in the checkout flow the extension can be added.

If you want to add an extension to the shipping page, you should use the Checkout::ShippingMethods::RenderAfter extension point. This renders the extension after the shipping methods section on the shipping page of the checkout.

Below is a simple example of how to set the extension point:

import { render } from "@shopify/checkout-ui-extensions-react";

// Set entry point for the extension
render("Checkout::ShippingMethods::RenderAfter", () => <YourExtensionComponent />);

Just replace YourExtensionComponent with your actual React component.

After you've set this up, you should be able to add the extension to the shipping page through the Shopify admin by clicking on Settings > Checkout and accounts > Customize, navigating to the shipping step, and adding your extension.

Hope this helps!