diff --git a/web/themes/custom/opdavies/opdavies.libraries.yml b/web/themes/custom/opdavies/opdavies.libraries.yml
index 9e821fceb..b83613359 100644
--- a/web/themes/custom/opdavies/opdavies.libraries.yml
+++ b/web/themes/custom/opdavies/opdavies.libraries.yml
@@ -4,6 +4,8 @@ global-styling:
       dist/tailwind.css: {}
 global-scripts:
   js:
+    dist/js/app.js: {}
+
     'https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js':
       type: external
       minified: true
diff --git a/web/themes/custom/opdavies/src/app.js b/web/themes/custom/opdavies/src/app.js
new file mode 100644
index 000000000..adea53df5
--- /dev/null
+++ b/web/themes/custom/opdavies/src/app.js
@@ -0,0 +1,7 @@
+import hljs from 'highlightjs'
+
+document.addEventListener('DOMContentLoaded', event => {
+  document.querySelectorAll('pre code').forEach(block => {
+    hljs.highlightBlock(block)
+  })
+})
diff --git a/web/themes/custom/opdavies/webpack.mix.js b/web/themes/custom/opdavies/webpack.mix.js
index 4098a798e..7fd1f5526 100644
--- a/web/themes/custom/opdavies/webpack.mix.js
+++ b/web/themes/custom/opdavies/webpack.mix.js
@@ -6,3 +6,5 @@ mix.postCss('src/tailwind.pcss', 'dist', [
   require('postcss-nested'),
   require('autoprefixer')
 ])
+
+mix.js('src/app.js', 'dist/js')