Galleries

Overview
Galleries allow a series of images to be linked as a set, with each image being viewable in a modal window.

The thumbnails can be linked from any image or other blocklink/thumbnail/overlay style.

Example
WCMS use

Click component (found on the home tab) and select Add here where you want to add your new overlay.

Choose Link grid (x column). Select the first rendering and choose Add here. Choose Overlay image or Tile image

Select existing image (the page it’s linking too). Select OK.

Select the blank image and choose an image icon. The media library will open.

Find your image. OK.

Tip: If one image or link is incorrect it’s best to start again and make sure the image is attached to the page in the Link image field first and then recreate the Link grid and overlay.

MVC.net use
Code
Video

<ul class="row scale-images">
<li class="three columns">
	<a rel="gallery-two" class="thumbnail colorbox" href="img.jpg" title="Image One">
		<img src="small-img.jpg"/>
		<h3 class="caption">Image One</h3>
	</a>
</li>
<li class="three columns">
	<a rel="gallery-two" class="thumbnail colorbox" href="img.jpg" title="Image Two">
		<img src="small-img.jpg"/>
		<h3 class="caption">Image Two</h3>
	</a>
</li>
<li class="three columns">
	<a rel="gallery-two" class="thumbnail colorbox" href="img.jpg" title="Image Three">
		<img src="small-img.jpg"/>
		<h3 class="caption">Image Three</h3>
	</a>
</li>
<li class="three columns">
	<a rel="gallery-two" class="thumbnail colorbox" href="img.jpg" title="Image Four">
		<img src="small-img.jpg"/>
		<h3 class="caption">Image Four</h3>
	</a>
</li>
</ul>	
Version and status
  • 1
  • current version
  • Concept