Spacing between thumbnails

Hi,

We would like to inform you that this functionality of adjusting the thumbnails options is available in the Premium version of the Photo Gallery Plugin.

However, for the free version, we can try to tweak the CSS to enlarge the distance between thumbnails. Could you please post the link to the page where you have your gallery?

In case you have Premium version, we are kindly asking you to contact us using this [email protected] email address for further questions.

Thank you! Have a nice day!

Hi,

Please find the answer here.

Thank you! Have a nice day!

I managed to play around in the Inspector and found this to work.

/* This line prevents going to two columns */
#bwg_container1_0 #bwg_container2_0 .bwg_standart_thumbnails_0{
max-width:2000px!important;
}
/* This line creates more spacing between thumnails */
#bwg_container1_0 #bwg_container2_0 .bwg_standart_thumb_spun1_0{
margin:10px!important
}

I put this CSS code in the WP CSS Customizer

• This reply was modified 6 years, 7 months ago by mRoy62.

Hi,

We are glad that you have come up with the CSS solution.

Is there anything we could help you with?

Thank you! Have a nice day!

Can you confirm that my CSS is actually a good solution. My main concern is that I had to increase the max-width to 2000px. Why was your default set at something like 760px?

Hi,

Please note that the margin is taken from the Theme and every time it applies to the Thumbnails as a CSS code when the page is loading.

Now, when we are trying to change any style via CSS code from the front-end, it may affect other parameters styles, for example, width. So, in this case, you should also change the max-width.

However, you can share your URL address where the Gallery is published and we will try to suggest a better CSS code.

Thank you! Have a nice day!

The website url is: https://brentwoodphotographygroup.org/galleries-exhibitions/

Hi,

Please note that if you want to achieve this, then add the following CSS code into Appearance ? Customize ? Additional CSS:

span[class^="bwg_standart_thumb_spun1"]{
    margin:10px !important
}

Please let us know if it helps.

Thank you! Have a nice day!