Using Bibble Web Galleries |
Top
Previous
Next
Learn more at BibbleLabs.com |
Bibble Pro and Bibble Lite allow you to simply and quickly share your images by creating Web Galleries to display your images. These Galleries can be edited like any other Web Page using an HTML editor, and are fully customizable using CSS Style Sheets to control colors and fonts. There are three Gallery Styles available and a view of the Full Image page included with all three styles. The styles are:
The Galleries created by Bibble offer navigation by mouse-clicks, like any other web gallery, and also allow navigation by using the keyboard. When viewing your Gallery using a Web Browser, the use the following keys to speed you through your images: From Gallery Index pages:
From Single Image pages:
The image name under thumbnail images will show the IPTC Image Name if this has been defined, and if not the filename will be displayed. The image caption under preview images will show the IPTC Caption if this has been defined, and if not the filename will be displayed. On the Full Image Page, the Title is set to IPTC Image Name if it is defined, and filename otherwise. The IPTC Caption is shown with basic EXIF shooting information at the bottom of the page.
The pages that make up the web gallery are standard HTML, CSS, and Javascript files. After a Web Gallery has been created by a Web Gallery Batch, you may customize these pages using a Text Editor (like Wordpad or TextEdit). Changes to the CSS file will allow you to customize the fonts, colors, and layout of the various pages and items within your web gallery, and the changes you make will not be overwritten if you add more images to this gallery in a later Batch conversion. There is a brief description of the CSS selectors documented within the style.css file. Changes to index.html will, however, be overwritten during subsequent Batch Conversions. The style of the gallery is determined by the "style" javascript variable in the index.html file, found towards the bottom of the file, that appears as: var style = 3; You can change this to 1 for Columns, 2 for Single Row, or 3 for Grid styles. Editing other javascript items is discouraged and not supported. |