/laravel-responsive-gallery

Add Pinterest like Responsive Galleries in your PHP / Laravel application.

Primary LanguagePHPMIT LicenseMIT

Latest Stable Version Build Status StyleCI Quality Score Coverage Status GitHub last commit

Laravel Responsive Gallery 🏞

A PHP library to create responsive galleries that are organized into Pinterest like columns.
To generate the grid is used Bricklayer.js. To open the image in a popup is used Fancybox 3.

The snippet

The library replace all the occurrences of this kind of snippet

{# gallery src=[holiday_images/london] column_width=[250] gutter=[20] #}

With the HTML code of a responsive gallery.

<div class='responsiveGallery bricklayer' data-column-width="250" data-gutter="20">
    <div class='box'>
        <a href='gallery/holidays/IMG_1584.jpg' data-fancybox='images' data-caption=''>
            <img src='gallery/holidays/thumb/IMG_1584.jpg' />
        </a>
    </div>
    <div class='box'>
        <a href='gallery/holidays/IMG_1244.jpg' data-fancybox='images' data-caption=''>
            <img src='gallery/holidays/thumb/IMG_1244.jpg' />
        </a>
    </div>
    ...
</div>

The images data management interface (optional)

Trough this interface you can specify for each image:

  • the alt text
  • the description shown below the fancy box when the user click on the thumbnail
  • a youtube or vimeo link (in this case a play icon will be show above the image and clicking on it will open a fancybox showing the related video)

Once you have published the views in your Laravel application, you can access to the images management interface at this address www.yourwebsite.com/responsive-gallery/

The snippet works also without using the images data management interface.

How to use it

Read Tutorial and Documentation →

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

License

MIT