glightbox plugin doesn't work when encrypt is enabled

[jeetyadav98]

trafficstars

I would like to make images zoom able and clickable, which the mkdocs-glightbox enables. However, it does not seem to work at all when this plugin is installed and active.

Any idea how I can fix this?

[unverbuggt]

I didn't test with this plugin. Maybe we just need to re-call some javascript after decryption. I'll check.

Edit: Did you make sure that the plugin order is correct?

plugins:
  - glightbox:
      zoomable: true
      draggable: true
      skip_classes:
        - skip-lightbox
  - encryptcontent: {}

I did a brief test with the plugin's documentation, and it worked kind of (first image I clicked sent the browser to the image, but second click opened the GLightbox).

[jeetyadav98]

Oh, I never changed the order! I'll have to check.

I didn't know that the order would matter. Is there any reason it does?

[jeetyadav98]

Yes it works. Thank you!

However, as you noted, the first click opens in browser - not default behavior. Any idea how I could fix this?

[unverbuggt]

The first-click behaviour is strange indeed. It doesn't trigger any javascript errors or such...

I'd need to dig into how the glightbox plugin works to find the cause. It's probably just some intialization that needs to be triggered. But no idea why it works on the second click.

Not top priority for me at the moment. However, you could try opening an issue here and hope that the developer of the plugin got some ideas.

[lilyildiz]

I had the same problem, my site was also constantly asking for the password while navigating. I saw #61 and fixing that problem by removing the navigation.instant from mkdocs material features fixed both of the problems for me.

[unverbuggt]

Did you also try setting webcrypto: true or esm: true while enabling navigation.instant? This should fix being re-prompted for the password, however it won't fix the glightbox issue.

[unverbuggt]

The new Version 0.4.0 of mkdocs-glightbox can be fixed by reload_scripts like this:

plugins:
  - glightbox:
      zoomable: true
      draggable: true
      skip_classes:
        - skip-lightbox
  - encryptcontent:
      reload_scripts:
      - '#init-glightbox'

I'll update the documentation on this.