Page 1 of 1

Image Caption CSS

Posted: January 5th, 2018, 8:19 pm
by lnigon
I would like to adjust the size and style of the caption on both the thumbnail and on the pop up. What is the CSS code reference so I can make those changes?
Thank you

Re: Image Caption CSS

Posted: January 6th, 2018, 11:02 am
by support_staff
hi lnigon,

Please share your website URL.
Please apply following CSS code to custom CSS section of the plugin.
/*title on hover*/
.wl-gallery .rpgp-header-label {
font-size: 48px;
}
/*title on footer*/
.wl-gallery h4.rpgp-footer-label {
font-size: 48px !important;
}

/*for Photobox title*/
#pbCaption .title {
font-size: 48px;
}

After applying the above solution please notify us.

Thank you.

Re: Image Caption CSS

Posted: January 7th, 2018, 4:32 am
by lnigon
Thanks for getting back so quickly. It doesnt seem to be working though. The website is lisanigon.com. I tried adjusting all three of the CSS you provided and the text stays the same size on all screens. I would actually prefer to hide the caption on roll over and then have it display once the pop up opens. From there I would like to adjust the size of the caption when the pop up is open.
Thanks again!

Re: Image Caption CSS

Posted: January 8th, 2018, 10:48 am
by support_staff
hi lnigon,

We check your website and found that you are using our Responsive Portfolio Pro Plugin not the Responsive Photo Gallery Pro Plugin. We gave you CSS according to Responsive Photo Gallery Pro plugin. That's why CSS not worked.

Apply following CSS in the custom CSS section of the plugin.

.weblizar-portfolio-gallery a div span {
font-size: 20px;
}

Please notify us after applying the given solution.

Re: Image Caption CSS

Posted: January 10th, 2018, 6:04 am
by lnigon
Thanks! Ok that worked to change the size of the text on the thumbnail during roll over, but what is the CSS to change the size of the text once you click to open the full sized image?

Re: Image Caption CSS

Posted: January 10th, 2018, 11:55 am
by support_staff
hi lnigon,
That's good. Try this CSS code to change the font size of text when image open the full-sized image:

.nivo-lightbox-title-wrap span.nivo-lightbox-title {
font-size: 20px;
}
Thank you.