Wix Pro Gallery: Enabling and Customizing a Load More Button
Add a Load More button to your gallery to minimize the amount of content facing your site visitors when they access your site. You can then choose if you want to allow visitors to load all images in one click, or section by section.
You can customize the button's text, font, color, and more to complement the rest of your site's design.
Note:
You can only add a Load More button to layouts that have a vertical scroll. You can't add a Load More button to the Thumbnails, Slider, Slide show, and Columns layouts.
Enabling a Load More button
Add a Load More button to your gallery to allow visitors to load all images in one click, or section by section. Each section is the same size as the original gallery, meaning if your original gallery view shows four images, each subsequent section a visitor loads will display four images.
Wix Editor
Click the pro gallery element on your page.
Click Settings.
Click the Layout tab.
Click Customize Layout.
Enable the Load More button toggle.
Select an option under How many more images load:
All images: All images load.
One more section: The next section of the gallery loads.
Studio Editor
Click the pro gallery element on your page.
Click Settings.
Click the Layout tab.
Click Customize Layout.
Enable the Load More button toggle.
Select an option under How many more images load:
All images: All images load.
One more section: The next section of the gallery loads.
Customizing a Load More button
Personalize your Load More button's text, font, color, and more to fit the rest of your site's design.
Wix Editor
Click the pro gallery element on your page.
Click Settings.
Click the Design tab.
Click the Buttons tab.
Customize the Load More button using the following options:
Button text: Click the Button text field to change the text that appears on the button.
Font style & color: Click the drop-down to adjust the button's font, text size, and more. Click the color box to select a color.
Button color & opacity: Drag the slider to change the button's transparency and click the color box to select its color.
Border width & color: Drag the slider to change the button's border width and click the color box to change the border's color.
Corner radius: Drag the slider to make the button's corners rounder.
Studio Editor
Click the pro gallery element on your page.
Click Settings.
Click the Design tab.
Click the Buttons tab.
Customize the Load More button using the following options:
Button text: Click the Button text field to change the text that appears on the button.
Font style & color: Click the drop-down to adjust the button's font, text size, and more. Click the color box to select a color.
Button color & opacity: Drag the slider to change the button's transparency and click the color box to select its color.
Border width & color: Drag the slider to change the button's border width and click the color box to change the border's color.
Corner radius: Drag the slider to make the button's corners rounder.
Tip:
If you only see 1 row of images, simply drag the bottom handle of the gallery to increase its size.
Resolving Load More button issues for Pro Galleries built on the Wix Editor
Some issues may arise in certain layouts when the Load More button is enabled on galleries built on the Wix Editor. Depending on the issue you're experiencing, there are various solutions available.
If you have built your Pro Gallery on the Studio Editor, follow our Studio-specific guidelines to resolve any issues related to responsiveness.
Click an option below to learn how to resolve common issues with the Load More button on the Wix Editor:
Images of different height are cut when the Load More button is set to open "One more section"
The gallery section size remains the same across all screen sizes, meaning that some images may be cut if they are of different heights. There are a few ways to resolve this issue:
Solutions:
Apply a layout where all images are the same height (e.g. Bricks, Grid with images set to Crop).
Set the Load More button to open All images.
Disable the Load More button.
Last row of images is cut when the gallery is set to full-width (Grid layout)
Across all screen sizes, the height of the gallery with a Grid layout stays the same, while the width changes according to the window / screen size. This means, images become smaller on smaller screen sizes and images on the last row may be cut.
Solutions:
Disable the Load More button or disable the full-width mode.
Stretch the Pro Gallery to full width and set its margins to 0px.
(If you display text on your gallery) Set the Info position to be Left or Right.
Images at the bottom of the next section are cut (Masonry and Collage layout)
In galleries with the Masonry or Collage layout, the images at the bottom of the next section are cut when you set the Load More button to open "One more section".
Solution: Set the Load More button to display All images or disable the Load More button.
If this is a feature you would like to see in the future, you can vote for it here.
Need A Professional Website?
Contact Us Today!
I'm a paragraph. I'm connected
I'm a paragraph. I'm connected
I'm a paragraph. I'm connected
I'm a paragraph. I'm connected
I'm a paragraph. I'm connected
I'm a paragraph. I'm connected