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

How to change the spacing between images in your Instagram LightWidget

Optimize the visual presentation of your gallery for a professional look

Key points:

  • The spacing can be adjusted directly in the LightWidget settings.
  • You can set the margin in pixels or remove the spaces completely.
  • The change requires regenerating the integration code.
  • The feed remains responsive and seamless across all screens.

The spacing between images greatly influences the perception of your Instagram gallery. Too much space, and the feed looks fragmented; not enough, and the visuals appear compressed. Here's how to easily adjust the margins between images in your LightWidget for a perfectly balanced display on your hotel website.

1. Log in to your LightWidget account

Go to www.lightwidget.com and log in with your credentials. In your dashboard, select the Instagram widget already integrated into your hotel website. You will immediately see a visual preview of your current gallery.

💡 Tip: If you have multiple widgets, rename them according to the pages or sections of your site (e.g., “Home”, “Gallery”, “Restaurant”) to avoid any confusion.

2. Open the widget's appearance settings

In the widget settings, look for the “Appearance” or “Layout” section. This is where you can make changes:

  • The number of columns
  • Image size
  • And most importantly, the “Image spacing” option (or “Gutter” depending on the version).

By default, LightWidget applies a spacing of a few pixels between each image. You can:

  • Reduce the value (e.g., 5 px) for a more compact effect.
  • Increase it (e.g., 20 pixels) for more ventilation.
  • Set the margins to 0px to completely remove them and obtain an "edge-to-edge" gallery.

💡 If you want a more modern style, a light spacing (between 5 and 10 px) works particularly well on hotel websites.

3. Generate a new integration code

Once you have finished configuring your settings, click on Get code to generate a new embed code that matches your preferences. Copy this code to your clipboard.

4. Update the widget on your hotel website

Open your site in Webflow Designer or Editor:

  1. Go to the Instagram feed location.
  2. Double-click the Embed block containing the LightWidget code.
  3. Delete the old script and paste the new code.
  4. Click Save & Close, then Publish to publish the changes.

💡 After publishing, refresh the page and check how it looks on desktop and mobile.

5. Check for responsive compatibility

LightWidget automatically adjusts the spacing according to the screen size, but it is always recommended to test on several devices:

  • On mobile devices, excessive spacing can reduce image size.
  • On desktop, slight spacing improves readability and visual consistency.

If necessary, return to LightWidget and adjust the value until you achieve a perfect balance between density and visual comfort.

Conclusion

Adjusting the spacing between images in your LightWidget is a simple operation that has a significant impact on the visual appeal of your hotel website. By setting the margins to the right value, you can create a gallery that is elegant, seamless, and perfectly integrated into your design.