diff --git a/docs/formats.html b/docs/formats.html
index 0134966e7..a3ee332be 100644
--- a/docs/formats.html
+++ b/docs/formats.html
@@ -23,8 +23,8 @@
 <link href="site_libs/tocify-1.9.1/jquery.tocify.css" rel="stylesheet" />
 <script src="site_libs/tocify-1.9.1/jquery.tocify.js"></script>
 <script src="site_libs/navigation-1.1/tabsets.js"></script>
-<link href="site_libs/highlightjs-1.1/textmate.css" rel="stylesheet" />
-<script src="site_libs/highlightjs-1.1/highlight.js"></script>
+<link href="site_libs/highlightjs-9.12.0/textmate.css" rel="stylesheet" />
+<script src="site_libs/highlightjs-9.12.0/highlight.js"></script>
 <link href="site_libs/font-awesome-4.5.0/css/font-awesome.min.css" rel="stylesheet" />
 
 
@@ -46,10 +46,12 @@
   }
 </style>
 <script type="text/javascript">
-if (window.hljs && document.readyState && document.readyState === "complete") {
-   window.setTimeout(function() {
-      hljs.initHighlighting();
-   }, 0);
+if (window.hljs) {
+  hljs.configure({languages: []});
+  hljs.initHighlightingOnLoad();
+  if (document.readyState && document.readyState === "complete") {
+    window.setTimeout(function() { hljs.initHighlighting(); }, 0);
+  }
 }
 </script>
 
@@ -353,22 +355,16 @@ <h2>Tutorial Format</h2>
 <p>The <strong>learnr</strong> package includes a <code>learnr::tutorial</code> R Markdown format which which provides some default layout and behavior (including progress tracking) which you’ll likely want to use in many of your tutorials.</p>
 <p>The format also includes features for progressively revealing sections and allowing users to optionally skip exercises they are having trouble with (both of these features are described below).</p>
 <p>You can create a new <code>learnr::tutorial</code> document from a template via the <strong>New R Markdown</strong> dialog in RStudio:</p>
-<div class="figure">
-<img src="images/create-new-tutorial.png" width="565" height="461" />
-
-</div>
+<p><img src="images/create-new-tutorial.png" width="565" height="461" /></p>
 <p>The benefits of using the <code>learnr::tutorial</code> format include:</p>
 <ol style="list-style-type: decimal">
 <li><p>More appropriate defaults are provided for various things including figure sizes and data frame printing.</p></li>
 <li><p>A floating table of contents for easy navigation between sections is provided by default.</p></li>
 <li><p>Visual adornments are added to the table of contents indicating which parts of the tutorial have been completed.</p></li>
-<li><p>A “Start Over” button is added to the table of contents regsion to allow users to clear previous work within the tutorial.</p></li>
+<li><p>A “Start Over” button is added to the table of contents region to allow users to clear previous work within the tutorial.</p></li>
 </ol>
 <p>Here’s what a <code>learnr::tutorial</code> document looks like by default:</p>
-<div class="figure">
-<img src="images/tutorial-format.png" style="border: solid 1px #cccccc; margin-bottom: 12px;" width="1184" height="737" />
-
-</div>
+<p><img src="images/tutorial-format.png" style="border: solid 1px #cccccc; margin-bottom: 12px;" width="1184" height="737" /></p>
 </div>
 <div id="custom-formats" class="section level2">
 <h2>Custom Formats</h2>
diff --git a/docs/index.html b/docs/index.html
index eed289478..60d266c1f 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -23,8 +23,8 @@
 <link href="site_libs/tocify-1.9.1/jquery.tocify.css" rel="stylesheet" />
 <script src="site_libs/tocify-1.9.1/jquery.tocify.js"></script>
 <script src="site_libs/navigation-1.1/tabsets.js"></script>
-<link href="site_libs/highlightjs-1.1/textmate.css" rel="stylesheet" />
-<script src="site_libs/highlightjs-1.1/highlight.js"></script>
+<link href="site_libs/highlightjs-9.12.0/textmate.css" rel="stylesheet" />
+<script src="site_libs/highlightjs-9.12.0/highlight.js"></script>
 <link href="site_libs/font-awesome-4.5.0/css/font-awesome.min.css" rel="stylesheet" />
 
 
@@ -46,10 +46,12 @@
   }
 </style>
 <script type="text/javascript">
-if (window.hljs && document.readyState && document.readyState === "complete") {
-   window.setTimeout(function() {
-      hljs.initHighlighting();
-   }, 0);
+if (window.hljs) {
+  hljs.configure({languages: []});
+  hljs.initHighlightingOnLoad();
+  if (document.readyState && document.readyState === "complete") {
+    window.setTimeout(function() { hljs.initHighlighting(); }, 0);
+  }
 }
 </script>
 
@@ -403,10 +405,7 @@ <h3>Creating a Tutorial</h3>
 <h4>Tutorial Format</h4>
 <p>While you can use tutorial elements many different R Markdown formats (see the article on <a href="formats.html">Tutorial Formats</a> for details), the <strong>learnr</strong> package also includes a custom <code>learnr::tutorial</code> format which provides some default layout and behavior (including progress tracking) which you’ll likely want to use in many of your tutorials.</p>
 <p>You can create a new <code>learnr::tutorial</code> document from a template via the <strong>New R Markdown</strong> dialog in RStudio:</p>
-<div class="figure">
-<img src="images/create-new-tutorial.png" width="565" height="461" />
-
-</div>
+<p><img src="images/create-new-tutorial.png" width="565" height="461" /></p>
 <p>This is what the YAML metadata looks like for an Rmd file that uses the tutorial format:</p>
 <div id="tutorialyaml">
 
@@ -490,7 +489,7 @@ <h2>Shiny Components</h2>
 </div>
 <div id="external-resources" class="section level2">
 <h2>External Resources</h2>
-<p>You may wish to include external resources (images, videos, CSS, etc.) within your tutorial documents. Since the tutorial will be deployed as a Shiny applications, you need to ensure that these resources are placed within one of several directories which are reachable by the Shiny web server:</p>
+<p>You may wish to include external resources (images, videos, CSS, etc.) within your tutorial documents. Since the tutorial will be deployed as a Shiny application, you need to ensure that these resources are placed within one of several directories which are reachable by the Shiny web server:</p>
 <table>
 <thead>
 <tr class="header">