English | Español | Deutsch | Francais



Beispiele

Generated Gallery


Download


Code

append to head (between your <head> tags):
		
		<!-- ****** append stylesheet of gambarize ****** -->
		<link rel="stylesheet" href="http://gambarize.klickagent.ch/cdn/0.3/style/gambarize.css.php?noreset=1" type="text/css" media="all" /> 
		
		
		<!-- ****** init gambarize scripts ****** -->
		<script type="text/javascript">
		
			<!-- fuckin IE 8 bugfix -->
			window.gambarize_instance='';
						
		

		window.onload = function(){	
			gambarize_instance = new gambarize();	
			gambarize_instance.init({
				
				imgnavigation: 'scale,title,close,download',
				
				baseSelector: {
					'content': { 'parentElement': '#gambarize_content', 'element': 'a.' }
				},
				
				content: { 
					source: 'a',
					selector: 'gmbz',
					
					loadInDiv: 'gallery'
				}
											
			});
		}
</script>

append to body (between your <body> tags):
		 <!-- ****** adding content ****** -->
		 
		 
	<div id="gambarize_content">
	
			<!-- /*************************************/ -->
			<!-- creating an album, with a coverpicture: -->
			<!-- /*************************************/ -->
			
			<a href="data/album_tree/holidays/field.jpg" rel="our nice Holidays" data-album-id="holidays" data-album-fullparentid="" class="gmbz coveronly"></a>
			
			
			<!-- /******************************************/ -->
			<!-- creating an album, with random coverpicture: -->
			<!-- and adding custom navigation to pictures	  -->
			<!-- /******************************************/ -->
			
			
			<a href="data/album_tree/holidays/field.jpg" rel="2012" data-img-nav="nav,scale,random,title,info,close" data-album-id="2012" data-album-fullparentid="holidays" class="gmbz"></a>
			
			<a href="data/album_tree/holidays/water/sunsets/sunset.jpg" title="Sunset on the beach in Java" rel="2012" data-img-nav="nav,scale,random,title,info,close" data-album-id="2012" data-album-fullparentid="holidays" class="gmbz"></a>
			
			
			<!-- /***********************************************/ -->
			<!-- creating an album, which only contains subalbums: -->
			<!-- /***********************************************/ -->
			<a rel="2013" data-album-id="2013" data-album-fullparentid="holidays" data-type="album" class="gmbz"></a>
			
			
			<a href="data/album_tree/holidays/mountains/mountains.jpg" rel="mountains" data-album-id="mountains" data-album-fullparentid="holidays2013" class="gmbz"></a>
			
			<!-- /**********************************/ -->
			<!-- setting a specific picture as cover: -->
			<!-- /**********************************/ -->
			
			<!-- enable downloadable -->
			<a href="data/album_tree/holidays/water/sea.jpg" rel="Water Pictures" data-album-id="water" data-album-fullparentid="holidays2013" class="gmbz cover downloadable"></a>
			
			<!-- using other thumb source, specify download image, specify hres image -->
			<a href="data/album_tree/holidays/water/wave.jpg" rel="Water Pictures" data-album-id="water" data-album-fullparentid="holidays2013" class="gmbz" data-img-thumbsrc="data/album_simple/_meta/thumb_wave.png" data-img-download="data/album_simple/_meta/specials/wave_download.jpg" data-img-hres="data/album_simple/_meta/specials/wave_hres.jpg"></a>
	</div>	
	
	<div id="gallery">
		loading gallery...
	</div>
	    
	    
	    
		<!-- ****** adding gambarize scripts ***** -->
		<!-- add jquery, if not already loaded somewhere else on your website: -->
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
			
		<!-- add the cdn/0.3 of gambarize plugin -->
		<script src="http://gambarize.klickagent.ch/cdn/0.3/js/gambarize.js" type="text/javascript"></script>