Hash
lightGallery hash plugin allows you create unique url for each gallery images. You can provide custom names for each slides too. If you have multiple galleries on a page, you have to provide unique id for each gallery via galleryId setting.
Demo
HTML Structure
<div id="gallery-hash-demo">
<a href="img/img1.jpg">
<img src="img/thumb1.jpg" />
</a>
<a href="img/img2.jpg">
<img src="img/thumb2.jpg" />
</a>
...
</div>
JavaScript
lightGallery(document.getElementById('gallery-hash-demo'));
// if You have multiple galleries on same page you have to set unique id for each gallery.
/*
lightGallery(document.getElementById('gallery-hash-demo-2'), {
galleryId: 2
});
lightGallery(document.getElementById('gallery-hash-demo-3'), {
galleryId: 3
});
*/
Custom slide name
You can provide custom slide names for each slide by providing slide name via
data-slide-name attribute or slideName if you are using dynamic mode.
HTML Structure
<div id="gallery-hash-demo">
<a href="img/img1.jpg" data-slide-name="fading-light">
<img src="img/thumb1.jpg" />
</a>
<a href="img/img2.jpg" data-slide-name="Bowness Bay">
<img src="img/thumb2.jpg" />
</a>
...
</div>
JavaScript
lightGallery(document.getElementById('gallery-hash-demo'), {
customSlideName: true,
});