diff --git a/package-lock.json b/package-lock.json
index 56ba1c00c7..bbe585bc9e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4913,9 +4913,9 @@
       }
     },
     "govuk-frontend": {
-      "version": "3.14.0",
-      "resolved": "https://registry.npmjs.org/govuk-frontend/-/govuk-frontend-3.14.0.tgz",
-      "integrity": "sha512-y7FTuihCSA8Hty+e9h0uPhCoNanCAN+CLioNFlPmlbeHXpbi09VMyxTcH+XfnMPY4Cp++7096v0rLwwdapTXnA=="
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/govuk-frontend/-/govuk-frontend-4.0.0.tgz",
+      "integrity": "sha512-liaJildULUNSSvEgDm36SQTivqBHiZLdrm+O7bBxnW4Q1g64asi+mJIMzW8QeOqlG4Yn8s0gSklsIyaFOuCisQ=="
     },
     "graceful-fs": {
       "version": "4.1.11",
diff --git a/package.json b/package.json
index 4e870e767e..e52b0f70d9 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
     "clipboard": "^2.0.4",
     "connect": "^3.6.6",
     "eslint": "^5.16.0",
-    "govuk-frontend": "^3.14.0",
+    "govuk-frontend": "^4.0.0",
     "gray-matter": "^4.0.2",
     "highlight.js": "^10.4.1",
     "html5shiv": "^3.7.3",
diff --git a/src/components/character-count/threshold/index.njk b/src/components/character-count/threshold/index.njk
index 2495f3eef2..2d35a21fa0 100644
--- a/src/components/character-count/threshold/index.njk
+++ b/src/components/character-count/threshold/index.njk
@@ -6,8 +6,8 @@ layout: layout-example.njk
 {% from "govuk/components/character-count/macro.njk" import govukCharacterCount %}
 
 {{ govukCharacterCount({
-  name: "word-count",
-  id: "word-count",
+  name: "threshold",
+  id: "threshold",
   maxlength: 112,
   threshold: 75,
   value: "Type another letter into this field after this message to see the threshold feature",
diff --git a/src/components/footer/full/index.njk b/src/components/footer/full/index.njk
index 7442c55171..fc9b4a144f 100644
--- a/src/components/footer/full/index.njk
+++ b/src/components/footer/full/index.njk
@@ -9,6 +9,7 @@ layout: layout-example.njk
   navigation: [
     {
       title: "Services and information",
+      width: "two-thirds",
       columns: 2,
       items: [
         {
@@ -79,6 +80,7 @@ layout: layout-example.njk
     },
     {
       title: "Departments and policy",
+      width: "one-third",
       items: [
         {
           href: "#",
diff --git a/src/components/footer/with-navigation/index.njk b/src/components/footer/with-navigation/index.njk
index 54f62c9a80..c1ab556b47 100644
--- a/src/components/footer/with-navigation/index.njk
+++ b/src/components/footer/with-navigation/index.njk
@@ -9,6 +9,7 @@ layout: layout-example.njk
   navigation: [
     {
       title: "Two column list",
+      width: "two-thirds",
       columns: 2,
       items: [
         {
@@ -39,6 +40,7 @@ layout: layout-example.njk
     },
     {
       title: "Single column list",
+      width: "one-third",
       items: [
         {
           href: "#1",
diff --git a/src/javascripts/govuk-frontend.js b/src/javascripts/govuk-frontend.js
index f0728a04c6..910c64be6e 100644
--- a/src/javascripts/govuk-frontend.js
+++ b/src/javascripts/govuk-frontend.js
@@ -9,6 +9,7 @@ import NotificationBanner from 'govuk-frontend/govuk/components/notification-ban
 import Radios from 'govuk-frontend/govuk/components/radios/radios'
 import Header from 'govuk-frontend/govuk/components/header/header'
 import Tabs from 'govuk-frontend/govuk/components/tabs/tabs'
+import SkipLink from 'govuk-frontend/govuk/components/skip-link/skip-link'
 
 var nodeListForEach = common.nodeListForEach
 
@@ -68,3 +69,7 @@ var $tabs = document.querySelectorAll('[data-module="govuk-tabs"]')
 nodeListForEach($tabs, function ($tab) {
   new Tabs($tab).init()
 })
+
+// Find first skip link module to enhance.
+var $skipLink = document.querySelector('[data-module="govuk-skip-link"]')
+new SkipLink($skipLink).init()