Simple Tour Guide

datlechin

Simple Tour Guide

The Simple Tour Guide extension provides an intuitive, step-by-step tour to introduce users to your forum's features, enhancing their engagement and understanding.

Simple Tour Guide

Key Features

Interactive Tour: Seamlessly guides users through essential forum functionalities.
Onboarding Support: Simplifies the onboarding process for new users, facilitating quick platform familiarization.
Customizable Steps: Tailor the tour to highlight unique forum features and sections.
Engagement Boost: Encourages user interaction and participation within the community.

Admin
Admin

Installation

Install with composer:

composer require datlechin/flarum-simple-tour-guide:"*"

Updating

composer require datlechin/flarum-simple-tour-guide:"*"
php flarum migrate
php flarum cache:clear

Support and Donation

If you find this extension helpful and would like to support its development, you can contribute by sponsoring this project sponsors/datlechin.

Your support is greatly appreciated and helps in further enhancing and maintaining this extension for the Flarum community.

luceos

datlechin Your support is greatly appreciated and helps in further enhancing and maintaining this extension for the Flarum community.

Because you have been such a consistent contributor to our ecosystem, I just donated $ 100 to your GitHub sponsors on behalf of the Flarum core team. Thank you for all your hard work.

datlechin

luceos wow, that's a lot for me. Thank you very much 😍

Litalino

wow very good

Litalino

@datlechin Suggestion: Should choose better for customers

or create additional admin options for users or customers

const user = app.session.user;

if (!user || user.attribute('tourGuideDismissedAt')) {
  return;
}

Check out flarum.it's use of the noTutorialBefore cookie for customers

DEMO Customers: https://flarum.khatvongsong.vn/ if login not show Simple Tour Guide

Litalino

@datlechin How do I contact you? .. Are you Vietnamese like me?

datlechin

Litalino you can contact me via discord ngoquocdat#4414 or telegram https://t.me/datngoquoc

Teddan

It seems very useful!!

Litalino

@datlechin
->serializeToForum('datlechin-simple-tour-guide.allowDismiss', 'datlechin-simple-tour-guide.allow_dismiss', 'boolval')

reply
->serializeToForum('datlechin-simple-tour-guide.allowClose', 'datlechin-simple-tour-guide.allow_close', 'boolval')

Allow close: new effective

Xkyer

@datlechin keep doing useful extensions. Thank you.

Wlork

Very interesting extension ! Thank you !

Question @datlechin : This guide is only for home page ? Or it can be integrated into a discussion page too ? 🙂

datlechin

Wlork Yeah, I throught about it. I'll try to add an option to the step to show on which page.

tolgaaaltas

datlechin I haven't tried yet but I think when I add composer elements into the guide, it should automatically open composer. For example, I want to add how to select a tag for a new discussion first step selecting the tag button the second step is primary tags in the popup, and the third step is secondary tags. As I said, I haven't tried yet but I think this is hard to make.

Can we automatically trigger the composer like this?

adbo

datlechin Seconding this, would be amazing to be able to show some navigation on the index then automatically navigate the user to a tag to show off some of the discussions page features too

datlechin

tolgaaaltas Great idea! However, triggering an element, like opening the composer or navigating to other pages during the tour guide, might interrupt the flow of the tour or potentially break it.
Nevertheless, I'll explore this idea further to see if it's feasible within the tour guide's context.

datlechin

V0.1.1

Tour Guide Reset: Moderators can now reset the tour guide for users, or users can restart the tour guide themselves. (ivangneiding Jbugy)
Trigger Click Option: Added the option to enable/disable triggering a click on an element. This feature only works with visible elements on the DOM. (tolgaaaltas)

lighthouse

Can anyone share target codes and examples?

datlechin

lighthouse

Screenshot 2023-11-25 at 20 37 53

In the above example, the New Discussion button has class IndexPage-newDiscussion so the target is .IndexPage-newDiscussion

ernestdefoe

lighthouse Yeah I could go for this as well. It's so hard trying to find what you need to input to do certain things. Not all of us are that tech savvy.

ctml

datlechin perhaps opening the composer triggers that separate tour. Basically it would behave like a new tour. Also interested in the tour per page so you could create a tour if you use different main page, for example /blog with the blog ext, user profile page, etc.

ZAKY

Wow a great extension thank you hope in the future you can develop more "avatar frame" extension thank you 😍

HeapsortYi

Wow, what a useful plugin. Can it be displayed on the mobile side?

datlechin

HeapsortYi Yes, it can. But only those elements appear on the screen.

kirs

great extension！