Skip to content

Provides a sortable image gallery component with a Filament admin interface.

License

Notifications You must be signed in to change notification settings

tjmpromos/sortable-gallery

Repository files navigation

Sortable Gallery banner

Sortable Gallery for Laravel

Latest Version on Packagist GitHub Tests Action Status GitHub Workflow Status Total Downloads

This is a quickly installable, sortable gallery for Laravel applications. Under the hood, it utilizes Filament for managing assets. We default to using Livewire and Alpine.js for interactions and TailwindCSS for styling, but you are welcome to publish the views and change the front end to whatever you desire.

Prerequisites

Ths package uses the following packages and are required to be installed and configured before installing sortable-gallery:

Optional

These packages are not required, but are used by default for styling and interactions in the view. Feel free to roll your own styling and interactions if you wish.

Installation

Via Composer

composer require tjmpromos/sortable-gallery

Getting Started

New Applications

If you aren't currently using Filament, you'll need to run a few commands to get started. We recommend checking out Filament's documentation for installation instructions, but here are the basics just to get you started quickly.

You'll need to migrate some tables into your database to get started. To do this, simply run:

php artisan migrate

Existing Applications

If you are currently using Filament or have a media table, you may run into conflicts while migrating. To help alleviate this issue, we've provided some publishable migrations. You can export them to your database/migrations directory by running:

php artisan vendor:publish --tag=sortable-gallery-migrations

Publishing and Editing The Config File

But first things first! You should probably publish the config file so that you can create your categories. You can do that by running:

php artisan vendor:publish --tag=sortable-gallery-config

This will create config/sortable-gallery.php which will give you a few options such as where you store media, your tag types and the size of your preview images.

media_library

This can be any number of tag types (think of them like categories) that you wish to group your tags into. We utilize them for things like colors, product options, etc...

preview_image_size

This allows you to set the image preview size for displaying on the front end.

Add to your FilamentPHP v3 admin panel

Add the following to your FilamentPHP AdminPanelProvider.php file or the Panel provider file of your choice:

use Tjmpromos\SortableGallery\SortableGalleryPlugin;

class AdminPanelProvider extends PanelProvider
{
ublic function panel(Panel $panel): Panel
    {
        return $panel
            ->default()
            ->id('admin')
            ->path('admin')
             //... other panel config
             ->plugins([
                SortableGalleryPlugin::make(),
            ]);
    }
}

Publishing and Editing the Livewire Component

We use BaguetteBox.js for our lightbox and tried to make the UI as non-intrusive as possible, but you are welcome to use whatever you'd like. You can publish the views and edit the resources/vendor/sortable-gallery/livewire view to use whatever you'd like.

php artisan vendor:publish --tag=sortable-gallery-views

Testing

composer test

Changelog

Please see CHANGELOG for more information on what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Security Vulnerabilities

Please review our security policy on how to report security vulnerabilities.

Credits

License

The MIT License (MIT). Please see License File for more information.