From 50825ae64147e253c263fb287304b56d209a7b6d Mon Sep 17 00:00:00 2001
From: Alexey Pyltsyn <lex61rus@gmail.com>
Date: Tue, 29 Oct 2019 07:06:10 +0300
Subject: [PATCH] feat(v2): add ability to set custom HTML in footer items

---
 CHANGELOG-2.x.md                               |  1 +
 .../src/theme/Footer/index.js                  | 18 +++++++++++++-----
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/CHANGELOG-2.x.md b/CHANGELOG-2.x.md
index d6f8436f07cf..fb4dd5519f3a 100644
--- a/CHANGELOG-2.x.md
+++ b/CHANGELOG-2.x.md
@@ -10,6 +10,7 @@
 - Changed the way we read the `USE_SSH` env variable during deployment to be the same as in v1.
 - Add highlight specific lines in code blocks.
 - Fix accessing `docs/` or `/docs/xxxx` that does not match any existing doc page should return 404 (Not found) page, not blank page.
+- Allow user to add custom HTML to footer items.
 
 ## 2.0.0-alpha.31
 
diff --git a/packages/docusaurus-theme-classic/src/theme/Footer/index.js b/packages/docusaurus-theme-classic/src/theme/Footer/index.js
index 38ea6a0e6310..36aeb2a48edd 100644
--- a/packages/docusaurus-theme-classic/src/theme/Footer/index.js
+++ b/packages/docusaurus-theme-classic/src/theme/Footer/index.js
@@ -62,11 +62,19 @@ function Footer() {
                 Array.isArray(linkItem.items) &&
                 linkItem.items.length > 0 ? (
                   <ul className="footer__items">
-                    {linkItem.items.map(item => (
-                      <li key={item.href || item.to} className="footer__item">
-                        <FooterLink item={item} />
-                      </li>
-                    ))}
+                    {linkItem.items.map(item =>
+                      item.html ? (
+                        <div
+                          dangerouslySetInnerHTML={{
+                            __html: item.html,
+                          }}
+                        />
+                      ) : (
+                        <li key={item.href || item.to} className="footer__item">
+                          <FooterLink item={item} />
+                        </li>
+                      ),
+                    )}
                   </ul>
                 ) : null}
               </div>