Designing Landing Pages
The landing page editor uses the visual builder (Puck) to give you a drag-and-drop design experience.
Opening the editor
Section titled “Opening the editor”Go to Landing Pages and click Design on any page. The builder opens full-screen.
Building your page
Section titled “Building your page”The editor has three panels:
- Left sidebar: Component library. Drag components onto the canvas.
- Center canvas: Your page layout. Click components to select them, drag to reorder.
- Right panel: Properties for the selected component. Edit text, colors, images, links, and spacing.
Key components
Section titled “Key components”Landing pages typically include:
- Hero section: A large heading, subtitle, and app icon or screenshot.
- Download buttons: Links to the App Store and Play Store. These are pre-configured from your Appspace settings.
- Feature highlights: A few bullet points or icons showing what the app does.
- Web fallback button: An optional link for users who prefer not to install (e.g. “Continue on Web”).
- Images: Screenshots, product photos, or illustrations from your media library.
Button URLs
Section titled “Button URLs”Buttons can point anywhere. Two things happen to the URL you enter before the page is served:
The {token} placeholder is replaced. On a dynamic route, a button pointing at https://shop.example.com/p/{token} becomes https://shop.example.com/p/sku-123 when the link is clicked as /product/sku-123. This is the same placeholder the API endpoint and web fallback URL use. At the root of a dynamic route, where there is no token, the placeholder is removed instead: the same button resolves to https://shop.example.com/p. On static routes there is never a token, so the placeholder is left as-is to make the misconfiguration visible.
Query parameters are forwarded, if the route allows it. When the route has Forward query params enabled, parameters from the clicked link are appended to your button URLs. Parameters already in the button URL are kept as you set them.
Store buttons are not affected by either. They always point at your App Store and Play Store URLs.
Templates
Section titled “Templates”When creating a new landing page, you can choose from built-in templates:
- Classic (App Download): App icon, headline, description, and store buttons. Clean and proven.
- Hero Image (App Download): Large hero image at the top with app icon, text, and store badges below.
- Bold CTA (App Download): Prominent deep link button with store badges as fallback. Conversion-focused.
- Product Showcase (Product/Content): Dynamic product image and name from API data, with a deep link button.
- Event / Listing (Product/Content): Dynamic event image, title, date, and location with a CTA to open in-app.
Templates provide a starting point. You can customize every element after selecting one.
Preview
Section titled “Preview”Click the Preview button to see your page as users will see it. Toggle between desktop and mobile viewport sizes. The preview renders the actual HTML that will be served to visitors.
Saving
Section titled “Saving”Click Save to persist your changes. The page content is stored as structured data, not as raw HTML, so you can reopen and edit it at any time.
Changes to the landing page take effect immediately for new visitors. Users who already have the page loaded will see the old version until they refresh.