TL;DR
You can design separate variants of each message for desktop and mobile.
This ensures optimal layout, readability, and performance across devices.
Always save your work before switching between views.
When to Use It
Use desktop and mobile variants when:
Your message layout looks too cramped or oversized on mobile
You want to optimize font size, image scale, or placement per device
You're targeting guests based on device type
How It Works
Each message in the Triptease Messages Platform can be customized separately for desktop and mobile. When you:
Create a new message, both variants are generated by default
Edit the desktop layout, it does not automatically change the mobile one
Switch between views using the toggle at the top of the editor
Step-by-Step Instructions
1. Open the Message Editor
Navigate to your message from within a campaign and click the pencil icon.
2. Select a Device View
Use the toggle in the top toolbar to switch between Desktop and Mobile.
Important: Changes made in one view won’t carry over to the other. Adjust each view individually.
3. Customize Each View
Reposition or resize blocks as needed
Adjust padding, alignment, and font sizes for better mobile UX
Hide blocks on one view if they aren’t needed (e.g., large images on mobile)
Pro Tip: Keep mobile layouts short and to the point. Use stacking and large CTAs.
4. Always Save Before Switching Views
Switching between Desktop and Mobile without saving can cause you to lose unsaved work.
Suggested screenshot: Save button with tooltip about saving before switching
Pro Tips
Use simpler layouts on mobile (single column, stacked blocks)
Hide complex elements that don’t render well on small screens
Preview both views before publishing
Don’t forget to translate each variant if you’re using multi-language support
FAQs / Troubleshooting
Question: Can I design just one variant and have it apply to both?
Answer: Yes, but the default is to design them separately. Use the same layout on both views if desired.
Q: Why did I lose my changes when switching views?
A: You likely switched without clicking save. Always save before toggling between Desktop and Mobile.
Q: Can I hide a block in one view only?
A: Not yet. For now, keep both versions visible or redesign the layout to suit both.