Fancybox integration in ghost3

Hi,

I have a self hosted ghost 3.12.1 in docker running.

I try to setup fancybox according to

I encountered some minor questions.

  1. https://www.wdiaz.org/how-to-integrate-fancybox-3-on-ghost/ says there is file
    /content/themes/casper/assets/js/index.js (Using Markdown and javascript)
    There is no such file in my environment.

I find in my environment:
gallery-card.js infinite-scroll.js jquery.fancybox.min.js lib sticky-nav-title.js

As a solution I choose Code Injection. But: What is when I upgrade my ghost version?
Do I have to care manually regarding this code injection snippets?

  1. Is it possible to assign “alt” HTML-properties for in a gallery? It is possible for normal images (not gallery). fancybox uses the alt-property for the caption of the images. Currently the images in a gallery get a value “undefined”.

Does FancyBox work when using it inside the code injection area? If so then you should be fine and that should continue to work.

You can add alt attributes to your gallery images in the following method:

  1. Add all your gallery images as single images
  2. Select each image and click the “ALT” button to enter your alt text
  3. Drag each image ontop of each other to combine them into a gallery
  4. Done :white_check_mark:

Do you mean in step 3 a gallery magically is created when on image is dragged on top of each other?
Does not work in chrome and firefox…
Or do I have to create an empty gallery and to drag the (tagged) images into this area? Does also not work.
I’m on linux could this cause a browser problem?
BTW is it simply possible to edit the source code? That would be an easy possibility.

I close this, because fancybox works with ghost3. The open question is: How to give images in gallery a “alt”-property. But I will open a new question for this.

Okay, found a workaround here:

If you drag images out of a gallery then you can set their alt text then drag the images back into the gallery, the alt text will be kept.

But this really not a good solution just something that works when you know how to trick it.