Partner Apps

Simple Component to display parnter apps or more of your own apps

Install the component with CLI

Run this command in your terminal and the component will be created automatically:

npx polarisui-cli add partnerapps

Install the component manually

Create a new folder in /app/ called components/. There create a new file and copy the code below into the component.

1import {
2  Layout,
3  Text,
4  Card,
5  Button,
6  BlockStack,
7  InlineStack,
8  Thumbnail,
9  Divider,
10} from "@shopify/polaris";
11
12const partnerApps = [
13  {
14    name: "Replo Landing-Page Builder",
15    description: "No-Code easy to use Page Builder for Shopify to boost your conversion rate.",
16    url: "https://apps.shopify.com/alchemy",
17    logo: "/replo-logo.webp",
18  },
19  {
20    name: "Loox Reviews",

Usage

To use this component in your app, simply import it and render it anywhere in your code:

1import { PartnerApps } from "../components/partnerapps";

1<PartnerApps />

By default, all PolarisUI components are wrapped in a <Layout.Section>.
This means they render full width within the page layout, following Polaris defaults.

If you want the component to only take half width or be placed differently (eg. in a Indextable):

Remove the <Layout.Section> wrapper → the component will no longer span the entire width.
Wrap it in a Card (or any Polaris container) instead to control the sizing.

Customization

Just extend the partnerApps array with a new object in the same style as the current.

The component is not limited to partner apps. You can also add your own apps to the same array to promote them in the exact same UI.

Get Started

Components

Blocks

Partner Apps

Built by:

Noahbuiltsapps

Last updated:

Sep 18, 2025