Skip to content
English
Contact us
  • There are no suggestions because the search field is empty.

How do I insert a clickable link into an image?

Transforming an image into a truly interactive element

Key points • An image can become clickable via an internal or external link • The Editor sometimes allows you to modify an existing link • Adding a link around an image often requires the Designer • Testing for responsiveness ensures correct behavior on mobile

Making an image clickable is very useful in a hotel website: redirecting to a room page, a special offer, the spa, a restaurant, a PDF, a booking page… It is possible in most cases, but the method depends on how your site is structured.

Here's how to do it simply and cleanly.

Add or modify a link on an existing image in the Editor

If the image is already surrounded by a link in the structure (e.g., a map, an offer thumbnail, a CMS image), you can simply modify the link via the Editor.

Procedure :

  1. Open your published website.
  2. Click on Login to access the Editor.
  3. Hover over the image.
  4. If the Edit option appears, click on it.
  5. Click the Link icon in the editing bar.
  6. Choose: • An internal page (rooms, restaurant, offers…) • An external URL • An internal anchor
  7. Publish the page.

💡 This method only works if the designer has planned a link around the image.

Add a clickable link around an image using the Designer

If your image is not yet clickable, then you must use the Designer to surround it with a link.

Method :

  1. Open the Designer.
  2. Select the desired image from the page.
  3. In the right-hand panel, click on Wrap in Link Block.
  4. The Link Block appears around the image.
  5. Add the link: • Internal page of the site • External URL • Anchor text
  6. Adjust the size of the Link Block if necessary.
  7. Test it on desktop and mobile.
  8. Publish.

💡 The Link Block is the official method to transform an image into a clickable element.

Insert a clickable link into a CMS image

If your image is in a Collection (rooms, offers, restaurant…):

  1. Access the Editor via Login.
  2. Open the relevant collection.
  3. Check if a link field exists in the item.
  4. Add or update the link.
  5. Publish.

In this case, the image automatically becomes clickable if the template has been configured for this.

Choose the right type of link

Depending on the intended use: • Internal page → smooth and logical navigation • Booking page → direct conversion • PDF → brochure, restaurant menu, spa information • Anchor text → directs the user further down the page • External link → partners, social media, press

💡 For internal pages, it is recommended not to open them in a new tab.

Check mobile behavior

On mobile, some clickable images may be difficult to select if: • The image is too small • The padding is insufficient • Other elements overlap • The link does not properly cover the image

Try it out: • iPhone and Android • Portrait and landscape • With real navigation, not just a preview

What not to do

To maintain a premium experience: • Do not insert an overlay link via a complex interaction • Do not surround an image with multiple Link Blocks (click conflicts) • Do not place a link on a decorative image without UX purpose • Do not use an excessively large file (mobile performance will be impacted)

Conclusion

Yes, you can make an image clickable on your hotel website. If the link already exists, the Editor is all you need to modify it. To add a link around a new image, the Designer allows you to use a Link Block for a clean and responsive look. By testing the mobile version and choosing the appropriate link type, you ensure a smooth and professional browsing experience for your visitors.