The Custom Design viewer shows images in a custom HTML layout you created. It is built in a way to make it easy to import layouts straight from Adobe Photoshop. All you have to do is use the slice tool in Photoshop to create place holders for your images, save it for web and upload it.
How to create a Custom Design gallery step by step
Open Method [open]
• Lightbox [lightbox] Orders the images in the default image folder ordering.
• Open image in popup window [popup] Orders the images by their file name.
• Open link [link] Orders the images by their title, if there is one.
• Open link in popup window [linkpopup] Orders the images by date putting the newer ones first.
• Do not open [thumbnails] Orders the images by date putting the older ones first.
Titles & Links [titles]
• Show title as text [show] Orders the images in the default image folder ordering.
• Show title as link [link] Orders the images by their file name.
• Show title as link and open in popup window [linkpopup] Orders the images by date putting the newer ones first.
• Do not show title [no] Orders the images by date putting the older ones first.
Keep background of Images [bg_images]
If set, the image of the original slice will be displayed as a background of the place holders for images.
Keep background of Titles [bg_titles]
If set, the image of the original slice will be displayed as a background of the place holders for titles.
Keep background of Page links [bg_pages]
If set, the image of the original slice will be displayed as a background of the place holder for page links.
Keep background of Page counter [bg_pagescounter]
If set, the image of the original slice will be displayed as a background of the place holder for the page counter.
Keep background of Results counter [bg_resultscounter]
If set, the image of the original slice will be displayed as a background of the place holder for the results counter.
Hide overflow of Titles [ho_titles]
If set, the overflowed content of the image titles will be hidden.
Hide overflow of Page links [ho_pages]
If set, the overflowed content of the page links will be hidden.
Hide overflow of Page counter [ho_pagescounter]
If set, the overflowed content of the page counter will be hidden.
Hide overflow of Results counter [ho_resultscounter]
If set, the overflowed content of the results counter will be hidden.
CSS File [css_file]
A CSS file to be loaded with the gallery.
Example: images/stories/my_css_file.css
CSS class for Images [cl_images]
Sets the CSS class for place holders when an image exists.
CSS class for Empty images [cl_no_images]
Sets the CSS class for place holders when an image does not exists.
CSS class for Titles [cl_titles]
Sets the CSS class for place holders when a title exists.
CSS class for Empty titles [cl_no_titles]
Sets the CSS class for place holders when a title does not exists.
CSS class for Page links [cl_pages]
Sets the CSS class for place holders for page links when more than one pages exist.
CSS class for Empty page links [cl_no_pages]
Sets the CSS class for place holders for page links when there is just one page.
CSS class for Page counter [cl_pagescounter]
Sets the CSS class for place holders for the page counter when more than one pages exist.
CSS class for Empty page counter [cl_no_pagescounter]
Sets the CSS class for place holders for the page counter when there is just one page.
CSS class for Results counter [cl_resultscounter]
Sets the CSS class for place holders for the results counter when more than one pages exist.
CSS class for Empty results counter [cl_no_resultscounter]
Sets the CSS class for place holders for the results counts when there is just one page.