{"componentChunkName":"component---src-templates-simple-markdown-js","path":"/developer-portal/awesome/folders/","matchPath":"","result":{"data":{"markdownRemark":{"html":"<h1 style=\"position:relative;\"><a href=\"#folder-structure-training\" aria-label=\"folder structure training permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><div class=\"hidden-anchor\" id=\"folder-structure-training\"></div>Folder structure training</h1>\n<h2 style=\"position:relative;\"><a href=\"#changing-url-paths\" aria-label=\"changing url paths permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><div class=\"hidden-anchor\" id=\"changing-url-paths\"></div>Changing URL paths</h2>\n<p>The filename is used in the URL path and so is the folder.\nNested folders will result in deep paths.</p>\n<p>If you look at the path for this page, you'll see it is at <code class=\"language-text\">/developer-portal/awesome/folders</code>.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 910px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 53.07017543859649%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAALCAIAAADwazoUAAAACXBIWXMAABYlAAAWJQFJUiTwAAACEElEQVQoz5WPS28SURTHZ6MSEL8CMmhraGNsTE1JQ6rGnW0lklKYoVMo0HShK2tbH59CKv0WtBZKrXbhhhBCQgIBEyOPQEhnigwD02HuPJipl1HiI27855+bc885v3PvQSZtdpv93tT0zK3bd6btd2fuP7g5YXM4xrc2zOvP0Ofr5heb6Msty+YGjC2vX6EEYTJfu4FeHxixevxj+MqIizA/xsxODHXiJgdmxd1TawuTq4sTQc+4Dx/1EhbP8lWXf2TJP7biQz0BFAuieAgZDTyxBp+avCHjI0w3u6ifc+vn3bpZ7MJD78W5pUvzhM5B6J3LhgXfZZff4AoYXCGjJ2TEVq9415DwXuxNNLa9G4+8O9jei4ej++FoLLwbe7ufiMQPIzHN8feajyIHRzuJDzuJjwMfHiMix0mAlwEQez1Fls//R8gJSZ6Q1GmzSVIU0+kAQeQBOOM4UZL7isrxPM0w7U6ny7Kw2uNBX1VlRflhhGVZkiRPNQEAZFmWNCmKAmf3JUno9QA04GGnIAh/vNztdhmGoWkawhzH/QWzgkixXBt+RvrHRgjEGo0GHAEBURTloRRVheXqN/r489dPX8rVVhteVS35C67X6+VyuVarURRFD9VqteCg3/sg1u/DfVVFE8zAcwBXq9VKpQL55lA/91fPS6VSMpnMZDKpVCqdTheLxXw+n81mc7lcoVD4Dsf+51rT4F19AAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"path\"\n        title=\"path\"\n        src=\"/static/33e6a3f2c3c18f6e508eba9b235d81ef/c6bbc/folders-url.png\"\n        srcset=\"/static/33e6a3f2c3c18f6e508eba9b235d81ef/d4770/folders-url.png 228w,\n/static/33e6a3f2c3c18f6e508eba9b235d81ef/379c3/folders-url.png 455w,\n/static/33e6a3f2c3c18f6e508eba9b235d81ef/c6bbc/folders-url.png 910w,\n/static/33e6a3f2c3c18f6e508eba9b235d81ef/33d1d/folders-url.png 1150w\"\n        sizes=\"(max-width: 910px) 100vw, 910px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p>The title of the page is <code class=\"language-text\">Folder structure training</code> and doesn't match the path.</p>\n<p><span\n      class=\"gatsby-resp-image-wrapper\"\n      style=\"position: relative; display: block; margin-left: auto; margin-right: auto; max-width: 420px; \"\n    >\n      <span\n    class=\"gatsby-resp-image-background-image\"\n    style=\"padding-bottom: 35.08771929824561%; position: relative; bottom: 0; left: 0; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAHCAIAAACHqfpvAAAACXBIWXMAABYlAAAWJQFJUiTwAAABDklEQVQY02WNWW7CMBgGOUqJt3iJ7RDb2TEOhSZhK4gb9P53qGlfEEjz8En2/LMwxiilEMQYE5RSDAmngjNOCWWEMcoFFQggsAQQIoTwM4t/GQColZZa1ddQnnz9HerLpr4NZteYr9ZNXX0OxbaGCUT4TY5XU5ISSoXRTAmey8zlEcqZjMPouLnOXuIPWcpYjheJFFLksjytY8rN/V+zx2mafCTJEoAERvmZRVEUWueUcs4zmalMChvavHGrtlTO6MrGJ4IpZSKOF6K8ssZVpa9c138e/f2nC2G4n4fb0R/Gfr8Ll3lzmqpy/c6jbIy1tnW2bdbbZn9thhBu83A/+Mvkj6M/T924s6aNf174BSzMUnRd+ysyAAAAAElFTkSuQmCC'); background-size: cover; display: block;\"\n  ></span>\n  <img\n        class=\"gatsby-resp-image-image\"\n        alt=\"path\"\n        title=\"path\"\n        src=\"/static/ed32cb261c95265b34d197fa8daf98e3/d10fb/folders-path.png\"\n        srcset=\"/static/ed32cb261c95265b34d197fa8daf98e3/d4770/folders-path.png 228w,\n/static/ed32cb261c95265b34d197fa8daf98e3/d10fb/folders-path.png 420w\"\n        sizes=\"(max-width: 420px) 100vw, 420px\"\n        style=\"width:100%;height:100%;margin:0;vertical-align:middle;position:absolute;top:0;left:0;\"\n        loading=\"lazy\"\n      />\n    </span></p>\n<p>The path is generated from the folder structure path and filename less the filename extension (<code class=\"language-text\">.md</code> in this case).\nIf the file is named <code class=\"language-text\">index.md</code> or <code class=\"language-text\">index.mdx</code> the filename does not appear in the URL path.</p>\n<p>If we renamed <code class=\"language-text\">folders.md</code> to <code class=\"language-text\">index.md</code> and left it in the same folder, what would the URL be?</p>\n<ul>\n<li>\n<code class=\"language-text\">http://localhost:3000/developer-portal/awesome/</code>\n</li>\n</ul>\n<p>Let's try it out...</p>\n<h3 style=\"position:relative;\"><a href=\"#rename-to-index\" aria-label=\"rename to index permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><div class=\"hidden-anchor\" id=\"rename-to-index\"></div>Rename to index</h3>\n<p>Rename the <code class=\"language-text\">folders.md</code> file to <code class=\"language-text\">index.md</code>.</p>\n<p>You will also need to change references to that file, which exist in the <code class=\"language-text\">sidebars.yaml</code> file located in the root directory.</p>\n\n      <div class=\"code-snippets-tabs\" >\n    <div class=\"snippets-tabs-headers\">\n      <span class=\"tab-header active\" data-lang=\"yaml\" data-snippet-id=\"Original\">Original</span><span class=\"tab-header \" data-lang=\"yaml\" data-snippet-id=\"New\">New</span>\n    </div>\n    <div class=\"snippets-tabs-contents\">\n      <div class=\"tab-content active\" data-lang=\"yaml\" data-snippet-id=\"Original\"><div class=\"code-wrapper\">\n        <div class=\"gatsby-code-button-container\"\n             data-toaster-id=\"97288957983189810000\"\n             data-toaster-duration=\"1500\"\n             onClick=\"copyCodeToClipboard(`      - label: Folder structure\n        page: developer-portal/awesome/folders.md`, `97288957983189810000`)\"\n        >\n          <div class=\"gatsby-code-button\" title=\"Copy the code snippet\">Copy</div>\n          <div class=\"done-indicator done-indicator-97288957983189810000\">Copied</div>\n        </div>\n        <div class=\"gatsby-highlight\" data-language=\"yaml\"><pre class=\"language-yaml\"><code class=\"language-yaml\">      <span class=\"token punctuation\">-</span> <span class=\"token key atrule\">label</span><span class=\"token punctuation\">:</span> Folder structure\n        <span class=\"token key atrule\">page</span><span class=\"token punctuation\">:</span> developer<span class=\"token punctuation\">-</span>portal/awesome/folders.md</code></pre></div>\n      </div></div><div class=\"tab-content \" data-lang=\"yaml\" data-snippet-id=\"New\"><div class=\"code-wrapper\">\n        <div class=\"gatsby-code-button-container\"\n             data-toaster-id=\"94206534870223440000\"\n             data-toaster-duration=\"1500\"\n             onClick=\"copyCodeToClipboard(`      - label: Folder structure\n        page: developer-portal/awesome/index.md`, `94206534870223440000`)\"\n        >\n          <div class=\"gatsby-code-button\" title=\"Copy the code snippet\">Copy</div>\n          <div class=\"done-indicator done-indicator-94206534870223440000\">Copied</div>\n        </div>\n        <div class=\"gatsby-highlight\" data-language=\"yaml\"><pre class=\"language-yaml\"><code class=\"language-yaml\">      <span class=\"token punctuation\">-</span> <span class=\"token key atrule\">label</span><span class=\"token punctuation\">:</span> Folder structure\n        <span class=\"token key atrule\">page</span><span class=\"token punctuation\">:</span> developer<span class=\"token punctuation\">-</span>portal/awesome/index.md</code></pre></div>\n      </div></div>\n    </div></div>\n    \n<p>Great? Now, revert the name back to <code class=\"language-text\">folders.md</code> and revert the change in the <code class=\"language-text\">sidebars.yaml</code> file.</p>\n<h3 style=\"position:relative;\"><a href=\"#move-the-file-to-a-different-folder\" aria-label=\"move the file to a different folder permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><div class=\"hidden-anchor\" id=\"move-the-file-to-a-different-folder\"></div>Move the file to a different folder</h3>\n<p>Move this <code class=\"language-text\">folders.md</code> to the root directory.\nThe root directory means it will site side-by-side with other files and folders such as <code class=\"language-text\">siteConfig.yaml</code> and <code class=\"language-text\">sidebars.yaml</code>.</p>\n<p>This file is referenced in <code class=\"language-text\">sidebars.yaml</code>.\nAdjust the relative path to the file from there again.</p>\n\n      <div class=\"code-snippets-tabs\" >\n    <div class=\"snippets-tabs-headers\">\n      <span class=\"tab-header active\" data-lang=\"yaml\" data-snippet-id=\"Original\">Original</span><span class=\"tab-header \" data-lang=\"yaml\" data-snippet-id=\"New\">New</span>\n    </div>\n    <div class=\"snippets-tabs-contents\">\n      <div class=\"tab-content active\" data-lang=\"yaml\" data-snippet-id=\"Original\"><div class=\"code-wrapper\">\n        <div class=\"gatsby-code-button-container\"\n             data-toaster-id=\"99243700048127820000\"\n             data-toaster-duration=\"1500\"\n             onClick=\"copyCodeToClipboard(`      - label: Folder structure\n        page: developer-portal/awesome/folders.md`, `99243700048127820000`)\"\n        >\n          <div class=\"gatsby-code-button\" title=\"Copy the code snippet\">Copy</div>\n          <div class=\"done-indicator done-indicator-99243700048127820000\">Copied</div>\n        </div>\n        <div class=\"gatsby-highlight\" data-language=\"yaml\"><pre class=\"language-yaml\"><code class=\"language-yaml\">      <span class=\"token punctuation\">-</span> <span class=\"token key atrule\">label</span><span class=\"token punctuation\">:</span> Folder structure\n        <span class=\"token key atrule\">page</span><span class=\"token punctuation\">:</span> developer<span class=\"token punctuation\">-</span>portal/awesome/folders.md</code></pre></div>\n      </div></div><div class=\"tab-content \" data-lang=\"yaml\" data-snippet-id=\"New\"><div class=\"code-wrapper\">\n        <div class=\"gatsby-code-button-container\"\n             data-toaster-id=\"39998810429632160000\"\n             data-toaster-duration=\"1500\"\n             onClick=\"copyCodeToClipboard(`      - label: Folder structure\n        page: folders.md`, `39998810429632160000`)\"\n        >\n          <div class=\"gatsby-code-button\" title=\"Copy the code snippet\">Copy</div>\n          <div class=\"done-indicator done-indicator-39998810429632160000\">Copied</div>\n        </div>\n        <div class=\"gatsby-highlight\" data-language=\"yaml\"><pre class=\"language-yaml\"><code class=\"language-yaml\">      <span class=\"token punctuation\">-</span> <span class=\"token key atrule\">label</span><span class=\"token punctuation\">:</span> Folder structure\n        <span class=\"token key atrule\">page</span><span class=\"token punctuation\">:</span> folders.md</code></pre></div>\n      </div></div>\n    </div></div>\n    \n<p>Adjust the relative path to the images within the actual file too.</p>\n<p>If the image is broken (does not load), it indicates the path to the image is incorrect.</p>\n<p>The current directory means the directory where the markdown file is located.\nThe <code class=\"language-text\">./</code> start means starting from the current directory.\nThe <code class=\"language-text\">../</code> moves up to the parent directory.\nAnd <code class=\"language-text\">../../</code> moves up two levels.\nAnd so on.</p>\n<h2 style=\"position:relative;\"><a href=\"#troubleshooting\" aria-label=\"troubleshooting permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a><div class=\"hidden-anchor\" id=\"troubleshooting\"></div>Troubleshooting</h2>\n<p>Files, folders, and navigation paths may be cached.\nIf your page isn't loading check if you have the correct path in the browser.\nIf it still isn't loading, <a href=\"/developer-portal/install#clearing-cache\">try the <code class=\"language-text\">yarn clean</code> fix</a>.</p>","headings":[{"value":"Folder structure training","depth":1},{"value":"Changing URL paths","depth":2},{"value":"Rename to index","depth":3},{"value":"Move the file to a different folder","depth":3},{"value":"Troubleshooting","depth":2}]},"contentItem":{"data":{"lastModified":"2025-12-17T21:55:39.000Z","enableToc":null,"disableLastModified":null,"tocMaxDepth":null,"requestLogin":false}},"siteConfig":{"enableToc":true,"disableLastModified":false,"tocMaxDepth":4}},"pageContext":{"matchPath":"","id":"6fdadb5a-f4bd-55ef-912c-4258ce7ef58d__redocly content/developer-portal/awesome/folders/","seo":{"title":"Folder structure training","description":null,"image":"","keywords":null,"jsonLd":null,"lang":null},"pageId":"developer-portal/awesome/folders.md","pageBaseUrl":"/developer-portal/awesome/folders","type":"markdown","toc":{"enable":true,"maxDepth":4,"headings":[{"depth":1,"value":"Folder structure training","id":"folder-structure-training"},{"depth":2,"value":"Changing URL paths","id":"changing-url-paths"},{"depth":3,"value":"Rename to index","id":"rename-to-index"},{"depth":3,"value":"Move the file to a different folder","id":"move-the-file-to-a-different-folder"},{"depth":2,"value":"Troubleshooting","id":"troubleshooting"}]},"data":{"title":""},"catalogInfo":null,"link":"/developer-portal/awesome/folders/","sidebarName":"","isLanding":false,"showPrevButton":null,"showNextButton":null,"apiVersions":null,"apiVersionId":null,"isDefaultApiVersion":null}},"staticQueryHashes":["1123603147","1180902673","1302185487","1344209882","1398840060","1520077861","1975142765","2667623876","2950305614","3743992808","561138138"]}