Thumbnail image different to enlarged image

  • Resolved NiallASD

    (@niallasd)


    3 years ago

    Hi all,

    I’d like to have the gallery work where you can click on a thumbnail that then opens a separate image via Lightbox (the thumbnail is a cropped version of the larger version).

    I can’t get this to work with my gallery (it just opens the large image as a new page as you can see in the link).

    In the page I linked I have an image of horses that when clicked brings up a larger image via Dropbox – this was copied directly from a separate site I made under a different host – I can’t remember if I did something on that site to make it work!

    My host did some troubleshooting but couldn’t get to the bottom of it.

    I cleared my cache and disabled plugins, but nothing seems to work.

    Can anyone help (hope so!)?

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

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Author GalleryCreator

    (@gallerycreator)

    Hello,
    You’d better ask your gallery (theme) developer for help.
    SimpLy lightbox will only work with SimpLy gallery or native WordPress gallery

    Thread Starter NiallASD

    (@niallasd)

    Thank you, I developed the theme and gallery myself.

    SimpLy lightbox works as intended on a different site I made, but not this one.

    But does work on an image copied from the site where it works (as shown in the horses thumbnail in the original post’s link)

    Plugin Author GalleryCreator

    (@gallerycreator)

    a photo with a horse is an exception (accident). The filename of a large image must contain the name of the thumbnail file plus any prefix. This condition will enable the lightbox script to fire.
    An example of a pair image.jpg (small picture) – image_thumb.jpg (thumbnail )

    Thread Starter NiallASD

    (@niallasd)

    Thank you, I will give that a go.

    Thread Starter NiallASD

    (@niallasd)

    I added the following code based on what you said about naming the files, but the lightbox still doesn’t work.

    <div class="main-gallery-wrapper">
    <div class="gallery-container"><a href="https://www.jjraffertyandsonsltd.com/wp-content/uploads/2021/11/flo-road-1.jpg">
      <img src="https://www.jjraffertyandsonsltd.com/wp-content/uploads/2021/11/flo-road-1_thumbnail.jpg"></a></div>
</div>
    Plugin Author GalleryCreator

    (@gallerycreator)

    this happens because your node element (A) contains a text node ('\n ') before the image node, which makes this link invalid for the script.

    Thread Starter NiallASD

    (@niallasd)

    Sorry, I don’t understand what a text node and image node are, what changes should I make to the code?

    Thread Starter NiallASD

    (@niallasd)

    Got it working now, thanks for your help.

    Is there a way to have the lightbox work as soon as the page loads? I notice that if I click on a thumbnail too soon it loads without lightbox.

    Waiting a second or so prevents that, but I’d prefer no wait at all.

    Plugin Author GalleryCreator

    (@gallerycreator)

    The first way is to use gallery block with a lightbox (for example SimpLy).
    And the second way is to use plugins that cache scripts (for example Autoptimize)

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Thumbnail image different to enlarged image’ is closed to new replies.