Skip to content
English - United States
  • There are no suggestions because the search field is empty.

Can I put text on an image?

Adding text over an image while respecting the design and readability

Key points • Text can be displayed on an image if the structure allows it • The Editor only allows you to modify existing text • The Designer is required to add a new text area • A good overlay and mobile validation ensure readability

Adding text to an image is very common on hotel websites: welcome banner, highlighting rooms, seasonal offers, promotions… It is perfectly possible, but it must be done properly to avoid problems with readability, design or mobile display.

Here's how to proceed depending on your site's configuration.

Editing text already positioned on an image (Editor)

If your image already has a text block on top: • Title • Subtitle • Button • Paragraph

Then you can edit this text directly from the Editor.

Procedure :

  1. Open your published website.
  2. Click on Login.
  3. Hover over the text placed on the image.
  4. Click on Edit.
  5. Enter your new text, confirm, and then click Publish.

💡 The Editor allows you to edit text, but not to add a new text block above an image if the structure does not already exist.

Add text to an image (Designer required)

If you want to add a new text box to an image that does not already contain one, this requires intervention in the Designer.

Method :

  1. Open the Designer.
  2. Select the section containing the image (often in the background).
  3. Add a div block or container on top of the image.
  4. Position this block using: • Absolute (for free placement) • Flex (for easy centering)
  5. Add your text (H1, H2, paragraph).
  6. Adjust the color, size, and position.
  7. Add a dark overlay if necessary for readability.
  8. Test the mobile app, then publish.

💡 This method guarantees clean and responsive positioning on all screens.

Add or adjust an overlay to improve readability

On a high-contrast image (room with light, restaurant, spa), the text can be difficult to read.

Solution: • Add a black or colored overlay (20–40% transparency) • Use a semi-transparent background behind the text • Reduce the image brightness in the settings

This guarantees a premium and professional result.

Check for mobile responsiveness

Text on images can behave differently on mobile: • Image cropping • Automatic vertical zoom • Text lines too long • Loss of readability

Always test: • iPhone • Android • Landscape and portrait mode

💡 Adjust the size and mobile position to avoid overlapping or cut-off text.

What not to do

To maintain a high-end aesthetic: • Do not write text directly into the image itself using Photoshop (it's difficult to edit) • Do not use excessively long texts on complex visuals • Do not change the alignment without checking the mobile version • Do not use too many different fonts in this type of block

Conclusion

Yes, you can place text on an image on your hotel website. If the text block already exists, the Editor allows you to easily modify it. To add new text to an image, you'll need to use the Designer to maintain a clean, elegant, and mobile-friendly layout. By using an overlay and checking the display on different devices, you'll ensure a professional presentation for your visitors.