Temporarily hide the “Book” button on your hotel website
Why hide the “Book” button?
Key points:
- Useful during maintenance of the booking engine.
- This prevents clicks to an unavailable page.
- A reversible solution that doesn't alter the design.
Hiding the "Book" button can be useful when your booking engine is being updated, undergoing maintenance, or temporarily unavailable. This preserves the user experience and avoids the frustration of a broken link. The goal is to make the button invisible without permanently removing it, so it can be easily reactivated once the service is back online.
Methods to hide the button
There are several ways to temporarily hide the “Book” button depending on your access level (Designer or Editor) and the need for speed.
1. From the Designer (complete visual method)
- Select the “Book” button in the Designer.
- In the Style panel, open the Display section.
- Set the parameter to None (instead of Block or Flex).
- The button disappears from the published website, without being deleted.
- When you wish to reactivate it, simply switch the display back to Block mode.
💡 Tip: Add an internal note or tag in the Navigator panel to remind you to reactivate it later.
2. From the Editor (if you do not have access to the Designer)
- Log in to your Webflow Editor.
- Hover over the section containing the button.
- If the button is embedded as a component or text block, you can temporarily remove it from the Editor.
- To hide it without deleting it, ask a Designer administrator to apply `display: none` via a conditional field or a temporary style.
3. Use a logical condition (CMS or dynamic component)
If your button is linked to a Collection or a dynamic block:
- Add a condition: “Display if the engine is active”.
- Uncheck this condition while maintenance is in progress.
- The button will automatically disappear on all affected pages.
Best practices
- Notify your visitors with a short message such as “Online bookings are temporarily unavailable”.
- Never permanently delete the button: preserve the HTML structure to avoid layout errors.
- Test the behavior on mobile and desktop before publishing.
- Reactivate the button as soon as the engine is functioning again.
Conclusion
Temporarily hiding the "Book Now" button is a simple and secure solution for managing maintenance periods without altering the design of your hotel website. In just a few clicks, you protect the customer experience while maintaining complete control of your interface.