https://github.com/sjmc11/tourguide-js

TourGuide is a Javascript library for creating user tours and on-boarding steps for your apps.
https://github.com/sjmc11/tourguide-js

onboarding tour tourguide ui user-experience user-onboarding walkthrough

Last synced: about 1 month ago
JSON representation

TourGuide is a Javascript library for creating user tours and on-boarding steps for your apps.

• Host: GitHub
• URL: https://github.com/sjmc11/tourguide-js
• Owner: sjmc11
• License: mit
• Created: 2022-11-11T15:56:40.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-03-16T11:26:57.000Z (4 months ago)
• Last Synced: 2024-05-16T19:41:25.085Z (about 2 months ago)
• Topics: onboarding, tour, tourguide, ui, user-experience, user-onboarding, walkthrough
• Language: TypeScript
• Homepage: https://tourguidejs.com
• Size: 328 KB
• Stars: 548
• Watchers: 5
• Forks: 24
• Open Issues: 4
• Metadata Files:
  • Readme: readme.md
  • License: LICENSE

Lists

• awesome - sjmc11/tourguide-js - TourGuide is a Javascript library for creating user tours and on-boarding steps for your apps. (TypeScript)
• awesome-list - sjmc11/tourguide-js - TourGuide is a Javascript library for creating user tours and on-boarding steps for your apps. (TypeScript)
• awesome-stars - sjmc11/tourguide-js - TourGuide is a Javascript library for creating user tours and on-boarding steps for your apps. (TypeScript)

README

        






TourGuide JS



Intuitive and customisable tours for user application onboarding




Explore the docs »



----







## QuickStart

### Installation

```

npm i @sjmc11/tourguidejs

```

### Usage

Include the tourGuide script and style in your project. A CDN method is supported.

```

// Style

import "@sjmc11/tourguidejs/src/scss/tour.scss"

// JS

import {TourGuideClient} from "@sjmc11/tourguidejs/src/Tour"

```

### Declare steps

Add the [data-tg-tour] attribute to elements that you want to include in your tour. This attribute should contain the relevant text for the tour guide step.

```