Can you please add a link to your site?
The site is under development, but it’s easy enough to test. This, for example, has the following code, which isn’t having any effect.
.foogallery-gallery-6.fbx-caption-desc {display:none}
OK, there are three problems with your rule selector:
- foogallery-gallery-6 is an ID, not a class, so you need to prefix it with a pound sign/hash tag, not a period.
- When combining qualifiers from different elements, you need to put a space between them. If combining qualifiers from the same element, there is no space. It looks like you are trying to combine qualifiers from two different elements, so there should be a space separating them.
- On that particular page, there is no element with the class name of fbx-caption-desc. The closest is the anchor link, but it has a class of fbx-link.
Try this rule instead:
#foogallery-gallery-6 .fbx-link {display: none;}
Hi,
Thanks for helping out. Unfortunately, that rule causes the entire gallery to disappear.
I found the reference to fbx-caption-desk, etc. on this page. It seems to be saying that you can modify the caption fields by referencing those classes in the custom css box. However, as you point out, they don’t appear when inspecting the rendered page.
Is there supposed to be more than one image displayed on the page? I’m not sure what you are trying to achieve. I only saw one picture, and that one picture is no longer there. Or, I only saw one gallery on that page, and that gallery is no longer there.
There’s only one picture. I want to display that picture, but not have the caption and description slide up at the bottom of it. I don’t want to disable that functionality globally, just on some pictures.
The picture’s not showing since I added the rule that you suggested. I’ll remove it now.
OK, sorry, I misunderstood what you were trying to do. I had to click on the gallery to display the image.
This CSS will hide the caption, but for all of the images in the gallery (and on the page):
.fbx-caption {display: none !important;}
The problem with trying to limit it to a particular gallery, though (if there is more than one gallery on a page) is that the lightbox element is outside of the foogallery container, and I don’t see any unique identifier associated with the image that is currently displayed in the lightbox. So any modification to the lightbox elements will be in effect for all images in that gallery.
Now, what you can do is add rules which affect galleries which are on different pages by adding the page/post ID to the front end of the CSS rule. But again, that rule will be in effect for all gallery images on that page.
Yes. That’s the problem. I mentioned using
.fbx-caption-desc {display:none}
in my original post, but as you say, it hides it for everything. Reading that cheat-sheet page I linked to, above, I thought I should be able to disable it for individual galleries, but it doesn’t seem possible.
