Setup

1. First migrate table

It is necessary for saving rules on pages

./yii migrate --migrationPath=@vendor/matejch/yii2-page-guide/src/migrations

2. Add to modules in your web.php

'pageGuide' => [
    'class' => \matejch\pageGuide\PageGuide::class,
]

3. Add widget on pages you want to use page guide on

By default, it is rendered in place you put widget on

 <?= \matejch\pageGuide\widget\PageAssist::widget() ?>

You can adjust postion of widget by setting btnPositionCss

<?= \matejch\pageGuide\widget\PageAssist::widget(['btnPositionCss' => 'position: fixed;top: 100px;right: -2px;']) ?>

4. Additional intro options from intro.js library

If you want you can add intro.js option into widget with attribute introOptions

More options here intro.js

Example with progress bar

<?= \matejch\pageGuide\widget\PageAssist::widget(['introOptions' => ['showProgress' => true] ]) ?>

5. Selectors options, when creating guide

You can set selectors option in widget that takes array of css selectors

Example

<?= \matejch\pageGuide\widget\PageAssist::widget(['selectors' => ['.form-group','.float-left','#name']]) ?>

If no selectors are set, widget attempts to find important elements, in following way:

1. inputs input:not([type=hidden])
2. if form is on page then also .form-group elements are selected