diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js
index 6dffccbc8..270235b37 100644
--- a/docs/docusaurus.config.js
+++ b/docs/docusaurus.config.js
@@ -27,7 +27,12 @@ module.exports = {
       /** @type {import('@docusaurus/preset-classic').Options} */
       ({
         docs: {
-          beforeDefaultRemarkPlugins: [[remarkCodeHike, { theme: "nord" }]],
+          beforeDefaultRemarkPlugins: [
+            [
+              remarkCodeHike,
+              { theme: "monokai", showCopyButton: true, lineNumbers: true },
+            ],
+          ],
           routeBasePath: "/",
           sidebarPath: require.resolve("./sidebars.js"),
           path: "docs",
diff --git a/docs/sidebars.js b/docs/sidebars.js
index 01a84cf33..38592719d 100644
--- a/docs/sidebars.js
+++ b/docs/sidebars.js
@@ -21,6 +21,7 @@ module.exports = {
         "guidelines/collection",
         "guidelines/prompt-customization",
         "guidelines/chat-interface",
+        "guidelines/custom-component",
       ],
     },
     {
@@ -30,6 +31,7 @@ module.exports = {
       items: [
         "components/agents",
         "components/chains",
+        "components/custom",
         "components/embeddings",
         "components/llms",
         "components/loaders",