WHY SMARTY?

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas metus nulla, commodo a sodales sed, dignissim pretium nunc. Nam et lacus neque. Ut enim massa, sodales tempor convallis et, iaculis ac massa.

RECENTLY VISITED
CONTACT INFO
  • Address: PO Box 21132, Here Weare St,
    Melbourne, Vivas 2355 Australia
  • Phone: 1-800-565-2390
  • Email: support@yourname.com

GALLERIES

  1. Home
  2. Shortcodes
  3. Galleries

Masonry Gallery 2 Columns

... ... ... ... ...
Show Code 
<div class="masonry-gallery columns-2 clearfix lightbox" data-img-big="3" data-plugin-options='{"delegate": "a", "gallery": {"enabled": true}}'>

	<a class="image-hover" href="assets/images/demo/1200x800/10-min.jpg">
		<img src="assets/images/demo/600x400/10-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/11-min.jpg">
		<img src="assets/images/demo/600x400/11-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/36-min.jpg">
		<img src="assets/images/demo/1200x800/36-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/13-min.jpg">
		<img src="assets/images/demo/600x400/13-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/14-min.jpg">
		<img src="assets/images/demo/600x400/14-min.jpg" alt="...">
	</a>

</div>

Masonry Gallery 3 Columns

... ... ... ... ... ...
Show Code 
<div class="masonry-gallery columns-3 clearfix lightbox" data-img-big="2" data-plugin-options='{"delegate": "a", "gallery": {"enabled": true}}'>

	<a class="image-hover" href="assets/images/demo/1200x800/4-min.jpg">
		<img src="assets/images/demo/600x400/4-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/5-min.jpg">
		<img src="assets/images/demo/1200x800/5-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/6-min.jpg">
		<img src="assets/images/demo/600x400/6-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/7-min.jpg">
		<img src="assets/images/demo/600x400/7-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/8-min.jpg">
		<img src="assets/images/demo/600x400/8-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/9-min.jpg">
		<img src="assets/images/demo/600x400/9-min.jpg" alt="...">
	</a>

</div>

Masonry Gallery 4 Columns

... ... ... ... ... ... ... ... ...
Show Code 
<div class="masonry-gallery columns-4 clearfix lightbox" data-img-big="4" data-plugin-options='{"delegate": "a", "gallery": {"enabled": true}}'>

	<a class="image-hover" href="assets/images/demo/1200x800/15-min.jpg">
		<img src="assets/images/demo/600x400/15-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/16-min.jpg">
		<img src="assets/images/demo/600x400/16-min.jpg" alt="...">
	</a>

	<av href="assets/images/demo/1200x800/17-min.jpg">
		<img src="assets/images/demo/600x400/17-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/18-min.jpg">
		<img src="assets/images/demo/600x400/18-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/20-min.jpg">
		<img src="assets/images/demo/600x400/20-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/19-min.jpg">
		<img src="assets/images/demo/600x400/19-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/21-min.jpg">
		<img src="assets/images/demo/600x400/21-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/22-min.jpg">
		<img src="assets/images/demo/600x400/22-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/23-min.jpg">
		<img src="assets/images/demo/600x400/23-min.jpg" alt="...">
	</a>

</div>

Masonry Gallery 5 Columns

... ... ... ... ... ... ... ... ... ... ... ...
Show Code 
<div class="masonry-gallery columns-5 clearfix lightbox" data-img-big="1" data-plugin-options='{"delegate": "a", "gallery": {"enabled": true}}'>

	<a class="image-hover" href="assets/images/demo/1200x800/24-min.jpg">
		<img src="assets/images/demo/600x400/24-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/25-min.jpg">
		<img src="assets/images/demo/600x400/25-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/26-min.jpg">
		<img src="assets/images/demo/600x400/26-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/27-min.jpg">
		<img src="assets/images/demo/600x400/27-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/28-min.jpg">
		<img src="assets/images/demo/600x400/28-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/29-min.jpg">
		<img src="assets/images/demo/600x400/29-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/30-min.jpg">
		<img src="assets/images/demo/600x400/30-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/31-min.jpg">
		<img src="assets/images/demo/600x400/31-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/32-min.jpg">
		<img src="assets/images/demo/600x400/32-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/33-min.jpg">
		<img src="assets/images/demo/600x400/33-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/34-min.jpg">
		<img src="assets/images/demo/600x400/34-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/35-min.jpg">
		<img src="assets/images/demo/600x400/35-min.jpg" alt="...">
	</a>

</div>

Masonry Gallery 6 Columns

... ... ... ... ... ... ... ... ... ... ... ... ... ... ...
Show Code 
<div class="masonry-gallery columns-6 clearfix lightbox" data-img-big="3" data-plugin-options='{"delegate": "a", "gallery": {"enabled": true}}'>

	<a class="image-hover" href="assets/images/demo/1200x800/4-min.jpg">
		<img src="assets/images/demo/600x400/4-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/5-min.jpg">
		<img src="assets/images/demo/600x400/5-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/6-min.jpg">
		<img src="assets/images/demo/600x400/6-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/7-min.jpg">
		<img src="assets/images/demo/600x400/7-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/8-min.jpg">
		<img src="assets/images/demo/600x400/8-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/19-min.jpg">
		<img src="assets/images/demo/600x400/19-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/21-min.jpg">
		<img src="assets/images/demo/600x400/21-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/22-min.jpg">
		<img src="assets/images/demo/600x400/22-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/9-min.jpg">
		<img src="assets/images/demo/600x400/9-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/15-min.jpg">
		<img src="assets/images/demo/600x400/15-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/16-min.jpg">
		<img src="assets/images/demo/600x400/16-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/17-min.jpg">
		<img src="assets/images/demo/600x400/17-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/18-min.jpg">
		<img src="assets/images/demo/600x400/18-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/20-min.jpg">
		<img src="assets/images/demo/600x400/20-min.jpg" alt="...">
	</a>

	<a class="image-hover" href="assets/images/demo/1200x800/23-min.jpg">
		<img src="assets/images/demo/600x400/23-min.jpg" alt="...">
	</a>

</div>