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

How to add a social media icon to the footer of your hotel website

Easily update your social media links in the footer

Key points • The footer often contains icons configured as global elements • The editor sometimes allows you to modify links but not to add new icons • Adding a new icon often requires intervention from a designer • Good integration ensures visual consistency and responsiveness

Social media icons in the footer are essential for boosting your hotel's visibility and facilitating access to platforms like Instagram, Facebook, and LinkedIn. Adding or modifying them should be done cleanly to maintain a consistent and elegant layout.

Here's how to proceed depending on the options available on your site.

Edit an existing social network link in the footer

If the icon you want to add already exists in the structure (e.g., an inactive icon or a placeholder), you can update it via the Editor.

Procedure :

  1. Open your published website.
  2. Click on Login to access the Editor.
  3. Scroll down to the bottom of the page.
  4. Hover over the icon you want to edit and click Edit.
  5. Click on the Link icon.
  6. Paste the URL of your social network (e.g., https://instagram.com/your-hotel).
  7. Enable "Open in new tab" to open the link in a new tab.
  8. Publish the page.

💡 This method is only possible if the icon already exists.

Add a new icon via the Editor (rare but possible)

On some sites, icons are managed via a CMS Collection (e.g., “Social Networks”). In this case, you can add a new icon via the Editor:

  1. Open Login in the Editor.
  2. Access the "Social Networks" collection, if it exists.
  3. Click on New Item.
  4. Add: • The network name • The icon (SVG recommended) • The social network URL
  5. Save and publish.

💡 If your footer is dynamic, this option makes adding it very simple and clean.

Add a new icon via the Designer (most common method)

If your site doesn't use a CMS for icons, they must be added in the Designer. This ensures: • Consistent layout • Uniform icon size • Perfect alignment with other networks • Proper mobile optimization

Procedure :

  1. Open the Designer.
  2. Select the social media section in the footer.
  3. Duplicate an existing icon or add a new image or SVG.
  4. Import the icon of the new social network.
  5. Add a link around the icon: • Paste the network URL • Enable “Open in new tab”
  6. Adjust the spacing, alignment, and size.
  7. Check the mobile and tablet display.
  8. Publish the website.

💡 Always use SVG icons for perfect sharpness on all screens.

Check mobile display

Since social media is often displayed online, the risks on mobile are: • Icons that are too small • Icons that are squashed or distorted • Poorly placed line breaks • Incorrect centering

Try it: • On an iPhone • On Android • In portrait and landscape mode

Adjust the margins and spacing as needed.

Visual best practices for a hotel

To maintain an elegant presentation: • Use only monochrome icons or icons that match the site's design • Avoid saturated colors that disrupt the brand's style • Use the same size and thickness for each icon • Maintain consistent spacing between each button

A clean footer improves the premium perception of your establishment.

Conclusion

Yes, you can add a social media icon to your hotel website's footer, but the method depends on the site's structure. If the icon already exists, the Editor is sufficient; to add a new one, the Designer is generally required. By following best practices for layout and responsive design, you'll ensure a professional and effective result.