Design a desktop signup form in Klaviyo

Max Sturtevant·Dec 2024

Demo summary

Demonstrates how to clone a mobile form for desktop use, adjust image placement (Right image vs. Left image), and hide the close button to force user decision-making.

Step-by-step

Clone an existing mobile form and rename it for desktop
Go to Targeting and Behavior and select Display on desktop only
Upload a main image for the form
Adjust the form width and height under Styles to custom dimensions (e.g., 1000x600)
Set the close button (X) and its background color to clear to hide it
Add a micro-commit step if desired by inserting a new step and deleting the initial email field
Compress your image using a tool like iloveimg.com before uploading

Options

Choose between Popup, Full Page, or Flyout formats
Toggle image placement between Right image, Left image, or No image
Add a micro-commit step to ask a yes/no question before the email field

Watch out for

Large full-page popups convert better but can negatively impact customer experience by being too bombarding
Changing certain layout settings may occasionally reset your custom formatting dimensions

Tips

Hiding the close button (X) improves conversions by forcing users to make a decision
Right-side image placement typically works best based on testing
Compress images so they don't slow down the form's load time
Use a custom size like 1000x600 for a cleaner desktop layout

Highlights

“it is as simple as it gets”

All demos from “Ecommerce Email Marketing 2025 Free Course (8+ Hours) | Klaviyo & Shopify”

52:2918:01Build a mobile opt-in popup in KlaviyoA step-by-step walkthrough of creating a mobile-only signup form in Klaviyo, including editing blocks, setting up multi-step email/SMS capture, and configuring targeting behaviors like time delay.Klaviyo· Add an opt-in popup
1:10:304:42Design a desktop signup form in KlaviyoCurrentDemonstrates how to clone a mobile form for desktop use, adjust image placement (Right image vs. Left image), and hide the close button to force user decision-making.Klaviyo· Add an opt-in popup
3:36:500:47Set up A/B tests in Klaviyo flowsDemonstrates the 'conditional split' method for A/B testing flow emails to compare performance metrics directly in the flow builder.Klaviyo· A/B test a campaign
6:56:045:55Upload custom Figma designs to KlaviyoWalks through slicing a design in Figma, compressing images, and rebuilding the layout in Klaviyo using image blocks and tables for social icons.Klaviyo· Design a newsletter / email (drag-and-drop editor)
8:09:111:05Deliverability hack: Invisible text in KlaviyoDemonstrates how to paste large blocks of text into a Klaviyo email and make it invisible (white text, small font) to improve the image-to-text ratio for spam filters.Klaviyo· Improve deliverability / avoid spam
Watch “Ecommerce Email Marketing 2025 Free Course (8+ Hours) | Klaviyo & Shopify” →

Add an opt-in popup

2:590:51Create a signup form and list in KlaviyoShows how to create a 'newsletter subscribers' list and build a corresponding signup popup with exit-intent triggers and GDPR compliance.Uk Desi Vlogger
45:393:48Configuring Popup Targeting and BehaviorsA detailed demo of setting up popup triggers including exit intent, scroll depth, and frequency caps, as well as mapping the form to a specific subscriber list.Derek Stroh
4:262:58Create a newsletter pop-up from scratchA step-by-step walkthrough of building a pop-up form in Klaviyo, including teaser settings, logo customization, button styling, and success page configuration.Walshy Mails | Sunlo Consulting
4:533:49Create and customize a Klaviyo signup formDemonstrates how to select a form template, adjust the background and behavior settings (like 30-second delay or exit intent), and configure mobile vs. desktop targeting.Max Sturtevant
52:2918:01Build a mobile opt-in popup in KlaviyoA step-by-step walkthrough of creating a mobile-only signup form in Klaviyo, including editing blocks, setting up multi-step email/SMS capture, and configuring targeting behaviors like time delay.Max Sturtevant
1:10:304:42Design a desktop signup form in KlaviyoCurrentDemonstrates how to clone a mobile form for desktop use, adjust image placement (Right image vs. Left image), and hide the close button to force user decision-making.Max Sturtevant
19:177:25Creating and Targeting a Popup Signup FormBuilding a popup form from a template and configuring advanced targeting rules like exit-intent, scroll depth, and URL exclusions.Emiel Dingemans from Magicianly | Email Marketing