Canvas Support

Lightbox "gallery-item" will not work with isotope on 7.1.1

3 replies · opened Jun 28, 2023

Rrezn8dJun 28, 2023

Lightbox pops up fine when I use data-lightbox="image" but will not work with "gallery" or "gallery-item" if it is in an isotope filter grid.
I have tried this with both javascript load types:

and

This code uses GoHugo templating: https://gohugo.io/

WORKS:


 	 Media Gallery
	
		{{ if (isset .Params "banner") }}
		[
			
				
![attachment](/wmh/img/preview/{{ .Params.banner }})

				
					
						
					
					
				
			
		](/wmh/img/fullsize/{{ .Params.banner }})
		{{ end }}
		{{ range $index, $imgs := .Params.image }}
		[
			
				
![attachment](/wmh/img/preview/{{ . }})

				
					
						
					
					
				
			
		](/wmh/img/fullsize/{{ . }})
		{{ end }}
		{{ range $index, $vids := .Params.video }}
			[
				
					
				
			](https://www.youtube.com/watch?v={{ . }})
		{{ end }}

DOES NOT WORK:


	
		

			
			
				
- [Show All](#)
				
- [1800-1949](#)
				
- [1950](#)
				
- [1960](#)
				
- [1970](#)
				
- [1980-2017](#)
				
- 
					
						Shuffle
					
				
			

			
		
	

	
		{{ range $index, $imgs := .Params.image1800 }}
		[
			
				
![attachment](/wmh/img/preview/newspapers/{{ . }})

				
					
						
					
					
				
			
		](/wmh/img/fullsize/newspapers/{{ . }})
		{{ end }}
		{{ range $index, $imgs := .Params.image1950 }}
		[
			
				
![attachment](/wmh/img/preview/newspapers/{{ . }})

				
					
						
					
					
				
			
		](/wmh/img/fullsize/newspapers/{{ . }})
		{{ end }}
		{{ range $index, $imgs := .Params.image1960 }}
		[
			
				
![attachment](/wmh/img/preview/newspapers/{{ . }})

				
					
						
					
					
				
			
		](/wmh/img/fullsize/newspapers/{{ . }})
		{{ end }}
		{{ range $index, $imgs := .Params.image1970 }}
		[
			
				
![attachment](/wmh/img/preview/newspapers/{{ . }})

				
					
						
					
					
				
			
		](/wmh/img/fullsize/newspapers/{{ . }})
		{{ end }}
		{{ range $index, $imgs := .Params.image1980 }}
		[
			
				
![attachment](/wmh/img/preview/newspapers/{{ . }})

				
					
						
					
					
				
			
		](/wmh/img/fullsize/newspapers/{{ . }})
		{{ end }}
SSemicolon WebSTAFFJun 29, 2023

Hello,

Apologies for the Inconveniences! This is definitely a bug. Consider finding the following code in both js/functions.bundle.js and js/modules/lightbox.js Files:
[ch_pre type="js"]delegate: element.hasClass('grid-container-filterable') ? 'a.grid-lightbox-filtered[data-lightbox="gallery-item"]' : 'a[data-lightbox="gallery-item"]',[/ch_pre]

and replace it with:
[ch_pre type="js"]delegate: 'a[data-lightbox="gallery-item"]',[/ch_pre]

This will definitely fix the issue. We will include this fix in the next update. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Rrezn8dJun 29, 2023

Working perfectly! Thank you.

SSemicolon WebSTAFFJun 30, 2023

Very Happy to Help! :)

Let us know if we can help you with anything else or if you find any further issues.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard