In this quick start tutorial, you will learn how to setup a basic gallery. You need to have basic html knowledge. Prepare your favor text edit tool such as TextEdit in Mac or  Dreamweaver. Then, follow the step below to build your gallery.
1. Unzip the product.
2. Copy the “lib” folder into your project directory
3. Prepare the image you want to appear in the gallery and place inside a sub folder in your project directory.
4. Add a tag where you want to add the gallery and add a id. And set the width and height.
<div id="gallery_1" style="width:400px;height:300px;"></div>
5. Paste follow code in the html file which you want to include the gallery between the <head> Â tag.
<!------------- START COPY -------------> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script> <script src="lib/dc.core.min.js" type="text/javascript"></script> <script src="lib/dc.polaroidgallery.1.0.js" type="text/javascript"></script> <link rel="stylesheet" href="lib/dc.polaroidgallery.1.0.css" type="text/css" media="screen" /> <link rel="stylesheet" href="lib/theme.css" type="text/css" media="screen" /> <!------------- END COPY --------------->
<script type="text/javascript">
$(document).ready(function() {
var album_array=[
{ source:'albums/large/o1.jpg',
thumbnail:'albums/thumb/o1.jpg',
title:'Title 1','description':'description.',category:'Album 1'},
{ source:'albums/large/o2.jpg',
thumbnail:'albums/thumb/o2.jpg',
title:'Title 2','description':'description.',category:'Album 1'},
{ source:'albums/large/o3.jpg',
thumbnail:'albums/thumb/o3.jpg',
title:'Title 3','description':'description.',category:'Album 2'}
];
// Create a gallery with default settings
$('#gallery_1').DCPolaroidGallery({
source:album_array
});
});
</script>
6. Now, you can test the gallery by open the html in your browser.
* The download product included a basic gallery inside the examples folder. You can edit the index.html.
