Gallery

Galleirs use .ol-grid
class
<div class="ol-grid grid col-4 ol-lightbox-gallery with-gutter">
<a href="../../assets/img/portfolio/01.jpg" class="grid-item ol-lightbox">
<div class="gi-wrapper ol-hover hover-1">
<div class="img-layer set-bg"><img src="../../assets/img/portfolio/01.jpg" alt="portfolio item"></div>
<div class="ol-overlay ov-dark-alpha-80"></div>
<div class="icons"><i class="oli oli-camera2"></i></div>
</div>
</a>
...
</div>
.col-4
means that this grid is a 4-column oneAlso you can use
.col-1
,.col-2
,.col-3
,.col-4
,.col-5
.with-gutter
add the gutter between images
.ratio-2
.ratio-2
This makes images to fit the ratio of 70% height to width
<a href="../../assets/img/portfolio/01.jpg" class="grid-item ol-lightbox ratio-2">

.ratio-3
.ratio-3
This makes images to fit the ratio of 200% height to width
<a href="../../assets/img/portfolio/01.jpg" class="grid-item ol-lightbox ratio-3">

Last updated