Thanks a lot!
Where shall I place this code snippet? There where we put the Rich text? I would like to see a video tutorial of this, so I can see how to do this.
I don’t think you need a video tutorial for that.
Just mouseover the page where you have the rich text stuff with the images to reveal the settings icon, then go to the bottom and paste in the code in the bottom custom code field.
It don’t work for me?
Another option is to display the Alt text from the multi-reference field images in a caption.
I think it is better you got my share link so you see my problem.
Link isn’t working… 404 page.
Ok. Strange
I have here a new one
Where did you try to add the code?
I put it here
Seems like jquery isn’t initialized. Try this (remember to add some images to the rich text field):
<script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
<script>
$(document).ready(function() {
$('.w-richtext figure img').each(function() {
$(this).parent().css({cursor: 'pointer'}).attr('data-fancybox', 'gallery').attr('data-src', this.src);
});
$("[data-fancybox]").fancybox({
clickContent : false
})});
</script>
it won’t work either?
here is the link (I have put 3 images below the code.
Here is a new share link
Code below uses class names for the elements as per screen shot.
<script>
let items = Array.from(document.getElementsByClassName('multi-image-div'));
items.forEach( function(item) {
item.getElementsByClassName('label')[0].innerText = item.getElementsByClassName('multi-image')[0].alt;
});
</script>
Code goes into the page settings as per earlier screenshots, not into the rich text field.
And it works just fine here?
1: You need a rich text field somewhere that will contain the images you wish to show. Like you already have. That’s all you need. No image sections or anything like that. This rich text field can have text as well, no problem.
2: Code goes into the page settings. Not a code embed on the page. In my earlier comment you can see where that is.
3: Add images to the rich text field. On your live site you’ve already done this and they are clickable and in a gallery: https://mynd-fo-8f7f7d97acc4aa58cfb94520a946374.webflow.io/listafolk/eli-smith
So I have to put the code here, - and 50 times?