Creating a Tour

The most common use case for Laravel Driver.js is creating a multi-step product tour. Tours guide users through a sequence of features, with navigation buttons to move between steps.

Method Signature

DriverJs::tour(string $name);

or

driverjs(string $name);

Parameters

• $name (string): The tour identifier used for tracking completion. For example, "onboarding", "dashboard-tour", etc.

Example

Using DriverJs::tour():

use RealRashid\LaravelDriverJs\Facades\DriverJs;

DriverJs::tour('onboarding')
    ->showProgress()
    ->step('#header', 'Welcome!', 'This is the main header of your dashboard.')
    ->step('#nav', 'Navigation', 'Use these links to navigate between pages.')
    ->step('#sidebar', 'Sidebar', 'Your tools and shortcuts live here.')
    ->step('#content', 'Content Area', 'This is where your main content appears.')
    ->step('#footer', "That's it!", "You're all set. Let's get started!")
    ->render();

Using the driverjs() helper:

driverjs('onboarding')
    ->showProgress()
    ->step('#header', 'Welcome!', 'This is the header')
    ->step('#nav', 'Navigation', 'Navigate your app')
    ->render();

Details

• The tour() method sets the tour name for completion tracking. When a user completes the tour, the package automatically marks it as completed via an AJAX request.
• The tour name is used as a key in the storage driver (session, cache, or database) to track whether the user has already seen this tour.
• You can check if a tour is completed using DriverJs::tourCompleted('onboarding').
• The @driverjsTour('onboarding') Blade directive will only render the tour if it hasn't been completed yet.

Starting from a Specific Step

You can start a tour from a specific step by passing a step index to the render() method:

DriverJs::tour('onboarding')
    ->step('#header', 'Step 0')
    ->step('#nav', 'Step 1')
    ->step('#content', 'Step 2')
    ->render(1); // Starts from step 1 (Navigation)

Remember to replace the sample values with the actual CSS selectors and descriptions for your application.

That's it! You're now ready to create beautiful product tours using Laravel Driver.js.