diff --git a/index.html b/index.html
index cc30cff..150f26e 100644
--- a/index.html
+++ b/index.html
@@ -128,6 +128,20 @@ <h4>URL page link</h4>
         href: <span class="s">'?page={{number}}'</span>
     });</code></pre>
 
+            <h4>Visible pages option</h4>
+
+            <p>The max number of visible pages specifies via <code>visiblePages</code> option. The following example
+            shows the 10 visible pages:</p>
+            <pre><code class="highlight">    $(selector).twbsPagination({
+        totalPages: <span class="il">35</span>,
+        visiblePages: <span class="il">10</span>,
+    });</code></pre>
+
+            <p>Note: this is normal size (without <code>pagination-sm</code>)</p>
+            <div class="text-center">
+                <ul id="visible-pages-example"></ul>
+            </div>
+
         </section>
 
         <aside id="sidebar">
diff --git a/js/main.js b/js/main.js
index 7800c54..460dffc 100644
--- a/js/main.js
+++ b/js/main.js
@@ -13,5 +13,10 @@ $(document).ready(function () {
         }
     });
 
+    $('#visible-pages-example').twbsPagination({
+        totalPages: 35,
+        visiblePages: 10
+    });
+
 });