Forums

Adding JS file to Elemental Theme

Permalink
Hi, really new to Concrete5. Using it to for my final year project at University. I'm creating a social networking site for the very elderly (60+ years). One of the requirements I've made is that I want to 'hold their hand' through the website, I need to create some sort of interactive user guide to assist the user through the website.

I've found the jshttps://github.com/jeff-optimizely/Guiders-JS#readme... which seems ideal for my situation.

I'm currently using the stock elemental theme and would like to know how I get the concrete5 theme to interact with the Elemental theme. It seems more challenging as I'm a little confused with file layout of the Elemental theme. I've inserted the JS folder (containing all the extracted files from the website above into \concrete\js\Guiders-JS-master
However, I'm not sure where I need to include a linking bit of code in some PHP file to enable this Javascript.

I was wondering if anyone could help me?
pk004233
 
JohntheFish replied on at Permalink Reply
JohntheFish
A couple of pointers:
- don't mess with Elemental. Use Cloneamental (free from marketplace)
- your application sounds more like it should be developed as a package, not built into a theme
pk004233 replied on at Permalink Reply
pk004233
Okay brilliant, thank you. I'll have a look into that!
Steevb replied on at Permalink Reply
Steevb
Should very elderly be (80+ years)?
pk004233 replied on at Permalink Reply
pk004233
Yes sorry my mistake.. In the spec I created it was 80+
MrKDilkington replied on at Permalink Reply
MrKDilkington
Hi pk004233,

Tourist.js is shipped with concrete5 as a vendor library. It will allow you to create guided tours.
https://easelinc.github.io/tourist/...

Adding Guides to Dashboard Pages
http://documentation.concrete5.org/developers/interface-customizati...

If you need an example of how they work, the Customize Editing Interface add-on uses them.
http://www.concrete5.org/marketplace/addons/mrkdilkington-customize...

@Steevb

I believe very elderly is (50+ years) now.
pk004233 replied on at Permalink Reply
pk004233
Ah this is amazing.. Just had a little research into and this is perfect! Exactly what I was looking for.

Just for clarification.. Where would this script go in the Elemental (or the Elemental clone which I'll download)? In the Header.php?
MrKDilkington replied on at Permalink Reply
MrKDilkington
@pk004233

The script to use Tourist.js could be put in the body before the closing </body> tag.

To avoid displaying the script to visitors, I recommend conditionally checking to see if the toolbar is visible.
$cp = new Permissions($c);
if ($cp->canViewToolbar()) {
    // show script
}