diff --git a/docs/src/.vuepress/config.js b/docs/src/.vuepress/config.js
index c0775a9..94a9c8b 100755
--- a/docs/src/.vuepress/config.js
+++ b/docs/src/.vuepress/config.js
@@ -34,26 +34,45 @@ module.exports = {
     lastUpdated: false,
     nav: [
       {
-        text: 'Guide',
-        link: '/guide/',
+        text: 'Docs',
+        link: '/docs/',
       },
       {
-        text: 'Config',
-        link: '/config/'
+        text: 'Github',
+        link: 'https://github.com/fawmi/vue-google-maps.git'
       }
     ],
-    sidebar: {
-      '/docs/': [
-        {
-          title: 'Getting started',
-          collapsable: false,
-          children: [
-            '',
-            'getting-started',
-          ]
-        }
-      ],
-    }
+    sidebar: [
+      {
+        title: 'Getting started',
+        path: '/docs/',
+        sidebarDepth: 2,
+        collapsable: false,
+        children: [
+          '/docs/introduction',
+          '/docs/getting-started',
+        ]
+      },
+      {
+        title: 'Components',
+        collapsable: false,
+        path: '/components/',
+        sidebarDepth: 2,
+        children: [
+          '/components/introduction',
+          '/components/map',
+        ]
+      },
+      {
+        title: 'Advanced',
+        collapsable: false,
+        path: '/advanced/',
+        sidebarDepth: 2,
+        children: [
+          '/advanced/introduction',
+        ]
+      }
+    ]
   },
 
   /**
diff --git a/docs/src/advanced/README.md b/docs/src/advanced/README.md
new file mode 100644
index 0000000..43b674f
--- /dev/null
+++ b/docs/src/advanced/README.md
@@ -0,0 +1,10 @@
+# List
+
+`@fawmi/vue-google-maps` provides a set of Vue.js 3 components wrapping the Google Maps API v3.
+
+Currently `Map`, `Marker`, `InfoWindow`,  `Polygon` and `Rectangle` are supported.
+
+Other components are still under development. 
+
+
+Checkout getting started to read, how to install and use vue-google-maps
\ No newline at end of file
diff --git a/docs/src/advanced/introduction.md b/docs/src/advanced/introduction.md
new file mode 100755
index 0000000..a2d4de6
--- /dev/null
+++ b/docs/src/advanced/introduction.md
@@ -0,0 +1,10 @@
+# Advanced
+
+`@fawmi/vue-google-maps` provides a set of Vue.js 3 components wrapping the Google Maps API v3.
+
+Currently `Map`, `Marker`, `InfoWindow`,  `Polygon` and `Rectangle` are supported.
+
+Other components are still under development. 
+
+
+Checkout getting started to read, how to install and use vue-google-maps
\ No newline at end of file
diff --git a/docs/src/advanced/map.md b/docs/src/advanced/map.md
new file mode 100755
index 0000000..7638864
--- /dev/null
+++ b/docs/src/advanced/map.md
@@ -0,0 +1,31 @@
+# Map
+
+## Install
+
+to install it via NPM 
+```bash
+npm install -S @fawmi/vue-google-maps
+```
+You can also install via Yarn
+```bash
+yarn add @fawmi/vue-google-maps
+```
+
+## Example
+Here is a basic example 
+
+```javascript
+import { createApp } from 'vue'
+import googleMap from '@fawmi/vue-google-maps'
+import App from './App.vue';
+
+const googleMapOption = {
+    apiKey: 'here_comes_your_api_key',
+}
+
+const app = createApp(App);
+
+app.use(googleMap, googleMapOption)
+app.mount('#app')
+
+```
diff --git a/docs/src/components/README.md b/docs/src/components/README.md
new file mode 100644
index 0000000..43b674f
--- /dev/null
+++ b/docs/src/components/README.md
@@ -0,0 +1,10 @@
+# List
+
+`@fawmi/vue-google-maps` provides a set of Vue.js 3 components wrapping the Google Maps API v3.
+
+Currently `Map`, `Marker`, `InfoWindow`,  `Polygon` and `Rectangle` are supported.
+
+Other components are still under development. 
+
+
+Checkout getting started to read, how to install and use vue-google-maps
\ No newline at end of file
diff --git a/docs/src/components/introduction.md b/docs/src/components/introduction.md
new file mode 100755
index 0000000..9dbe5f5
--- /dev/null
+++ b/docs/src/components/introduction.md
@@ -0,0 +1,10 @@
+# Component list
+
+`@fawmi/vue-google-maps` provides a set of Vue.js 3 components wrapping the Google Maps API v3.
+
+Currently `Map`, `Marker`, `InfoWindow`,  `Polygon` and `Rectangle` are supported.
+
+Other components are still under development. 
+
+
+Checkout getting started to read, how to install and use vue-google-maps
\ No newline at end of file
diff --git a/docs/src/components/map.md b/docs/src/components/map.md
new file mode 100755
index 0000000..7638864
--- /dev/null
+++ b/docs/src/components/map.md
@@ -0,0 +1,31 @@
+# Map
+
+## Install
+
+to install it via NPM 
+```bash
+npm install -S @fawmi/vue-google-maps
+```
+You can also install via Yarn
+```bash
+yarn add @fawmi/vue-google-maps
+```
+
+## Example
+Here is a basic example 
+
+```javascript
+import { createApp } from 'vue'
+import googleMap from '@fawmi/vue-google-maps'
+import App from './App.vue';
+
+const googleMapOption = {
+    apiKey: 'here_comes_your_api_key',
+}
+
+const app = createApp(App);
+
+app.use(googleMap, googleMapOption)
+app.mount('#app')
+
+```