Problems defining a class or finding out the correct CSS selectors

  • Resolved letti

    (@letti)


    3 years, 2 months ago

    Hi,

    my site is still under construction and therefore password protected. I didn’t know where and how to add the pw so I added it after the url. I hope it works out for you when copying the url (without password) and use the password after opening the site…

    this plugin works fine, when having activated “images with lightbox > all images” but I want to use it only on selected images. It would have been my favorite solution to add a class to each image but this doesn’t work. Any suggestion why it doesn’t work when defining a class in the settings and adding it to any image?

    I even tried to define “CSS selectors to add lightbox”.

    It doesn’t work either but I’m not sure, whether I’m defining the correct selector. Could somebody help me finding out which CSS selector I would have to use or suggest, why it is not working?

    I would like to open the small pictures from my price list in a lightbox and have tried (among others):

    • uagb-rm__content img
    • wp-block-uagb-restaurant-menu img

    I would like to use a lightbox even on product pages for the first image. (Second item in menu with dropdown and then choose at best the third item.)

    In this case I tried:

    • wp-block-uagb-image__figure (with and without “img” after)
    • uag-image-400

    I would be great if anybody could help me. Thanks in advance.

    • This topic was modified 3 years, 2 months ago by letti.
    • This topic was modified 3 years, 2 months ago by letti.
    • This topic was modified 3 years, 2 months ago by letti.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Support jaysupport

    (@jaysupport)

    3 years, 1 month ago

    The lightbox seems to be working. The issue seems more to be that the source of the image in the lightbox is undefined. And I think this is likely happening because of the lazy load feature you have enabled on your images. Basically, our plugin grabs the URL of your image and uses the same one for in the lightbox. However, if the URL doesn’t yet exist when the page loads, then there is no URL for the lightbox to use, which is why it returns as undefined. Try disabling your lazy load feature and see if that makes any difference.

    raoulunger

    (@raoulunger)

    2 years, 10 months ago

    I ran into the same problem as you did. The plugin gives you two options: to add one or more classes, and/or to add one or more selectors. This is a little confusing, as a class is essentially a selector too, and the explanation is a little unclear.
    Having said that, I got it working by filling out the selector-field only, and adding the img tag there. So [.your_class img]. Don’t forget the dot starting the class-name, and don’t forget to tick the checkbox that says ‘Images with CSS Selectors Set Below’.

    If you do this in the class-field instead, it won’t work.

    In spite of this slightly confusing matter, I find this to be a plugin that works very well, and that can be custom styled very easily.

    • This reply was modified 2 years, 10 months ago by raoulunger.
Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Problems defining a class or finding out the correct CSS selectors’ is closed to new replies.