Space between images in single portfolio

Anaxo · June 2019

How can we achieve an even gap between the images in the single portfolio, can't find anything in docu or discussions:

https://snag.gy/rJ63yh.jpg

THX

Bernhard

Pablo · June 2019

Hi,

Please send a link to that page.

Is it single portfolio or main portfolio page?

Remember, that if you use some kind of image item, then just change the layout of that item.

Thanks

Anaxo · June 2019

As mentioned above it is the single portfolio page.

for example:

https://brizzo.uk/portfolio-item/engagement/

https://brizzo.uk/

testuser

test9876

Bryan · June 2019

Hello,

you are using a gallery item, which style is set to masonry. Edit the gallery item in the Muffin Builder and change the style to grid.

thanks

Anaxo · June 2019

I'm lost, I use the theme portfolio, so there is no single page to edit the Muffin Builder. Can you be more specific where to change?

Thank you very much
Bernhard

Bryan · June 2019

In the previous answer, you said:

"As mentioned above it is the single portfolio page."

So I looked at the screenshot and went to the single portfolio page:

https://snag.gy/rJ63yh.jpg

https://brizzo.uk/portfolio-item/engagement/

And this is a gallery in the single portfolio project. When you edit the single portfolio, you will see the Muffin Builder and within it, a item named Image gallery. Edit this item.

thanks

Anaxo · June 2019

Thanks, but there is no style "Grid". "Default" makes spaces, but works with same size images only, otherwise it creates huge white spaces:

https://brizzo.uk/portfolio-item/engagement/

So masonry is the only way, but we simply need the images separated, any CSS attempt failed.

THX

B.

Pablo · June 2019

Unfortunately, it cannot be changed with the CSS code.

You would have to edit theme files to change that - because JS script is calculating the width of image container and fit it on the screen.

Applying additional padding/width/margin through the CSS can make some troubles with responsiveness, that's why suggest not to do it.

Thanks

Anaxo · June 2019

You "suggest not to do it"? What do you think my client tells me when I say that to him (slam in the face, right?).

please solution, you mentioned the "grid" style, but I can't find grid in the selection. Maybe that's the solution.

Bryan · June 2019

Yes, we mean default. Default is the standar grid for the gallery.

You must have the same size images to have a grid.

To do this, go to settings>media and change the thumbnail image sizes to squared, you need to set the dimmensions. 780x780 will be enough and use the crop option as well.

Then use the "thumbnail regeneration" plugin, which can be found in betheme>install plugins.

There is no other way to have a grid.

Anaxo · July 2019

We don't have the same size, unrealistic for a photographer. Why are you not adding a gap in the options, takes you probably 15 minutes. All big themes have that option. tHX!

Pablo · July 2019

That's why we created the "Masonry" style, why won't you try it?

Check all possibilities of gallery item here:

https://themes.muffingroup.com/be/theme/pages/gallery/

Thanks

Anaxo · July 2019

Oh yes that is exactly what we are looking for, how do we get the frame added? Using shortcode or builder element we don't get the frame around the images.

THX

Pablo · July 2019

Please use that CSS code:

.gallery-item .image_wrapper {
  border:2px solid black;
  border-color:black !important;
}

Paste that into the Theme Options > Custom CSS & JS > CSS
Thanks

Anaxo · July 2019

We found the border setting in theme options - would have been easier if you would have pointed us to this weeks ago instead of a css fix, sorry, would have spared us a lot of trouble w client

Please enhance your docu, you only describe what is anyway visible in the option itself without a real documentation of the functions - thx! Very much appreciated and requested since Falco times

Happy 4th, wherever you are, fight for freedom.

Pablo · July 2019

Yes, it could be added through the theme options too, but you are not able to customize the width of the borders then.

I assumed, that you want to control it - sorry.

For anybody who'll be looking for answer how to set the border through the theme options.

Theme Options > Global > General, in the "Image Frame" section

http://prntscr.com/oafgxw

We are already during creating new documentation, it will be enchanced and more customer friendly.

I hope you'll love it!

Greetings.

Space between images in single portfolio

Comments

This website uses cookies