top of page

Wix Responsive Images

Want to make an image responsive in Wix? As a Wix Designer, I get this question often so I thought I'd write a blog post to share. If you want an image to be full-width and responsively scale to each viewer's web browser, here's a good way to accomplish this:

Here's how to add full width images in Wix that are responsive to different sized screens. You could use a full-width Strip image, but that doesn't give you as much control as a Pro Gallery. Simply add a Wix Pro Gallery, and set it so it stretches to full width, and then go into the Settings > Layout, Choose Grid, then click on "Customize Layout" and to choose choose the sizing settings to Fit (instead of crop), and one (1) image. You now have a full screen image that will flex to different sized screen! You can also set it so that it can be opened into full screen if desired, and also allow for downloads and social sharing. Or, you can have it un-clickable by choosing "Nothing Happens."


Keep in mind that this Pro Gallery won't scale to extra-small browser windows on tablets and desktops, the way Wix works is that it sizes it down to a point, so it will shrink down to the width of the page inside the Wix gridlines is fixed at 980 pixels, so it won't flex smaller than that width except on a phone, which has a different layout. Here are some screenshots below on how I set up the full width image shown in the Wix tutorial video above.


Wix Responsive Images: Customize Layout of Grid Wix Pro Gallery
Wix Responsive Images - using Wix Pro Gallery Design Settings
Wix Responsive Images - using Wix Pro Gallery


892 views

Recent Posts

See All

Comments


Reach out with questions or for a free design estimate:

As a website designer and graphic designer, I love sharing great tips and tools that make designing easier. As part of my website design services, I train clients on how to update their websites or to do their own SEO (search engine optimization), so I post many of these tips for my clients to train them how to use Wix and other tools to keep their website up-to-date. Keeping websites current is the best way to get found and to keep people coming back to your website. 

Check out all my Design & SEO tips and resources in my blog

bottom of page