Add campaign banners to your subscriber portal
Campaign banners let you show merchandising messages — sales, referrals, product launches, gift cards — at the top of your subscriber portal. The same banners render on both the Subi-hosted portal and the Shopify Customer Account Extension, so every subscriber sees them whichever entry point they use.
What you can add
Image banner — a single image that fills the banner area, optionally clickable. Best for visual campaigns where the artwork tells the whole story.
Text & image banner — a card with a heading, body, an optional call-to-action button, and an optional thumbnail. Best when copy leads and the image supports.
Step 1 — Open your customer portal customization
From the Subi admin, go to Customer portal management → click Customize portal.
Step 2 — Expand the Header section
The customization toolbar is on the left. Click Header to expand it. Banners live inside this section because they appear at the top of the page, above the greeting.
Step 3 — Click "Add section"
At the bottom of the Header section, click the blue ⊕ Add section link. A small dropdown appears with two options.
Step 4 — Pick a banner type and fill in the fields
Click Image banner or Text & image. A new banner row appears, expanded with an empty form.
For an image banner you'll need:
Desktop image — recommended size 1020 × 280 px (3.6:1 aspect). JPG, PNG, GIF, or WebP. Maximum 2 MB.
Mobile image (optional) — recommended 640 × 320 px (2:1). If left empty, the desktop image is used on all devices.
Link (optional) — where customers go when they click the banner. Must start with http:// or https://.
Alt text — what screen readers announce, and what shows if the image fails to load. Keep it short and descriptive.
For a text & image banner you'll need:
Heading (max 60 characters) — the bold first line.
Body (max 240 characters) — the description below the heading.
Button label (max 24 characters) and Button link — these appear together. If you set a label, the link is required.
Thumbnail image (optional) — a small square image alongside the text.
Step 5 — See it in the live preview
The right-hand pane shows what subscribers will see, updated in real time as you type or upload. Drag the grip handle on the left of any banner row to reorder. Click the trash icon to delete a banner.
Step 6 — Save
When you're happy, click Save at the top of the modal. The Save bar appears whenever you have unsaved changes. Click Discard to throw away all changes since you last saved.
Different banners for Home vs Subscription Details
Use the page selector at the top of the customization modal to switch between the Home page (the subscription list) and the Subscription Details page. Each page has its own independent set of banners — adding a banner on Home does not add it on Subscription Details. Save once on each page you want banners on.
What customers see
Banners appear above the greeting on the Subi-hosted portal:
And the same banners appear in the Shopify Customer Account Extension:
On mobile, banners scale to the device width:
Plan limits
Plan | Banners per page |
Free | 2 |
Starter | 5 |
Business and above | Unlimited |
If you reach your plan's cap, the Add section button is disabled with a tooltip explaining why and a link to manage your plan.
What happens if I downgrade?
You don't lose any banners — they stay configured and editable. Banners beyond your new cap are flagged with a "Hidden on your current plan" badge and aren't shown to subscribers. An info banner at the top of the Header section reminds you which banners are hidden and links you to plan management.
Tips
Optimize your image dimensions. The Customer Account Extension renders banners at a fixed 3.64:1 aspect ratio and crops to fit. If you upload a square or tall image, parts will be cut off. The recommended 1020 × 280 px (desktop) and 640 × 320 px (mobile) match the design intent everywhere.
Use alt text. Even if your banner is purely decorative, alt text helps subscribers using screen readers.
Keep button labels short. "Shop the sale" beats "Click here to shop our spring sale." The 24-character cap is intentional.
Test the link. The portal banner link opens in a new tab so subscribers don't lose their session.
Troubleshooting
I uploaded an image but the file isn't getting accepted
Check the file format (JPG, PNG, GIF, or WebP only) and the file size (≤ 2 MB). The form will show an inline error explaining which check failed.
I saved but customers aren't seeing the banner
Verify you saved on the right page (Home vs Subscription Details — they're separate). If the Save button never lit up, your changes weren't dirty — try editing a field and re-saving.
The banner image looks too tall in the Customer Account Extension
The extension enforces a 3.64:1 aspect ratio for visual consistency. Upload at 1020 × 280 px (or any 3.64:1 ratio) and the entire image will be visible. Square or portrait images get cropped.