diff --git a/themes/beautifulhugo/layouts/partials/footer_custom.html b/themes/beautifulhugo/layouts/partials/footer_custom.html
index af173b5716bb1429ac840db6f10c14323445b4e7..f1442097b063c0d115a3d0545de536852e8dd91b 100644
--- a/themes/beautifulhugo/layouts/partials/footer_custom.html
+++ b/themes/beautifulhugo/layouts/partials/footer_custom.html
@@ -1,4 +1,4 @@
-<!--
-If you want to include any custom html just before </body>, put it in /layouts/footer_custom.html
-Do not put anything in this file - it's only here so that hugo won't throw an error if /layouts/footer_custom.html doesn't exist.
--->
\ No newline at end of file
+<script src="https://cdnjs.cloudflare.com/ajax/libs/anchor-js/4.2.2/anchor.min.js"></script>
+<script>
+anchors.add('h1,h2,h3,h4,h5,h6');
+</script>
diff --git a/themes/beautifulhugo/static/css/main.css b/themes/beautifulhugo/static/css/main.css
index e91e795d022a6781907fc15505bbd59ca0d954d4..6df3784e40ac70bcf62bfde98fbb549d3bf1e85c 100644
--- a/themes/beautifulhugo/static/css/main.css
+++ b/themes/beautifulhugo/static/css/main.css
@@ -807,3 +807,13 @@ div.notices.tip p:first-child:after {
     content: 'Tip';
     color: #33b540;
 }
+
+/* --- Anchors --- */
+
+.anchorjs-link {
+  color: #3a5a80;
+}
+.anchorjs-link:hover {
+  color: #e67d1e;
+  text-decoration: none;
+}