Welcome to 'Help file maker' tool application.
This app is intend to produce help files with necessary JS codes and help texts for JQuery plugin called
Joy ride help tour.
When you want to use this plugin in your projects you will need to incorporate certain HTML and JS elements to your source code manually. This is fine when you have only few pages in your project. But when you have a huge number of pages with UI and you want to integrate this help tour plugin for each and every page, you will need to spend a lot of time and energy.
To overcome this trouble as Channa's suggestion and guidelines, 'Help file maker' was developed.
Main function of this app is getting UI controls id or class names and the help texts related to it from an interface, and then this app produces a php file with necessary JS codes of Joy Ride plugin along with required
CSS and JS libraries linked to Bizydads.com server.
Once you obtain this php file you can simply include the file and run the plugin instantly. ( you need to include this file at the bottom of the page)
When needed you can do changes to the php file manually as your additional requirements.
Enter a name for your help file
Enter the help button or help text id to attache this help guide.For example I have attached the id of the div which contains 'How to use this tool' text
Select the number of steps you would have for your guide tour.Based on your selection following 'Help Tip' segment will increse
Select the identification type of your UI element. That can be an ID or Class name. If you do not have these attributes you need to first incorporate them in your code.
Enter the UI element ID name or Class ID name here. If you leve this blank a general (model type) help dialog box will display in the middle of the page.
Enter a header text to be shown on the pop up. For example I'v used 'Step #6' as my header text
Enter your help text in this text area.
Enter the caption of the button. For example I'v used 'Next' caption as button text
This is help balloon tip location. Joyride help tour plugin supports only 4 locations. Top,Bottom,Left and Right. Basically using this you can control the location of the balloon on the UI element.
This help tour was made using this tool. And it took me only 5 mins to complete the guide tour.
1. Before you start to make a help file, think and decide how many steps you want to add to your help tour.
2. Check each and every UI on your page that has an ID or Class attribute in the code.You can use browser's web developer tool for this
3. Type your help texts first in a word pad or a text editor for spell checking. This is also very useful when you unintentionally do a mistake in this app and had to reload the app,resulting all your previous typed help text will be lost.
That's all for now. enjoy your help tour!
If you have any suggestions or bug reports please do let me know via this mail( roshan@ekwa.com).
Thank you