diff --git a/_includes/algolia.html b/_includes/algolia.html
index a63c375eb3..8eb775de00 100644
--- a/_includes/algolia.html
+++ b/_includes/algolia.html
@@ -1,170 +1 @@
-<script>
-const algoliaSearch = instantsearch({
-  appId: '{{ site.algolia.application_id }}',
-  apiKey: '{{ site.algolia.search_only_api_key }}',
-  indexName: '{{ site.algolia.index_name }}',
-  searchFunction: function(helper) {          // hide search result in init query
-    var searchResults = $('#search-results');
-    if (helper.state.query === '') {
-      searchResults.hide();
-      return;
-    }
-    helper.search();
-    searchResults.show();
-  }
-});
-
-const hitTemplate = function(hit) {
-  let date = '';
-  if (hit.date) {
-    date = moment.unix(hit.date).format('MMM D, YYYY');
-  }
-
-  let url = `{{ site.baseurl }}${hit.url}#${hit.anchor}`;
-
-  const title = hit._highlightResult.title.value;
-
-  let breadcrumbs = '';
-  if (hit._highlightResult.headings) {
-    breadcrumbs = hit._highlightResult.headings.map(match => {
-      return `<span class="result-breadcrumb">${match.value}</span>`
-    }).join(' > ')
-  }
-
-  const content = hit._highlightResult.html.value;
-
-  return `
-    <div class="result-item">
-    <h2><a class="result-link" href="${url}">${title}</a></h2>
-    {{#breadcrumbs}}<a href="${url}" class="result-breadcrumbs">${breadcrumbs}</a>{{/breadcrumbs}}
-    <div class="result-snippet">${content}</div>
-    </div>
-  `;
-}
-
-algoliaSearch.addWidget(
-  instantsearch.widgets.searchBox({
-    container: '#search-input',
-    placeholder: 'Search (' + (/Mac|iPhone|iPad/.test(navigator.platform) ? '⌘K' : 'Ctrl+K') + ')',
-    poweredBy: true, // This is required if you're on the free Community plan
-    magnifier: false,
-    autofocus: false,
-    searchOnEnterKeyPressOnly: false,
-    reset: true
-  })
-);
-
-algoliaSearch.addWidget(
-  instantsearch.widgets.hits({
-    container: '#search-results',
-    templates: {
-      item: hitTemplate
-    }
-  })
-);
-
-algoliaSearch.start();
-
-// Patch the style of the search input bar generated by the above script
-// The equivalent CSS is below, however, including <style> in <body> is against the W3C commandments
-// Chrome and Firefox had baby called scope, but it didn't make it
-// https://stackoverflow.com/questions/2830296/using-style-tags-in-the-body-with-other-html
-var elem = document.querySelector('.ais-search-box--powered-by');
-elem.style.marginTop = '-15px';
-elem.style.paddingRight = '5px';
-
-var elem = document.querySelector('.nav li a.ais-search-box--powered-by-link');
-elem.style.padding = '0';
-elem.style.backgroundColor = 'transparent';
-elem.style.display = "inline-block";
-
-var elem = document.querySelector('.ais-search-box--input');
-elem.style.paddingLeft = '10px';
-elem.style.borderColor = '#0A76BB';
-
-var elem = document.querySelector('.ais-search-box');
-elem.style.padding = '.5em';
-elem.style.marginBottom = '0px';
-elem.style.marginLeft = '10px';
-elem.style.marginTop = '0px';
-elem.style.width = '20em';
-elem.style.fontSize = '0.8em';
-elem.style.height = '50px';
-elem.style.boxSizing = 'border-box';
-
-/*<style type="text/css">
-.ais-search-box--powered-by {
-  margin-top: -15px;
-  padding-right: 5px;
-}
-.nav li a.ais-search-box--powered-by-link {
-  padding: 0;
-  background-color: transparent;
-  display: inline-block;
-}
-.ais-search-box--input {
-  padding-left: 10px;
-  border-color: #0A76BB;
-}
-.ais-search-box {
-  padding: .5em;
-  margin-bottom: 0px;
-  margin-left: 10px;
-  margin-top: 0px;
-  width: 20em;
-  font-size: 0.8em;
-  box-sizing: border-box;
-  height: 50px;
-}
-</style>*/
-
-// some hacky JS to hide the search results until we move to docsearch (which is a true autocomplete-type search)
-document.addEventListener('mouseup', function(e) {
-  var results = document.getElementById('search-results');
-  if (!results.contains(e.target)) {
-    results.style.display = 'none';
-  }
-});
-document.addEventListener('mouseup', function(e) {
-  var input = document.getElementById('search-input');
-  var results = document.getElementById('search-results');
-  if (input.contains(e.target)) {
-    results.style.display = 'block';
-  }
-});
-
-// Cmd+K / Ctrl+K keyboard shortcut to focus search, Escape to dismiss
-document.addEventListener('keydown', function(e) {
-  var isMac = /Mac|iPhone|iPad|iPod/.test(navigator.platform);
-  if ((isMac ? e.metaKey : e.ctrlKey) && e.key === 'k') {
-    e.preventDefault();
-    var input = document.querySelector('.ais-search-box--input');
-    if (input) {
-      input.focus();
-      input.select();
-    }
-  }
-
-  if (e.key === 'Escape' || e.keyCode === 27) {
-    var results = document.getElementById('search-results');
-    var inputContainer = document.getElementById('search-input');
-    var activeElement = document.activeElement;
-
-    if (results) {
-      results.style.display = 'none';
-    }
-
-    if (inputContainer && inputContainer.contains(activeElement)) {
-      activeElement.blur();
-    } else if (results && results.contains(activeElement)) {
-      var algoliaInput = document.querySelector('#search-input .ais-search-box--input');
-      if (algoliaInput) {
-        algoliaInput.focus();
-      } else {
-        activeElement.blur();
-      }
-    }
-  }
-});
-
-</script>
\ No newline at end of file
+<script src="{{ '/js/algolia-search.js' | relative_url }}"></script>
diff --git a/js/algolia-search.js b/js/algolia-search.js
index 3528c6730f..0c90a352a5 100644
--- a/js/algolia-search.js
+++ b/js/algolia-search.js
@@ -45,7 +45,7 @@ const hitTemplate = function(hit) {
 algoliaSearch.addWidget(
   instantsearch.widgets.searchBox({
     container: '#search-input',
-    placeholder: 'Search ...',
+    placeholder: 'Search (' + (/Mac|iPhone|iPad/.test(navigator.platform) ? '⌘K' : 'Ctrl+K') + ')',
     poweredBy: true, // This is required if you're on the free Community plan
     magnifier: false,
     autofocus: false,
@@ -133,3 +133,36 @@ document.addEventListener('mouseup', function(e) {
   }
 });
 
+// Cmd+K / Ctrl+K keyboard shortcut to focus search, Escape to dismiss
+document.addEventListener('keydown', function(e) {
+  var isMac = /Mac|iPhone|iPad|iPod/.test(navigator.platform);
+  if ((isMac ? e.metaKey : e.ctrlKey) && e.key === 'k') {
+    e.preventDefault();
+    var input = document.querySelector('.ais-search-box--input');
+    if (input) {
+      input.focus();
+      input.select();
+    }
+  }
+
+  if (e.key === 'Escape' || e.keyCode === 27) {
+    var results = document.getElementById('search-results');
+    var inputContainer = document.getElementById('search-input');
+    var activeElement = document.activeElement;
+
+    if (results) {
+      results.style.display = 'none';
+    }
+
+    if (inputContainer && inputContainer.contains(activeElement)) {
+      activeElement.blur();
+    } else if (results && results.contains(activeElement)) {
+      var algoliaInput = document.querySelector('#search-input .ais-search-box--input');
+      if (algoliaInput) {
+        algoliaInput.focus();
+      } else {
+        activeElement.blur();
+      }
+    }
+  }
+});
