--- title: Add Reactiv's Header Banner to your Shopify Store description: Learn how to add Reactiv’s header banner to your Shopify store to promote app downloads and drive installs. --- [Skip to content](https://info.reactiv.ai/reactiv-help-center/add-reactivs-header-banner-to-your-shopify-store-reactiv-support-center#main-content) ![logo-mono-light](https://info.reactiv.ai/hubfs/logo-mono-light.svg) Open main navigation Close main navigation - [Contact us](https://info.reactiv.ai/reactiv-help-center/how-do-i-contact-customer-support-reactiv-support-center) [Contact us](https://info.reactiv.ai/reactiv-help-center/how-do-i-contact-customer-support-reactiv-support-center?hsLang=en-ca) Answers, documented. - There are no suggestions because the search field is empty. 1. [Reactiv Help Center](https://info.reactiv.ai/reactiv-help-center?hsLang=en-ca) 2. [Building Your Reactiv Clips](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca) 3. [Initializing Your Reactiv Clips](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#initializing-your-reactiv-clips) February 19, 2026 # Add Reactiv's Header Banner to your Shopify Store ## Highlight your mobile app on your Shopify storefront using Reactiv’s Header Banner. ![](https://info.reactiv.ai/hs-fs/hubfs/Knowledge%20Base%20Import/Screenshot_2025-10-07_at_12.09.53%E2%80%AFPM-1759857005-Feb-13-2026-07-13-27-5798-PM.png?width=40&height=40&name=Screenshot_2025-10-07_at_12.09.53%E2%80%AFPM-1759857005-Feb-13-2026-07-13-27-5798-PM.png) Written by Reactiv App ### **How to Enable the Header Banner in Your Shopify Theme** 1. Log in to your **Shopify admin.** 2. In the left sidebar, click the **Sales channels** and search for **Online Store**. 3. **Online Store** will appear in the left bar, then select **Themes** right under. 4. In the main window, under your current theme, click the **Customize** button. 5. In the theme editor, click **Apps** -\> **Add Block** -\> **Reactiv Header Banner** 6. Use the search bar or scroll to find **Reactiv Header Banner**. 7. Toggle the switch to **enable** the banner. [![](https://info.reactiv.ai/hubfs/Knowledge%20Base%20Import/Screenshot+2025-06-03+at+1_48_36%E2%80%AFPM-1.png)](https://downloads.intercomcdn.com/i/o/zgqq9fe6/1554198101/20f9d8ea77938d7470ab4dbff3aa/Screenshot+2025-06-03+at+1_48_36%E2%80%AFPM.png?expires=1771011900&signature=351bcc539b44ae1d763721cf422e0af39f7da0315c47230be7bf59f978754d06&req=dSUiEsh3lYBfWPMW1HO4zeCQAXhU0xoHSmddfywttmBgt9f4uAm3vv8mXBiz%0At0pJRGEE9H3EehxbMH4%3D%0A) [![](https://info.reactiv.ai/hubfs/Knowledge%20Base%20Import/Screenshot+2025-06-03+at+2_03_24%E2%80%AFPM-1.png)](https://downloads.intercomcdn.com/i/o/zgqq9fe6/1554198414/190231da5cbad30516b01dba457b/Screenshot+2025-06-03+at+2_03_24%E2%80%AFPM.png?expires=1771011900&signature=98a355dc4fd096230d345c51de011f0756d40a7e93a4dc9dca03373858ab6567&req=dSUiEsh3lYVeXfMW1HO4zXHwvje%2Bm9ode%2FRVCmcY%2F4RIE4xL5MSUgIi1%2Bjlr%0Au7YSki4QV7im7YmMGEg%3D%0A) [![](https://info.reactiv.ai/hubfs/Knowledge%20Base%20Import/Screenshot+2025-06-03+at+2_06_26%E2%80%AFPM-1.png)](https://downloads.intercomcdn.com/i/o/zgqq9fe6/1554198928/77edcf67865e258848bb01eb6156/Screenshot+2025-06-03+at+2_06_26%E2%80%AFPM.png?expires=1771011900&signature=199cb8f5a66c8e2672ec148dcf44bb176e0afd2bac09932cfe088c8582a6fed5&req=dSUiEsh3lYhdUfMW1HO4zemj2Qy5lhzY60jgC3fqmks3JhtdGmQgNO4JaCXv%0A6IlHPblNxUEc%2BD2N8FE%3D%0A) --- ### **Customize the App Promo Content** After enabling, you’ll see customizable fields in the App embed panel: ### **App Content** - **Background Image** – Select or upload an eye-catching image to help promote your app. You can also explore free images directly from the panel. - **App Description** – Add a short promo message that highlights the value of your mobile app. - **Clip Description** – Write a message specifically for your iOS App Clip (e.g., a quick value proposition or call-to-action). - **Text Color** – Customize the text color used in your banner. - **Text Placement** – Choose whether your message appears **centered** or at the **bottom** of the banner. ### **App Links** - **App Clip Link** – Paste your iOS App Clip URL. - **iOS App Store Link** – Enter the direct link to your app on the iOS App Store. - **Android Play Store Link** – Enter the direct link to your app on the Google Play Store. ### **Display Settings** - **Show on Home Page** – Toggle this on to display the banner on your store’s homepage. - **Show on Collection Pages** – Enable this to display the banner on collection pages. Use the **Choose Collections** button to select which collections to target. - **Show on Product Pages** – Turn this on to show the banner on specific product pages. Use the **Choose Products** button to select products. ### **Button Customization** - **Font Family** – Select a font for your banner text (e.g., *Montserrat*). - **Open Clip Button Label** – Customize the label for the App Clip button (e.g., “Shop now”). - **Open Clip Button Background Color** – Set the background color of the App Clip button. - **Open Clip Button Text Color** – Choose the text color for the App Clip button. - **Open in Browser Button Label** – Customize the label for the fallback browser button (e.g., “Continue in browser”). - **Open in Browser Button Background Color** – Set the background color of the browser button. - **Open in Browser Button Text Color** – Choose the text color for the browser button. ### **Advanced Settings** - **Custom CSS** – Use this field to add optional CSS overrides for more control over appearance. - **App UUID / Store UUID** – Use this field to increase the accuracy of tracking and reporting your banners. This information can be found in the Reactiv dashboard under App Details. ### **Tips** - Use vibrant images and short, compelling text to capture attention. - The App Promo banner is a powerful tool to drive app installs from mobile web visitors. - Don’t forget to **publish your theme changes** when you’re ready to go live! 💡 Need Help? We’re here for you! Visit [www.reactivapp.com](https://www.reactivapp.com/) or reach out to our support team anytime for tips, troubleshooting, or personalized guidance. - [Getting Started With Reactiv](https://info.reactiv.ai/reactiv-help-center/getting-started-with-reactiv?hsLang=en-ca) - [Building Your App](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#main-content) - [App Settings](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#app-settings) - [Your Home Screen](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#your-home-screen) - [Misc. App Building Blocks](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#misc-app-building-blocks) - [Other Screens](https://info.reactiv.ai/reactiv-help-center/building-your-app?hsLang=en-ca#other-screens) - [Publishing Your App](https://info.reactiv.ai/reactiv-help-center/publishing-your-app?hsLang=en-ca#main-content) - [iOS App](https://info.reactiv.ai/reactiv-help-center/publishing-your-app?hsLang=en-ca#ios-app) - [Building Your Reactiv Clips](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#main-content) - [Success with Reactiv Clips](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#success-with-reactiv-clips) - [Customizing Your Reactiv Clips Experiences](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#customizing-your-reactiv-clips-experiences) - [Initializing Your Reactiv Clips](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#initializing-your-reactiv-clips) - [About Reactiv Clips](https://info.reactiv.ai/reactiv-help-center/building-your-reactiv-clips?hsLang=en-ca#about-reactiv-clips) - [Integrations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#main-content) - [Analytics & Push Notifications](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#analytics-push-notifications) - [App Install Attribution](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#app-install-attribution) - [Back in Stock Alerts](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#back-in-stock-alerts) - [Chat & Customer Support](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#chat-customer-support) - [Conversion Integrations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#conversion-integrations) - [Discovery, Search & Personalization](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#discovery-search-personalization) - [Fraud Protection](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#fraud-protection) - [Loyalty](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#loyalty) - [Order Fulfillment](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#order-fulfillment) - [Product Recommendations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#product-recommendations) - [Order Tracking & Returns](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#order-tracking-returns) - [Product Bundles](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#product-bundles) - [Reviews Integrations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#reviews-integrations) - [Subscriptions](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#subscriptions) - [Video Shopping](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#video-shopping) - [Wishlist Integrations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#wishlist-integrations) - [Profile Integrations](https://info.reactiv.ai/reactiv-help-center/integrations?hsLang=en-ca#profile-integrations) - [Platform Highlights](https://info.reactiv.ai/reactiv-help-center/platform-highlights?hsLang=en-ca) - [Success with Reactiv](https://info.reactiv.ai/reactiv-help-center/success-with-reactiv?hsLang=en-ca#main-content) - [Sending Push Notifications](https://info.reactiv.ai/reactiv-help-center/success-with-reactiv?hsLang=en-ca#sending-push-notifications) - [Building with AI](https://info.reactiv.ai/reactiv-help-center/building-with-ai?hsLang=en-ca) - [FAQ](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#main-content) - [Performance & Data](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#performance-data) - [General & Billing](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#general-billing) - [Getting Started](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#getting-started) - [Technical Issues & Troubleshooting](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#technical-issues-troubleshooting) - [App Management](https://info.reactiv.ai/reactiv-help-center/faq?hsLang=en-ca#app-management) - [Research](https://info.reactiv.ai/reactiv-help-center/research?hsLang=en-ca) [![logo-mono-dark](https://info.reactiv.ai/hubfs/logo-mono-dark.svg "logo-mono-dark")](http://reactiv.ai) Copyright © 2026, Reactiv