Skip to main content

Setting Up and Customizing Landing Pages

How to setup and use Landing Pages on your Mobile App

R
Written by Reactiv App
Updated over 2 weeks ago

In this guide, you’ll learn how to create and customize Landing Pages in your Reactiv mobile app or Reactiv Clip. Landing Pages are focused, high-conversion screens designed to engage shoppers from a specific source—like ads, emails, or social media—and guide them toward a single goal, such as making a purchase or exploring a collection.

What Is a Landing Page?

A Landing Page is a campaign-specific screen in your app that allows you to:

  • Promote sales, launches, or limited-time collections

  • Drive traffic from social media, email, or ads

  • Showcase curated product content

  • Tell your brand story using visuals and copy

You can create multiple Landing Pages and assign each a unique deep link URL to support different marketing campaigns.

How to Create a Landing Page

  1. Open the Reactiv App Studio after logging in to your Shopify admin.
    Go to the Reactiv App Studio from your Shopify admin.

  2. Select the Landing Page Screen
    In the screen dropdown at the top of the Studio, choose Landing Page. This opens the layout canvas for editing.

  3. Add Sections
    Use drag-and-drop sections to build your page. Most sections can be added multiple times—except the Hero Carousel, which is fixed and always located at the top when enabled.


Landing Page Sections Overview

📸 Hero Carousel (Fixed Section)

The Hero Carousel is always pinned to the top of the Landing Page and cannot be moved or duplicated. You can enable or disable this section from the page settings, but its position is fixed.

To set up the Hero Carousel:

  1. Click on the Hero Carousel section to open the settings panel.

  2. Use the + Add hero button to upload image banners or lifestyle shots.

  3. For each slide, you can:

    • Upload an image

    • Add a Title and Description (optional)

    • Include a CTA button with link destination (e.g., to a product, collection, or another screen in your app)

    • Upload media like videos or gifs.

📝 Tip: Use bold visuals and keep text short for maximum impact on mobile.

✨ Story Blocks (New)

Use these sections to tell your brand’s story, promote a theme, or highlight a limited-time offer.

To add and set up a Story Block:

  1. Drag the Story Block into the studio.

  2. Fill out the fields:

    • Title – A short headline to grab attention

    • Header – A subheading or supporting line

    • Description – Use this space to explain more about the promotion or story

    • Image Asset – Upload an image to visually support the content

You can add as many Story Blocks as you'd like.

🛍 Featured Products

This section lets you showcase a curated list of products to drive conversions.

To set up Featured Products:

  1. Drag in the Featured Products section into the studio.

  2. In the settings panel, click + Add Collection.

  3. Search for and select the Shopify collections you want to feature. You can select multiples at once.

  4. Customize the section:

    • Heading – Add a heading (e.g., “Shop the Look” or “Best Sellers”)

    • Choose a Layout style between grid and slider.

    • You can update the Image shape and orientation: landscape, portrait, and square.

    • Choose an Image display style between fill and fit.

    • And update the maximum number of products to display.

    • You can add background gradients to further customize your branding.

Tip: Choose products that match the theme of the landing page to keep things cohesive.

📝 Text Area (New)

Use Text Areas to highlight exclusive benefits, shipping perks, or customer trust badges.

To set up a Text Area:

  1. Drag in the Text Area section.

  2. Enter:

    • Section Title – A bold line to introduce the message (e.g., “Why Shop With Us?”)

    • Body Text – Write your message using the built-in text editor. You can use bold, italic, bullets, or links to format the content.

Common use cases include:

  • “Fast + Free Shipping”

  • “Buy Now, Pay Later”

  • “100% Satisfaction Guaranteed”

Tip: This is a great area for a testimonial about your brand or promotion.

📧 Newsletter Signup (New)

The Newsletter Signup section helps you capture shopper email addresses and grow your marketing list. It serves a dual purpose:

  • If the shopper is not logged in or does not have an account – The section prompts them to create an account, log in, and opt-in for marketing emails.

  • If the shopper is logged in but not subscribed to marketing emails – The section allows them to subscribe directly.

To set up Newsletter Signup:

  1. Enable Email Capture

    • In the Reactiv admin, navigate to Email Capture from the left-hand navigation menu.

    • Toggle the feature On.

    • Once enabled, the Newsletter Signup section will be available for use in your app screens.

  2. Add the Newsletter Signup Section

    • In the Reactiv App Studio, drag the Newsletter Signup section into the canvas of your Landing Page.

  3. Customize the Section

    • Heading – The main title of the section (e.g., “Stay in the Loop”)

    • Description – Supporting text to encourage signups (e.g., “Be the first to know about new arrivals and special offers.”)

    • Button Text – Call-to-action text for the signup button (e.g., “Subscribe Now”)

    • Footer Text – Additional note or disclaimer (e.g., “You can unsubscribe at any time.”)

    • Text Alignment – Choose how the text is aligned (left, center, or right) within the section

📝 Tip: Use inviting, benefit-focused language to increase signups.


Landing Page Settings

From the Settings tab for this screen, you can:

  • Add a URL Slug
    Create a deep link that leads directly to this Landing Page (e.g., yourstore.app.link/spring-sale). This is useful when linking from an ad, email, or Instagram bio.

  • Enable/Disable the Hero Carousel
    If you prefer a cleaner layout, you can toggle the Hero Carousel section off.


Managing Multiple Landing Pages

You can build and save multiple Landing Pages in Reactiv—each with its own layout, content, and deep link. This allows you to:

  • Run simultaneous campaigns

  • Tailor messaging for different audiences

  • A/B test page layouts or offers


⭐️ Best Practices for Landing Pages

  • Keep it focused: Limit each page to one core goal (e.g., product launch or sale).

  • Use strong visuals: Story Blocks and Hero Carousel images should be high quality and mobile-friendly.

  • Drive action: Place CTAs and Featured Products where shoppers can easily engage.

  • Match the message: Align content and visuals with your ad or email campaign to improve conversion.

📝 All done: You can save and publish your changes now.

Did this answer your question?