TL;DR
Templates are pre-designed for common goals, like highlighting your best direct price, promoting special offers, or encouraging upgrades
Use drag-and-drop blocks to add content like text, images, and CTAs.
Customize design via styles tab, sections, and advanced settings.
Step-by-Step Instructions
1. Start from the Campaign Manager
Messages must exist within a campaign.
Go to your Campaign Manager.
Click Create Onsite Messages under Personalize your guest experience.
In Targeting and audiences:
Select the hotels you want the campaign to apply to (all hotels are selected by default).
Note: Right now, only “Everyone” can be selected as your audience. You can click Refine targeting to adjust website targeting settings, such as which visitors see your messages and when. More audience-specific targeting options will be available soon.
Click Continue.
In Channels:
Ensure Onsite Messages is selected.
Click Confirm channels.
2. Choose a Template to Begin
You can choose from several Triptease-designed templates:
Price Check
Seasonal Offers
Upsells (e.g., F&B, Spa)
Flash Sales
Direct Booking Perks
Templates are pre-designed for common goals and save time.
Tip: Starting with a template helps avoid blank-page fatigue and ensures your layout is structured correctly.
3. Open the Message Editor
After selecting a template, click Create message.
Click the pencil icon to open the editor.
Tip: Check you’re editing the correct mode (Desktop or Mobile). Use the toggle in the top bar.
4. Use Drag-and-Drop to Add or Rearrange Content
Add Sections to control layout and spacing.
Drag in Blocks like:
Text
Images or GIFs
OTA Price Comparison (Price Check)
Countdown Timers
CTAs
Customize each block from the right-hand sidebar.
5. Customize Styles
With your message selected, use the Styles tab to:
Set background color
Adjust size, orientation, and padding
Choose fonts, text alignment, and colors
Use the color dropper to match hotel brand styles.
Tip: If you’re not seeing your changes, double-check whether the element is inside a section with its own styling settings.
6. Configure Placement
From the Styles tab > Placement, you can set:
Where on the webpage your message appears (e.g. center bottom)
The message’s Z-index (layer depth)
7. Save Frequently!
The editor does not auto-save (it’s coming soon!). Save before:
Switching from Desktop to Mobile
Exiting the editor
Previewing your message
Pro Tip: You can undo actions using Ctrl+Z (Windows) or Cmd+Z (Mac)
Pro Tips
Use auto-size if your message is getting cut off
Test different layouts on Desktop vs Mobile
Try duplicating blocks to speed up creation
Collapsible behavior is currently only available for Price Check templates
FAQs / Troubleshooting
Question: Can I start from scratch?
Answer: Yes. Start with a template, then delete all blocks to begin fresh.
Q: Why don’t my style changes show?
A: A section or block may be overriding container settings. Check element nesting.
Q: Why did my work disappear?
A: Most likely due to navigating without saving. Always hit the save button before switching modes or pages.