Download the PHP package jibaymcs/filament-tour without Composer
On this page you can find all versions of the php package jibaymcs/filament-tour. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download jibaymcs/filament-tour
More information about jibaymcs/filament-tour
Files in jibaymcs/filament-tour
Package filament-tour
Short Description Bring the power of DriverJs to your Filament panels and start a tour !
License MIT
Homepage https://github.com/jibaymcs/filament-tour
Informations about the package filament-tour
Bring the power of DriverJs to your Filament panels and start a tour !
Due to a heavy workload, I'm unable to continue fixing and improving Filament-Tour.
But if you feel like patching it, modifying it or rewriting it, don't hesitate to contribute to the project!
With the power of DriverJS bring to your users an elegant way to discover your panels !
Installation
You can install this filament plugin via composer:
For Filament V3.x
For Filament V2.x
You can publish the config file with:
Optionally, you can publish the views using
This is the contents of the published config file:
Usage
You can also enable or disable the check on the local storage if the current user have already seen the tour.
Start a tour !
Let's follow this example to add a tour to your dashboard page.
If you don't already have a customized dashboard, please refer to the following tutorial: FIlamentPHP - Dashboard - Customizing the dashboard page
Use the correct trait to registers your tours !
Create a simple tour !
Displaying your tour !
In order to display your tour, its important to remember to pass in the route for the given path you'd like to have the tour show up on - if you'd like to render the tour on the main admin panels dashboard, set the route to:
Alternatively, you may want to show tours based on more complex logic, for example if a user hasn't created a specific
type of content. In order to show a tour you will need to create an event listener in your livewire component.
Continuing with the Dashboard example, let's show a tour only if the user hasn't created a new Post yet. We can write
a query to see if the user has no posts, and if so, fire an open-tour
event to show the Tour:
You can also bring up tours for users when they click on a button. See more in the (Event)[#events] section.
Create a JSON tour !
- From a direct URL
- From your Storage
[!IMPORTANT]
UsingTour::make(url: "")
orTour::make(json: "")
is the same thing, so don't worry about the name of your parameter if you've got the wrong type.
BUT
If you useTour::make('my-tour')
it's equal toTour::make(id: 'my-tour')
And here you need to construct all your steps. No JSON reading here.
JSON Example file (click to expand) or Github Gist Link
Tour.php
Tour methods reference
Step.php
Step methods reference
Highlights
Same as tour, use the correct trait !
-
Use the correct trait to registers your highlights !
- Create a simple highlight element !
Highlight.php
Highlight methods reference
Events
Available events:
filament-tour::open-highlight
string id
Open a specific highlight by its id.
filament-tour::open-tour
string id
Open a specific tour by its id.
Filament Tour, dispatch some event to show tours and highlights. So you can trigger them from your own code.
Basically, if you want a custom button to trigger a tour or a highlight, you can do something like this:
ℹ️
Don't forget to prefix your event withfilament-tour::
to trigger the correct event.
Development Tool
[!IMPORTANT]
This tool is always disabled in production mode.APP_ENV=production
Filament Tour embed a simple tool to help you to develop your tours and highlights.
Let me show you how to use it !
Enable the tool
To enable the tool, simply use FilamentTourPlugin::make()->enableCssSelector()
in your plugin declaration.
Keyboard shortcuts
Ctrl|Cmd + Space To open the tool.
Escape To exit the tool.
Ctrl|Cmd + C To copy the CSS Selector of the highlighted element.
CSS Selector Tool Utilisation Preview
Extra Resources
DriverJS
- DriverJS Website
- DriverJS GitHub (Give some 🩵 to the author !)
The core of this plugin !
Don't hesitate to check the documentation to learn more about the possibilities of this plugin.
I don't implemented all the features of DriverJS, at this time, but I'm working on it !
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.
All versions of filament-tour with dependencies
filament/filament Version ^3.0
spatie/laravel-package-tools Version ^1.15.0
illuminate/contracts Version ^10.0|^11.0