Fancybox integration in ghost3

[beethomas]

Hi,

I have a self hosted ghost 3.12.1 in docker running.

I try to setup fancybox according to

How to integrate FancyBox 3 on Ghost

I encountered some minor questions.

1. 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?

2. 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”.

[DavidDarnes]

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

[beethomas]

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.

[beethomas]

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.

[beethomas]

Okay, found a workaround here:

How to add gallery alt text to images?

I will respond in support of @eidolem & @tippingpints request here. Every image should have its own alt tag. This is a core concept of Google’s SEO standards. Alt text (text that describes an image) improves accessibility for people who can’t see images on web pages, including users who use screen readers or have low-bandwidth connections. Google uses alt text along with computer vision algorithms and the contents of the page to understand the subject matter of the image. Also, alt text in i…

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.