Weave Code
Code Weaver
Helps Laravel developers discover, compare, and choose open-source packages. See popularity, security, maintainers, and scores at a glance to make better decisions.
Feedback
Share your thoughts, report bugs, or suggest improvements.
Subject
Message
Filament Tour

Filament Tour Laravel Package

jibaymcs/filament-tour

Add guided tours to Filament panels using Driver.js. Install the FilamentTour plugin, define tours on your pages with the HasTour trait, and build step-by-step onboarding. Optionally show tours only once per user via local storage.

View on GitHub
Deep Wiki
Context7

Let's embed the power of DriverJS to your filament admin panel, and guide peoples through your app

Frequently asked questions about Filament Tour
How do I add a guided tour to my Filament dashboard or page?
Use the `HasTour` trait in your Filament page class and define tours in the `tours()` method. Each tour is built using `Tour::make()` with steps created via `Step::make()`, specifying titles, descriptions, and target elements via CSS selectors.
Which Filament versions does this package support?
The package supports Filament v2 through v5, with separate version branches (e.g., `^5.0` for Filament v5.x). Ensure you install the correct version matching your Filament setup to avoid compatibility issues.
Can I show a tour only once per user?
Yes, the package uses localStorage to track tour visibility by default (`only_visible_once => true`). You can disable this behavior by calling `FilamentTourPlugin::make()->onlyVisibleOnce(false)` in your panel configuration.
How do I trigger a tour dynamically (e.g., after user registration)?
Use Filament’s event system to trigger tours dynamically. Listen for events like `filament-tour::open-tour` or `filament-tour::open-highlight` in your Livewire components or JavaScript to launch tours conditionally.
Is there a way to customize the styling of the tour popups?
Styling is constrained by DriverJS’s default templates, but you can override styles via CSS. Target classes like `filament-tour::tour-overlay` or `filament-tour::next-button` to modify colors, fonts, or positioning to match your design system.
What happens if a user has JavaScript disabled?
Tours rely on JavaScript (DriverJS), so they won’t work without it. Plan for graceful degradation, such as displaying static instructions or a banner indicating tours are unavailable.
Can I define tours in JSON instead of PHP for better maintainability?
The package primarily uses PHP for tour definitions, but you can load JSON files dynamically in the `tours()` method. This approach is useful for static tours (e.g., marketing demos) but requires manual file management.
How do I integrate tour completion tracking with analytics tools?
The package doesn’t include built-in analytics, but you can wrap tour events (e.g., `filament-tour::completed`) in custom JavaScript or PHP logic to send data to tools like Google Analytics or Laravel’s logging system.
Will this package work with Filament’s Livewire components?
Yes, the package is designed to work seamlessly with Livewire. Use Livewire events (e.g., `#[On('filament-tour::loaded-elements')]`) to ensure tours load correctly after dynamic content updates.
What should I do if I encounter issues with Filament v5 upgrades?
Since the package is tied to Filament’s release cycle, ensure you’re using the correct version (e.g., `^5.0` for Filament v5.x). Monitor Filament’s changelog for breaking changes and test the package with minor updates to avoid compatibility issues.
Weaver

How can I help you explore Laravel packages today?

Conversation history is not saved when not logged in.
Prompt
Add packages to context
No packages found.
codraw/framework-extra-bundle
codraw/messenger
codraw/security
codraw/mailer
codraw/contracts
codraw/profiling
codraw/dependency-injection
codraw/tester
codraw/core
nexmo/api-specification
capell-app/block-library
axium/identity
cetria/laravel-dummy-models
cetria/reflection-helper
agropredict/sso-auth-bundle
evolvestudio/spam-protection
datacore/hub-sdk
develia/commons
cuci/prototurk-sdk
cuci/prototurk-sdk-symfony