Docs

[RPronk]

Hello, i hav some styling issues with Envira gallery. I am not programmer but i have build serval websites with wordpress. I love the x-them but it seems i can not style anything with the gallery. In de settings panel i can only choose template Base. Thee are not other templates to choose from. Did i do something wrong with installing this plug-inn?

These are my issues, on my homepage there is a gallery with three photo’s: http://www.snowboarding-is-fun.com

1: the border it needs to be middle to dark grey and not so thin
2: the photo’s are displaying very small on mobile phones, it is not utilizing the mobiel screen as good as some other galleries do

Thanks for the help in these,
Ronald

[Rupok]

Hi Ronald,

Thanks for writing in! Kindly follow the documentation of Envira Gallery first – https://community.theme.co/kb/integrated-plugins-envira-gallery/

Online documentation – http://enviragallery.com/docs/

We bundle the unmodified version of Envira Gallery so we can’t really control any feature of functionality. So you need to use the features that’s offered by the plugin. However we are okay with some cosmetic changes as you pointed out. I’ll try to assist you on this.

#1. I can’t see any border rather the spacing. Would you clarify what you are referring? Kindly add a screenshot for that.

#2. You can add this under Custom > CSS in the Customizer.

@media only screen and (max-width: 767px) {
.envira-gallery-wrap .envira-gallery-public.envira-gallery-2-columns .envira-gallery-item, .envira-gallery-wrap .envira-gallery-public.envira-gallery-3-columns .envira-gallery-item, .envira-gallery-wrap .envira-gallery-public.envira-gallery-4-columns .envira-gallery-item, .envira-gallery-wrap .envira-gallery-public.envira-gallery-5-columns .envira-gallery-item, .envira-gallery-wrap .envira-gallery-public.envira-gallery-6-columns .envira-gallery-item {
  clear: both !important;
  display: block;
  left: 0 !important;
  margin: 0 auto !important;
  position: relative !important;
  width: 100% !important;
}
}

Hope this helps.

Cheers!

[RPronk]

Hello, thanks for the help. The white border is in the lightbox. I would like to change the color of this one.
Also i am not happy how this gallery behaves on a mobile phone. Any options for that? If i click on the photo it wil no display bigger due to how the lightbox displays the picture.

[RPronk]

this screenshot is from my mobile phone. As you see in landscape mode the photo displays small and can not be resized with you r fingers. Very poor like this…..

[Rad]

Hi there,

Looks like it’s the reverse on my end, it’s too big on my end, can’t even see other controls. Would you mind providing your admin login credentials in private reply? I like to see its current setting.

Thanks!

[RPronk]

This reply has been marked as private.

[Rad]

Hi there,

Thanks, but looks okay on my end. What device and browser you’re testing it on?

Thanks!

[RPronk]

Iphone 6s

but my thirst question is even more important as i was asking several times the white border in the lightbox is not ok for me. Can i change gallery plug-inn or can i restyle this one?

Thanks

[Rue Nel]

Hello There,

If you want change the border of the lightbox, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

body .envirabox-skin.envirabox-theme-base {
    padding: 2px !important;
    background-color: red;
}

body #envirabox-thumbs ul li {
    border-width: 1px !important;
    border-color: red;
}

body #envirabox-thumbs ul li.active {
    opacity: 0.75;
    border-color: blue;
}

I made the colors red to easily see the changes. Feel free to change the color if you are satisfied with the border thickness.
Please let us know how it goes.

[RPronk]

That works for me thanks 🙂

[Thai]

If you need anything else please let us know.

[Author]

Posts