<script src="https://cdnjs.cloudflare.com/ajax/libs/kineticjs/5.2.0/kinetic.js"></script>
<link href="#appResource.enjoyhint.css#" rel="stylesheet">
<script src="#appResource.enjoyhint.min.js#"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-scrollTo/2.1.2/jquery.scrollTo.min.js"></script>
<script type="text/javascript">
//initialize instance
var enjoyhint_instance = new EnjoyHint({});
//simple config.
//Only one step - highlighting(with description) "New" button
//hide EnjoyHint after a click on the button.
var enjoyhint_script_steps = [
selector: "input[id='name']", /*modify this to point to input field*/
event_type: "next",
description: "This is a hardcoded hint, see CustomHTML",
showSkip: false
selector: "#section1 > div.form-column > div:nth-child(2)", /*modify this to point to input field*/
event_type: "next",
description: "Click here to fill up the date!",
showSkip: false
selector: "#submit", /*modify this to point to input field*/
event_type: "next",
description: "Click the save button once you're done!",
shape: 'circle',
radius: 50,
showSkip: false
//set script config
enjoyhint_instance.set(enjoyhint_script_steps);
//run Enjoyhint script
enjoyhint_instance.run();
</script>