Pro Edition
System Loading
Widgets update

Page Tour

Example Element

Popover Positioning

You can also, change the position of the popover to be either left, top, rightor bottom.

var driver = new Driver();driver.highlight({  element: '#some-element',  popover: {    title: 'Title for the Popover',    description: 'Description for it',    position: 'left', // can be `top`, `left`, `right`, `bottom`  }});

Creating Feature Introductions

You can also make powerful feature introductions to guide the users about the features. Just provide an array of steps where each step specifies an element to highlight.

Below is just a quick example showing you how to combine the steps in introduction.

var driver = new Driver({  opacity: 0.5});// Define the steps for introductiondriver.defineSteps([  {    element: '#popover-feature-introduction-p1',    popover: {      title: 'Before we start',      description: 'This is just use-case, make sure to check out the rest of the docs below',      position: 'top'    }  },  {    element: '#popover-feature-introduction-p2',    popover: {      title: 'Title on Popover 1',      description: 'Body of the popover',      position: 'top'    }  },  {    element: '#popover-feature-introduction-p3',    popover: {      title: 'Title on Popover 2',      description: 'This is just use-case, make sure to check out the rest of the docs below',      position: 'top'    }  }]);// Start the introductiondriver.start();

HTML in Popovers

You can also specify HTML in the body or the title of the popovers. Here is an example:

Theme Customizer
Customize & Preview In Real Time
Layout Options
Theme Colors