diff --git a/package-lock.json b/package-lock.json
index 295ec9d795d7..f767cb5f5ad0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12068,9 +12068,9 @@
       }
     },
     "react-banner": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/react-banner/-/react-banner-0.5.0.tgz",
-      "integrity": "sha512-Z3pN+L6v3G08k0wxDQIzzTBAKBtdvM3VFdrV0FiLd/iQiVhuC9bEfeCFacTjxa/0KK0spKfImLGRHa80xoV6xw=="
+      "version": "1.0.0-rc.0",
+      "resolved": "https://registry.npmjs.org/react-banner/-/react-banner-1.0.0-rc.0.tgz",
+      "integrity": "sha512-d9U9ArDcNjegwCcl5+Q4NbGSLHMqsxjALJLnmO6BX0biF5D6HCJuJcHGXxlr9AMnSKMZPUWca8RTGnadYoBujg=="
     },
     "react-dom": {
       "version": "16.2.0",
diff --git a/package.json b/package.json
index 1647646766a3..3d83293f1c07 100644
--- a/package.json
+++ b/package.json
@@ -104,12 +104,13 @@
   },
   "dependencies": {
     "ajv": "^5.5.2",
+    "docsearch.js": "^2.5.2",
     "gitter-sidecar": "^1.2.3",
     "preact": "^8.2.7",
     "preact-compat": "3.17.0",
     "prop-types": "^15.5.10",
     "react": "^16.2.0",
-    "react-banner": "^0.5.0",
+    "react-banner": "^1.0.0-rc.0",
     "react-dom": "^16.2.0",
     "react-hot-loader": "^4.0.0-beta.12",
     "react-router": "^4.2.0",
diff --git a/src/components/Dropdown/Dropdown.scss b/src/components/Dropdown/Dropdown.scss
index 0cf9c2bc3551..cef9210394f6 100644
--- a/src/components/Dropdown/Dropdown.scss
+++ b/src/components/Dropdown/Dropdown.scss
@@ -24,6 +24,7 @@
   position: absolute;
   top: 100%;
   right: 0;
+  font-size: getFontSize(-1);
   margin: auto;
   background-color: #2B3A42;
   z-index: 1;
diff --git a/src/components/Navigation/Navigation.jsx b/src/components/Navigation/Navigation.jsx
index 0f3c0b3e0953..11a9806bd966 100644
--- a/src/components/Navigation/Navigation.jsx
+++ b/src/components/Navigation/Navigation.jsx
@@ -1,67 +1,64 @@
+// Import External Dependencies
 import React from 'react';
 import Banner from 'react-banner';
+import DocSearch from 'docsearch.js';
+
+// Import Components
 import Link from '../Link/Link';
 import Container from '../Container/Container';
 import Logo from '../Logo/Logo';
 import Dropdown from '../Dropdown/Dropdown';
+
+// Load Styling
+import 'docsearch.js/dist/cdn/docsearch.css';
 import './Navigation.scss';
 import './Search.scss';
 
-// TODO: Re-incorporate the icon links
-//  <Link
-//    className="navigation__icon"
-//    title="GitHub Repository"
-//    to="//github.com/webpack/webpack">
-//    <i className="sidecar__icon icon-github" />
-//  </Link>
-//  <Link
-//    className="navigation__icon"
-//    title="See Questions on Stack Overflow"
-//    to="//stackoverflow.com/questions/tagged/webpack">
-//    <i className="sidecar__icon icon-stack-overflow" />
-//  </Link>
-//  <Dropdown
-//    className="navigation__languages"
-//    items={[
-//      { title: 'English', url: 'https://webpack.js.org/' },
-//      { title: '中文', url: 'https://doc.webpack-china.org/' }
-//    ]} />
-
-// TODO: Re-incorporate docsearch (see `react-banner` docs and `SearchResults` component/discussion)
-//   componentDidMount() {
-//     if (typeof window !== 'undefined') {
-//       let docsearch = () => {};
-
-//       // XXX: hack around docsearch
-//       if (window.docsearch) {
-//         docsearch = window.docsearch.default || window.docsearch;
-//       }
-
-//       docsearch({
-//         apiKey: 'fac401d1a5f68bc41f01fb6261661490',
-//         indexName: 'webpack-js-org',
-//         inputSelector: '.navigation__search-input'
-//       });
-
-//       window.addEventListener('keyup', e => {
-//         if (e.which === 9 && e.target.classList.contains('navigation__search-input')) {
-//           this._openSearch();
-//         }
-//       });
-//     }
-//   }
-
 export default class Navigation extends React.Component {
   render() {
     let { pathname, links, toggleSidebar } = this.props;
 
     return (
       <Banner
+        blockName="navigation"
         logo={ <Logo light={ true } /> }
         url={ pathname }
-        links={ links }
+        items={[
+          ...links,
+          {
+            title: 'GitHub Repository',
+            url: 'https://github.com/webpack/webpack',
+            className: 'navigation__item--icon',
+            content: <i className="icon-github" />
+          },
+          {
+            title: 'Webpack on Stack Overflow',
+            url: 'https://stackoverflow.com/questions/tagged/webpack',
+            className: 'navigation__item--icon',
+            content: <i className="icon-stack-overflow" />
+          },
+          {
+            className: 'navigation__item--icon',
+            content: (
+              <Dropdown
+                className="navigation__languages"
+                items={[
+                  { title: 'English', url: 'https://webpack.js.org/' },
+                  { title: '中文', url: 'https://doc.webpack-china.org/' }
+                ]} />
+            )
+          }
+        ]}
         link={ Link }
         onMenuClick={ toggleSidebar } />
     );
   }
+
+  componentDidMount() {
+    DocSearch({
+      apiKey: 'fac401d1a5f68bc41f01fb6261661490',
+      indexName: 'webpack-js-org',
+      inputSelector: '.navigation-search__input'
+    });
+  }
 }
diff --git a/src/components/Navigation/Navigation.scss b/src/components/Navigation/Navigation.scss
index bc086d8fd511..b8265bf9289a 100644
--- a/src/components/Navigation/Navigation.scss
+++ b/src/components/Navigation/Navigation.scss
@@ -2,21 +2,13 @@
 @import 'mixins';
 @import 'functions';
 
-// TODO: Re-incorporate language dropdown and github links although
-// this may require linking and re-releasing `react-banner`
-//
-// .navigation__languages {
-//   margin-left: 1em;
-//   margin-top: -4px;
-// }
-
-.banner {
+.navigation {
   flex: 0 0 auto;
   transition: background 250ms;
   background: getColor(elephant);
 }
 
-.banner__inner {
+.navigation__inner {
   position: relative;
   display: flex;
   align-items: center;
@@ -30,7 +22,7 @@
   }
 }
 
-.banner__mobile {
+.navigation__mobile {
   display: none;
   fill: white;
   padding: 0;
@@ -43,12 +35,12 @@
   transition: color 250ms;
 }
 
-.banner__mobile svg {
+.navigation__mobile svg {
   width: 20px;
   height: 20px;
 }
 
-.banner__logo {
+.navigation__logo {
   margin: auto;
   text-decoration: none;
   text-transform: uppercase;
@@ -58,7 +50,7 @@
   transition: all 250ms;
 }
 
-.banner__links {
+.navigation__items {
   flex: 1 1 auto;
   display: flex;
   height: 56px;
@@ -66,12 +58,12 @@
   justify-content: flex-end;
 }
 
-.banner__link {
+.navigation__item {
   position: relative;
   display: inline-block;
   font-size: getFontSize(-1);
   padding-bottom: 0.1em;
-  margin-right: 1.5em;
+  margin-right: 18px;
   text-transform: uppercase;
   letter-spacing: 0.5px;
   color: getColor(white);
@@ -82,6 +74,12 @@
     color: getColor(malibu);
   }
 
+  &--icon {
+    font-size: 16px;
+    margin-top: 2px;
+    -webkit-font-smoothing: antialiased;
+  }
+
   &--active {
     color: #fff;
 
@@ -101,14 +99,14 @@
   }
 }
 
-.banner-search {
+.navigation-search {
   flex: 0 0 auto;
   position: relative;
   display: flex;
   justify-content: flex-end;
 }
 
-.banner-search__input {
+.navigation-search__input {
   font-size: 14px;
   width: 0;
   max-width: calc(100vw - 8.5em);
@@ -128,7 +126,7 @@
   }
 }
 
-.banner-search__icon {
+.navigation-search__icon {
   font-size: 1em;
   width: 1em;
   height: 1em;
@@ -140,27 +138,27 @@
   transition: color 250ms;
 }
 
-.banner-search__input:focus,
-.banner-search__icon:focus {
+.navigation-search__input:focus,
+.navigation-search__icon:focus {
   outline: none;
 }
 
-.banner-search__clear {
+.navigation-search__clear {
   display: none;
   margin-right: 0.25em;
   margin-bottom: -1px;
 }
 
-.banner-search--active .banner-search__input {
+.navigation-search--active .navigation-search__input {
   margin-right: 0.5em;
   width: 400px;
 }
 
-.banner-search--active .banner-search__clear {
+.navigation-search--active .navigation-search__clear {
   display: block;
 }
 
-.banner-search__results {
+.navigation-search__results {
   position: absolute;
   top: 100%;
   right: 0;
@@ -168,7 +166,7 @@
   margin-top: 5px;
 }
 
-.banner--search .banner__link {
+.navigation--search .navigation__item {
   pointer-events: none;
   overflow: hidden;
   white-space: nowrap;
@@ -177,19 +175,19 @@
   opacity: 0;
 }
 
-.banner-sub {
+.navigation-sub {
   display: block;
   background: getColor(concrete);
 }
 
-.banner-sub__inner {
+.navigation-sub__inner {
   max-width: map-get($screens, large);
   margin: 0 auto;
   padding: 0 1.5em;
   text-align: right;
 }
 
-.banner-sub__link {
+.navigation-sub__link {
   display: inline-block;
   font-size: 0.8em;
   margin-left: 1.5em;
@@ -209,15 +207,15 @@
 }
 
 @media (max-width: 720px) {
-  .banner-sub {
+  .navigation-sub {
     display: none;
   }
 }
 
 @media (max-width: 720px) {
-  .banner__mobile { display: block; }
-  .banner__links { display: none; }
-  .banner--search .banner__logo {
+  .navigation__mobile { display: block; }
+  .navigation__items { display: none; }
+  .navigation--search .navigation__logo {
     pointer-events: none;
     overflow: hidden;
     white-space: nowrap;
diff --git a/src/components/Navigation/Search.scss b/src/components/Navigation/Search.scss
index 9c9a59972b5d..98f86a369574 100644
--- a/src/components/Navigation/Search.scss
+++ b/src/components/Navigation/Search.scss
@@ -6,6 +6,8 @@
 
   .ds-dropdown-menu {
     box-shadow: none;
+    margin-top: 19px;
+    margin-right: -37px;
 
     &:before {
       content: none;
diff --git a/src/components/Site/Site.jsx b/src/components/Site/Site.jsx
index b09d303aa0d5..ea37bec2fe37 100644
--- a/src/components/Site/Site.jsx
+++ b/src/components/Site/Site.jsx
@@ -62,16 +62,16 @@ class Site extends React.Component {
           toggleSidebar={ this._toggleSidebar }
           links={[
             {
-              title: 'Documentation',
+              content: 'Documentation',
               url: '/concepts',
               isActive: url => /^\/(api|concepts|configuration|guides|loaders|plugins)/.test(url),
               children: this._strip(
                 sections.filter(item => item.name !== 'contribute')
               )
             },
-            { title: 'Contribute', url: '/contribute' },
-            { title: 'Vote', url: '/vote' },
-            { title: 'Blog', url: '//medium.com/webpack' }
+            { content: 'Contribute', url: '/contribute' },
+            { content: 'Vote', url: '/vote' },
+            { content: 'Blog', url: 'https://medium.com/webpack' }
           ]} />
 
         { window.document !== undefined ? (
@@ -165,6 +165,7 @@ class Site extends React.Component {
   _strip = array => {
     return array.map(({ title, name, url, group, sort, anchors, children }) => ({
       title: title || name,
+      content: title || name,
       url,
       group,
       sort,
diff --git a/src/styles/icons/github.svg b/src/styles/icons/github.svg
index 941feab41d88..5f08fd120073 100644
--- a/src/styles/icons/github.svg
+++ b/src/styles/icons/github.svg
@@ -1,3 +1,3 @@
-<svg style="width:24px;height:24px" viewBox="0 0 24 24">
+<svg style="width:20px;height:20px" viewBox="0 0 20 20">
 	<path fill="#000000" d="M12,2A10,10 0 0,0 2,12C2,16.42 4.87,20.17 8.84,21.5C9.34,21.58 9.5,21.27 9.5,21C9.5,20.77 9.5,20.14 9.5,19.31C6.73,19.91 6.14,17.97 6.14,17.97C5.68,16.81 5.03,16.5 5.03,16.5C4.12,15.88 5.1,15.9 5.1,15.9C6.1,15.97 6.63,16.93 6.63,16.93C7.5,18.45 8.97,18 9.54,17.76C9.63,17.11 9.89,16.67 10.17,16.42C7.95,16.17 5.62,15.31 5.62,11.5C5.62,10.39 6,9.5 6.65,8.79C6.55,8.54 6.2,7.5 6.75,6.15C6.75,6.15 7.59,5.88 9.5,7.17C10.29,6.95 11.15,6.84 12,6.84C12.85,6.84 13.71,6.95 14.5,7.17C16.41,5.88 17.25,6.15 17.25,6.15C17.8,7.5 17.45,8.54 17.35,8.79C18,9.5 18.38,10.39 18.38,11.5C18.38,15.32 16.04,16.16 13.81,16.41C14.17,16.72 14.5,17.33 14.5,18.26C14.5,19.6 14.5,20.68 14.5,21C14.5,21.27 14.66,21.59 15.17,21.5C19.14,20.16 22,16.42 22,12A10,10 0 0,0 12,2Z" />
-</svg>
\ No newline at end of file
+</svg>
diff --git a/src/styles/icons/medium.svg b/src/styles/icons/medium.svg
index a3cecb5441c1..732be4edc566 100644
--- a/src/styles/icons/medium.svg
+++ b/src/styles/icons/medium.svg
@@ -1,3 +1,3 @@
-<svg style="width:24px;height:24px" viewBox="0 0 24 24">
+<svg style="width:20px;height:20px" viewBox="0 0 20 20">
     <path fill="#000000" d="M21.93,6.62L15.89,16.47L11.57,9.43L15,3.84C15.17,3.58 15.5,3.47 15.78,3.55L21.93,6.62M22,19.78C22,20.35 21.5,20.57 20.89,20.26L16.18,17.91L22,8.41V19.78M9,19.94C9,20.5 8.57,20.76 8.07,20.5L2.55,17.76C2.25,17.6 2,17.2 2,16.86V4.14C2,3.69 2.33,3.5 2.74,3.68L8.7,6.66L9,7.12V19.94M15.29,17.46L10,14.81V8.81L15.29,17.46Z" />
-</svg>
\ No newline at end of file
+</svg>
diff --git a/src/styles/icons/stack-overflow.svg b/src/styles/icons/stack-overflow.svg
index 4a726692091a..d55416d87906 100644
--- a/src/styles/icons/stack-overflow.svg
+++ b/src/styles/icons/stack-overflow.svg
@@ -1,3 +1,3 @@
-<svg style="width:24px;height:24px" viewBox="0 0 24 24">
+<svg style="width:20px;height:20px" viewBox="0 0 20 20">
     <path fill="#000000" d="M17.36,20.2V14.82H19.15V22H3V14.82H4.8V20.2H17.36M6.77,14.32L7.14,12.56L15.93,14.41L15.56,16.17L6.77,14.32M7.93,10.11L8.69,8.5L16.83,12.28L16.07,13.9L7.93,10.11M10.19,6.12L11.34,4.74L18.24,10.5L17.09,11.87L10.19,6.12M14.64,1.87L20,9.08L18.56,10.15L13.2,2.94L14.64,1.87M6.59,18.41V16.61H15.57V18.41H6.59Z" />
-</svg>
\ No newline at end of file
+</svg>