diff --git a/_config.yml b/_config.yml
new file mode 100644
index 00000000..7814e9ca
--- /dev/null
+++ b/_config.yml
@@ -0,0 +1,14 @@
+title: OpenSearch SDK for Java
+description: Extension Documentation
+theme: jekyll-theme-minimal
+logo: /assets/img/logo.png
+
+sidenav:
+  - name: Design
+    link: DESIGN.md
+  - name: Developer Guide
+    link: DEVELOPER_GUIDE.md
+  - name: Create your first extension
+    link: CREATE_YOUR_FIRST_EXTENSION.md
+  - name: Plugin migration
+    link: PLUGIN_MIGRATION.md
diff --git a/_includes/head_custom.html b/_includes/head_custom.html
new file mode 100644
index 00000000..b492b709
--- /dev/null
+++ b/_includes/head_custom.html
@@ -0,0 +1,9 @@
+<!-- start custom head snippets, customize with your own _includes/head-custom.html file -->
+
+<!-- Setup Google Analytics -->
+<!-- {% include head-custom-google-analytics.html %} -->
+
+<!-- You can set your favicon here -->
+<link rel="shortcut icon" type="image/ico" href="{{ /assets/img/logo.png | relative_url }}" >
+
+<!-- end custom head snippets -->
diff --git a/_includes/sidenav.html b/_includes/sidenav.html
new file mode 100644
index 00000000..d6c9fa2a
--- /dev/null
+++ b/_includes/sidenav.html
@@ -0,0 +1,7 @@
+<div class="link-wrapper">
+    <ul class="link">
+      {%- for topic in site.sidenav %}
+        <li><a href="{{ topic.link | replace:'.md','.html' }}">{{ topic.name }}</a></li>
+      {%- endfor %}
+    </ul>
+</div>
\ No newline at end of file
diff --git a/_layouts/default.html b/_layouts/default.html
new file mode 100644
index 00000000..3bc743c6
--- /dev/null
+++ b/_layouts/default.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="{{ site.lang | default: "en-US" }}">
+  <head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+{% seo %}
+    <link rel="stylesheet" href="{{ "/assets/css/style.css?v=" | append: site.github.build_revision | relative_url }}">
+    <!--[if lt IE 9]>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
+    <![endif]-->
+    {% include head_custom.html %}
+  </head>
+  <body>
+    <div class="wrapper">
+      <div class="sidenav">
+        <header>
+          <h1><a href="{{ "/" | absolute_url }}">{{ site.title | default: site.github.repository_name }}</a></h1>
+          <p>{{ site.description | default: site.github.project_tagline }}</p>
+
+          {% if site.logo %}
+            <img src="{{site.logo | relative_url}}" width=50 alt="OpenSearch Logo" />
+          {% endif %}
+
+          {% include sidenav.html %}
+
+          <p><a href="{{ site.github.repository_url }}">opensearch-sdk-java repository</a></p>
+          <p><a href="https://opensearch.org/docs">OpenSearch user documentation</a></p>
+        </header>
+      </div>
+        <section>
+
+        {{ content }}
+
+        </section>  
+    </div>
+    <script src="{{ "/assets/js/scale.fix.js" | relative_url }}"></script>
+  </body>
+</html>
diff --git a/assets/css/style.scss b/assets/css/style.scss
new file mode 100644
index 00000000..8693ddb0
--- /dev/null
+++ b/assets/css/style.scss
@@ -0,0 +1,36 @@
+---
+---
+
+@import "{{ site.theme }}";
+
+@media screen and (min-width: 1200px) {
+  .wrapper {
+    width:1200px;
+    margin:0 auto;
+  }
+  
+  section {
+    width:900px;
+    float:right;
+    padding-bottom:50px;
+  }
+}
+
+.link-wrapper {
+   margin-top: 2.5rem;
+}
+
+ul.link {
+    list-style-type: none; 
+    margin: 0; 
+    padding: 0;
+}
+
+ul.link li + li {
+    margin-top: 1rem;
+}
+
+ul.link:last-child {
+    margin-bottom: 2.5rem;
+}
+
diff --git a/assets/img/logo.png b/assets/img/logo.png
new file mode 100644
index 00000000..f54f4541
Binary files /dev/null and b/assets/img/logo.png differ
