diff --git a/Gemfile b/Gemfile
index 019af18d2e..05b6322344 100644
--- a/Gemfile
+++ b/Gemfile
@@ -2,4 +2,4 @@ source 'https://rubygems.org'
 
 gem 'github-pages', group: :jekyll_plugins
 gem 'webrick'
-
+gem 'jekyll-github-metadata'
\ No newline at end of file
diff --git a/Gemfile.lock b/Gemfile.lock
index 671c280185..5175cddfc4 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -273,6 +273,7 @@ PLATFORMS
 
 DEPENDENCIES
   github-pages
+  jekyll-github-metadata
   webrick
 
 BUNDLED WITH
diff --git a/_config.yml b/_config.yml
index 167e547c44..6f649dfc33 100644
--- a/_config.yml
+++ b/_config.yml
@@ -1,6 +1,8 @@
 url: "https://expressjs.com"
 baseurl: "/"
 
+repository: expressjs/expressjs.com
+
 # Site settings
 
 defaults:
@@ -19,6 +21,7 @@ announcement: false # Enable or disable the announcements.
 
 plugins:
   - jekyll-redirect-from
+  - jekyll-github-metadata
 
 highlighter: rouge
 # library used for syntax highlighting
@@ -34,6 +37,3 @@ exclude:
   - [uk/CHANGELOG.md]
   - vendor/bundle
   - node_modules/
-
-
-github: [metadata]
diff --git a/_layouts/3x-api.html b/_layouts/3x-api.html
index df07358683..c422c6ff78 100644
--- a/_layouts/3x-api.html
+++ b/_layouts/3x-api.html
@@ -16,6 +16,14 @@ <h3 id="sidebar-heading" class="toc-heading"><em>On this page</em></h3>
       </nav>
       <main>
         {{ content }}
+        <a role="button" class="edit-github-btn" href="{{ site.github.repository_url }}/tree/gh-pages/_includes/{{page.menu}}/en/3x" aria-label="GitHub button">
+          <span class="hidden-dark">
+            {% include icons/github-light.svg %}
+          </span>
+          <span class="hidden-light">
+            {% include icons/github-dark.svg %}
+          </span>
+          Edit this page</a>
       </main>
     </div>
 
diff --git a/_layouts/4x-api.html b/_layouts/4x-api.html
index c8c97619e6..faf8d96b7c 100644
--- a/_layouts/4x-api.html
+++ b/_layouts/4x-api.html
@@ -16,6 +16,14 @@ <h3 id="sidebar-heading" class="toc-heading"><em>On this page</em></h3>
       </nav>
       <main>
         {{ content }}
+        <a role="button" class="edit-github-btn" href="{{ site.github.repository_url }}/tree/gh-pages/_includes/{{page.menu}}/en/4x" aria-label="GitHub button">
+          <span class="hidden-dark">
+            {% include icons/github-light.svg %}
+          </span>
+          <span class="hidden-light">
+            {% include icons/github-dark.svg %}
+          </span>
+          Edit this page</a>
       </main>
     </div>
 
diff --git a/_layouts/5x-api.html b/_layouts/5x-api.html
index aeb1349413..6db2ab8467 100644
--- a/_layouts/5x-api.html
+++ b/_layouts/5x-api.html
@@ -16,6 +16,14 @@ <h3 id="sidebar-heading" class="toc-heading"><em>On this page</em></h3>
       </nav>
       <main>
         {{ content }}
+        <a role="button" class="edit-github-btn" href="{{ site.github.repository_url }}/tree/gh-pages/_includes/{{page.menu}}/en/5x" aria-label="GitHub button">
+          <span class="hidden-dark">
+            {% include icons/github-light.svg %}
+          </span>
+          <span class="hidden-light">
+            {% include icons/github-dark.svg %}
+          </span>
+          Edit this page</a>
       </main>
     </div>
 
diff --git a/_layouts/page.html b/_layouts/page.html
index a85eb30a11..96f47fc8a7 100644
--- a/_layouts/page.html
+++ b/_layouts/page.html
@@ -28,6 +28,14 @@
     <div class="content">
       <main>
         {{ content }}
+        <a role="button" class="edit-github-btn" href="{{ site.github.repository_url }}/edit/gh-pages/{{ page.path }}" aria-label="GitHub button">
+          <span class="hidden-dark">
+            {% include icons/github-light.svg %}
+          </span>
+          <span class="hidden-light">
+            {% include icons/github-dark.svg %}
+          </span>
+          Edit this page</a>
       </main>
     </div>
   {% endif %}
diff --git a/css/style.css b/css/style.css
index e20c89a363..d7bdea67ab 100644
--- a/css/style.css
+++ b/css/style.css
@@ -557,6 +557,25 @@ html[xmlns] .clearfix {
   color: var(--box-fg);
 }
 
+a.edit-github-btn{
+  display: flex;
+  gap: 0.5rem;
+  align-items: center;
+  width: fit-content;
+  padding: 0.5rem;
+  border-radius: 0.3rem;
+
+  span {
+    height: 20px;
+  }
+
+  &:is(:hover, :active, :focus) {
+    color: var(--fg);
+    background-color: var(--hover-bg);
+    outline: 1px solid var(--card-fg);
+  }
+}
+
 #mobile-menu {
   display: none;
   position: relative;
@@ -1381,6 +1400,10 @@ strong.eol {
   display: block;
 }
 
+.hidden-light {
+  display: none;
+}
+
 blockquote {
   margin-left: 0;
   font-weight: 600;