diff --git a/assets/scripts/src/popover.js b/assets/scripts/src/popover.js
index c9d9d168a99168385b584035a869a23f3a650e68..05fbd8780a214d49a77dfa5801b3112ce4719736 100644
--- a/assets/scripts/src/popover.js
+++ b/assets/scripts/src/popover.js
@@ -1,5 +1,12 @@
 import Element from './element';
-import { CLASS_POPOVER_TIP, ID_POPOVER, OVERLAY_PADDING, POPOVER_HTML } from './constants';
+import {
+  CLASS_POPOVER_DESCRIPTION,
+  CLASS_POPOVER_TIP,
+  CLASS_POPOVER_TITLE,
+  ID_POPOVER,
+  OVERLAY_PADDING,
+  POPOVER_HTML,
+} from './constants';
 
 /**
  * Popover that is displayed on top of the highlighted element
@@ -14,11 +21,11 @@ export default class Popover extends Element {
     this.window = window;
     this.document = document;
 
-    this.node = this.preparePopover();
+    this.node = this.makeNode();
     this.hide();
   }
 
-  preparePopover() {
+  makeNode() {
     let popover = this.document.getElementById(ID_POPOVER);
     if (popover) {
       return popover;
@@ -67,9 +74,14 @@ export default class Popover extends Element {
   show(position) {
     this.reset();
 
-    const pageHeight = this.getFullPageSize().height;
-
     const popoverTip = this.node.querySelector(`.${CLASS_POPOVER_TIP}`);
+    const popoverTitle = this.node.querySelector(`.${CLASS_POPOVER_TITLE}`);
+    const popoverDescription = this.node.querySelector(`.${CLASS_POPOVER_DESCRIPTION}`);
+
+    popoverTitle.innerText = this.options.title;
+    popoverDescription.innerText = this.options.description;
+
+    const pageHeight = this.getFullPageSize().height;
     const popoverMargin = this.options.padding + 10;
     const popoverHeight = this.getHeight();
 
diff --git a/assets/scripts/src/sholo.js b/assets/scripts/src/sholo.js
index 628c14e2af90d8fd11ed5fbecb551c5db2e1cb34..3ab8bf6d5eadc0e4902bc7ac7f4f53a4ba182428 100644
--- a/assets/scripts/src/sholo.js
+++ b/assets/scripts/src/sholo.js
@@ -176,15 +176,18 @@ export default class Sholo {
       }
 
       const elementOptions = Object.assign({}, this.options, step);
-      const popoverOptions = Object.assign({}, this.options, elementOptions.popover || {});
-
       const domElement = this.document.querySelector(step.element);
       if (!domElement) {
         console.warn(`Element to highlight ${step.element} not found`);
         return;
       }
 
-      const popover = elementOptions.popover ? new Popover(popoverOptions, this.window, this.document) : null;
+      let popover = null;
+      const popoverOptions = Object.assign({}, this.options, elementOptions.popover || {});
+      if (elementOptions.popover && elementOptions.popover.description) {
+        popover = new Popover(popoverOptions, this.window, this.document);
+      }
+
       const element = new Element(domElement, elementOptions, popover, this.overlay, this.window, this.document);
 
       this.steps.push(element);
diff --git a/index.html b/index.html
index cfd04d418bcdbd6c236ba198058c86b6d89d299d..ba179cc907890e29ec0d63e1a56b212a030f9b36 100644
--- a/index.html
+++ b/index.html
@@ -65,11 +65,18 @@
 
   sholo.defineSteps([
     {
-      element: '.section__header'
+      element: '.section__header',
+      popover: {
+        title: 'Adding Introductions',
+        description: 'You can use it to add popovers on top of the website'
+      },
     },
     {
       element: '.section__how',
-      popover: {}
+      popover: {
+        title: 'Just Specify the Item',
+        description: 'All you have to do is provide the query selector of element to highlight'
+      },
     },
     {
       element: '.section__purpose',