The lightbox will try to detect the type by parsing an url.

The url can be declared by using the href-attribute of a link. It is also possible to use any other element as a trigger for the lightbox, like a button. Of course we cannot use a href-attribute in this case because that would make our html invalid, so we use a data-bblb-href-attribute. It is namespaced so it will not interfere with other plugins.

<button data-bblb-href="image.png" class="bblb">Image</button>

If a link has both, the href-attribute and the data-bblb-href-attribute, the data-bblb-href-attribute will be used. The advantage is that we can show users without javascript another resource. As an example they see an image on an extra page and users with javascript will see it inside the lightbox.

<a href="image.html" data-bblb-href="image.png" title="my big image" class="bblb">Image</a>

If an url is detected incorrectly, it is possible to force the lightbox to use a certain type.

As an example if we have an image that is dynamically generated by a php-script on the server. The lightbox would assume that it should request the url with ajax. In this case we would have to tell the lightbox which type is correct by setting the data-bblb-force-attribute.

<a href="image.php" title="my generated image" class="bblb" data-bblb-force="image">Image</a>