Custom Envira Gallery CSS

Support
#1

I’m trying to adjust the global envira gallery basic styling via CSS specifically the gallery title and captions. I tried adding this css below inside the CSS on the specific gallery page and the global appearance customize css area but it didn’t work.

I tried basic changes like:
.envira-caption { text-align: center; }
.envira-title { font-size: 18px; }

Is this possible to do via CSS or am I missing something with the CSS?

Thank You

#2

Hello @Rocketboy,

Thanks for writing in! The code is valid and correct. The code may not work because of your caching issue since you installed WP Fastest cache. Please clear your plugin caches first and test your site again. Caching are best to turn on when you are done building your site.

Hope this helps. Please let us know how it goes.

1 Like
#3

Thank you for the follow up. That’s a good point about the cache plugin when building the website.

It looks like the envira plugin isn’t taking my caption code changes. The title changes are working. Have you seen any issues with customizing the caption via css or is it recommended that I purchase the envira “basic” for the add on CSS tool for this plugin for doing things like that?

This is what I’m currently using:

.envira-caption { text-align: center !important; }
.envira-title { font-size: 24px !important; }

Thank You for Your Time

#4

Hi Bryce,

Thanks for writing in!

The custom CSS should work in the version that you are using.
Can you please send us the page URL that the gallery is, so that we can have a look.

Thanks

#5

Thank you for your input.

Maybe it has something to do with it being in the gallery full screen view? So for example I’m displaying the title on the initial gallery and when the image is clicked the caption is left aligned in the top right corner. I’m trying to style this caption thats shown when the image is opened large where you scroll from image to image.

http://www.rocketboysolutions.com/FParker/california-courtyard-before-after/

#6

Hi Bryce,

Try using the following CSS rules and it should appear as below in the screenshot added to the secure note.

.envirabox-title {
    text-align: center;
    font-size: 18px !important;
}

Hope that helps.

1 Like
#7

Thank you for your assistance with this!

#8

You’re welcome. Glad we could help.

1 Like
#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.