Using Lightbox with iShare Lite

Owned by Kim Stimpson
Last updated: 27 Apr, 2017
1 min read

After you have configured your iShare Lite html then this can be included in your html to display the map in Lightbox e.g.

Example
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
	<head>
		<title>iShare - Lite [ lightbox ]</title>
	</head>
	<body style="font-size: 75.0%;">
		
		<link rel="stylesheet" href="http://www.no-margin-for-errors.com/wp-content/themes/NMFE/css/prettyPhoto.css" type="text/css" media="screen" />
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
		<script src="http://www.no-margin-for-errors.com/wp-content/themes/NMFE/js/jquery.prettyPhoto.js" type="text/javascript"></script>
		<script type="text/javascript" charset="utf-8">$(function(){ $("#atIshareLite").prettyPhoto();});</script>
		<style>.pp_description,.pp_social,.pp_description{display:none !important;}</style>
		
		<a id="atIshareLite" href="atLiteMap.html?iframe=true&width=320&height=340" rel="prettyPhoto[iframes]" title="iShareLite">Open iShareLite in lightBox</a>
		
	</body>
</html>

Where the href="atLiteMap.html is your iShare Lite page as defined in the iShare Lite Map Example code.