ember-site-tour

An ember add-on to implement site tours based on hopscotch.js.

Documentation: http://mydea.github.io/ember-site-tour/

Installation

ember install ember-site-tour

Basic Usage

// app/index/route.js

import Ember from 'ember';
import RouteTourMixin from 'ember-site-tour/mixins/route-tour';

export default Ember.Route.extend(RouteTourMixin, {});

{{! app/index/template.hbs }}

{{#tour-start-button}}
  <button>Start Tour</button>
{{/tour-start-button}}

// app/index/tour.js

export default [
  {
    target: '.first',
    title: 'First Step',
    content: `Lorem Ipsum...`
  },
  {
    target: '.second',
    title: 'Second Step',
    content: `Lorem Ipsum...`
  },
  {
    target: '.third',
    placement: 'bottom',
    title: 'Third Step',
    content: `Lorem Ipsum...`
  }
];

For more detailed instructions and examples, please visit the documentation.