Skip to main content

What are Extensions?

Shopify extensions allow you to customize checkout, admin, and point-of-sale experiences with React components.

Extension Types

Checkout Extensions

Add custom UI to the checkout process

Admin Extensions

Extend the Shopify admin interface

POS Extensions

Customize point-of-sale experiences

Post-Purchase

Upsells after checkout completion

Example: Checkout Extension

import { Banner, useSettings } from '@shopify/ui-extensions-react/checkout';

export default function CheckoutExtension() {
  const settings = useSettings();
  
  return (
    <Banner title="Free Shipping">
      Orders over $50 ship free!
    </Banner>
  );
}

Key Features

  • React Components: Build with familiar React patterns
  • Shopify UI: Use official Shopify UI component library
  • GraphQL: Query cart and customer data
  • Settings: Configure extensions via metafields