I couldn't yet include a proper API documentation to the YiiBooster site, I hope that with this simple tutorial I could solve the issues regarding the use of the bootstrap gallery on your projects.
In order to use it, we need to first prepare our views. This tutorial assumes that you are using YiiBooster and that
bootstrap.css has been already included.
Register Bootstrap Gallery Image CSS ¶
We register bootstrap css assets via the
Render Provided View ¶
In order to easy the job of fellow developers, we have included the required template for the gallery to display correctly. You can change it at will by following the instructions provided at the plugin docs.
// assuming we are on a view $this->renderPartial('bootstrap.views.gallery.preview');
Register Required Scripts ¶
As with the css assets, we have also provided
Initialize the Image Gallery widget by adding the following data-attributes to a container element containing a set of links to image files with the attribute
<div id="gallery" data-toggle="modal-gallery" data-target="#modal-gallery" data-filter="*" > <a href="http://placekitten.com/500/500" title="kitten" rel="gallery"> <img src="http://placekitten.com/250/250" rel="list-gallery" /> </a> </div>
Final Notes ¶
I truly hope to have the proper API documentation as soon as possible, in order to solve all the doubts that arise about the widgets provided with YiiBooster.