A landing page is a sign-up form that Attentive hosts at its own URL on your behalf. It lets you collect email and SMS subscribers outside of your main website, for example from social media, emails, QR codes on printed materials, or a page embedded on your site. This article covers how to create, design, activate and share a landing page in the legacy sign-up unit designer.
Which designer am I using? This article covers the legacy designer, which lists Brand styles and Page styles sections in the left panel. If your designer shows a Layers panel in the upper left instead, see Create a landing page (standard).
What is it?
A landing page is a fixed sign-up form that stays live at an Attentive-hosted URL. Unlike a pop-up sign-up unit, it doesn't depend on display rules or visitor behavior on your site. Anyone who opens the link sees the form.
- Channels: A landing page includes separate Email and SMS pages by default. You can remove either one to collect for a single channel.
- Collection order: Landing pages ask for an email address first, then a phone number.
- Responsive design: Attentive adjusts the layout for mobile and desktop automatically. You can also set different images, colors and buttons for each device type.
- Where it lives: You can share the hosted URL directly, or embed the landing page on a page of your own site with an iframe.
How do I use it?
Before you begin
- Set up your Brand Kit. Templates and the designer use its logo, fonts and colors by default.
- Check Specifications for sign-up units for landing page image sizes:
- Full background: 1082 × 768 px.
- Split screen background: 541 × 768 px.
Step 1: Create your landing page
- On the Sign-up Units tab, click + Create sign-up flow.
- In the Create sign-up flow popup, choose how to start:
- To start from a template (recommended): Click Choose template > Continue. On the Convert link visitors - Landing page tile, click Start with template. Templates come with your Brand Kit styles, an offer and a welcome message already set up.
- To build from scratch: Click Build custom > Continue. In Name your sign-up flow, enter an internal name. Below Templates, select Landing Page, then click Create.
The landing page editor appears.
Step 2: Add an offer and welcome journeys
- (Optional) Select an offer from the drop-down. Subscribers receive it in their welcome journey.
- Below SMS Welcome Journey, select the welcome journey that SMS subscribers from this landing page enter.
- If you use Attentive Email: below Email Welcome Journey, select the email welcome journey that email subscribers enter.
Step 3: Design your landing page
- Hover over the preview and click Edit Design.
- At the top of the preview, click a tag to edit that page:
- Email: The email opt-in screens.
- SMS: The SMS opt-in screens.
- Success: The screen shown after someone subscribes.
- To collect for one channel only, click the X on the channel you don't want. Click + to add it back.
- Style each page. For headlines, legal disclosure, the email and phone fields, buttons and colors, see Guide: How to design a sign-up unit (legacy).
- (Optional) Add interactive elements: a pre-engagement page, Spin to Win or a countdown timer. See Choose design options for sign-up units (legacy).
- Set the fields that exist only on landing pages:
- Mobile styling: Set a different design for the mobile version.
- Internet browser tab title: The text shown in the visitor's browser tab.
- Landing page URL: A unique page name used in the landing page's URL.
- Use the Desktop / Mobile toggle at the bottom of the preview to check both layouts.
- Click Save changes.
If a design field is outlined in red, your design may raise an accessibility concern. See Override an issue with accessibility.
Step 4: Activate your landing page
- Click Schedule and activate.
- On the Ready to activate? page, check your landing page's URL
- Copy the LANDING PAGE URL. You need it to share or embed the page.
- Click Activate sign-up unit, then click Activate to confirm.
To find the URL later, click the three dots next to the Landing Page on the Sign-up units page and then click Landing page URL. You can also find it within the landing page settings in the editor.
Step 5: Share or embed your landing page
You can share the landing page in any of these ways:
- Share the link: Add the landing page URL to emails, social media bios and posts, ads or link-in-bio tools.
- Use a QR code: Create a QR code from the landing page URL and add it to flyers, packaging, in-store signs or printed ads.
- Embed it on your site: Follow the steps below.
Embed your landing page on your site
Embed your landing page on a page of your own website with an iframe, so visitors sign up without being sent to a different URL.
- Create a dedicated page on your site.
- Add this iframe to the page. Replace LANDING_PAGE_LINK with your landing page URL from step 4.
<iframe src="LANDING_PAGE_LINK" style="min-height: 800px;" width="100%" height="100%"></iframe>
- Adjust width, height and min-height so the whole form shows without a scrollbar inside the iframe. Check the page on both mobile and desktop.
- Publish the page.
How you add custom HTML depends on your site platform. See your platform's documentation for adding an HTML or custom code block.
Next steps
- Customize the message existing subscribers see when they submit their information again. Existing subscribers are more likely to reach a landing page than a pop-up sign-up unit.
- Assign a custom attribute to identify subscribers from this landing page. You can then target them in campaigns or trigger a joined-a-segment journey.
- Track performance from the Sign-up Units page.
Why should I use it?
- Collect subscribers where your site can't reach: Social media, emails, print and in-person events.
- Grow email, SMS or both from one link.
- Turn email subscribers into SMS subscribers: Send your landing page link to your email list.
- Keep a sign-up option that's always on in any marketing channel, including printed materials through a QR code.
- Reward sign-ups with an offer delivered through your welcome journey.