[{"data":1,"prerenderedAt":20},["ShallowReactive",2],{"clay-page:\u002F3.x\u002Forganizing\u002Findex-pages":3},{"html":4,"toc":5,"description":16,"hero":17,"list":18,"socialImage":19},"\u003Ch1 id=\"index-pages\">Index Pages\u003C\u002Fh1>\n\u003Cp>Every folder has a page at its URL, and the site has a start page at its root. Both are written in Markdown, in a file named \u003Ccode>index.md\u003C\u002Fcode>:\u003C\u002Fp>\n\u003Ctable>\n\u003Cthead>\n\u003Ctr>\n\u003Cth>File\u003C\u002Fth>\n\u003Cth>Page\u003C\u002Fth>\n\u003C\u002Ftr>\n\u003C\u002Fthead>\n\u003Ctbody>\u003Ctr>\n\u003Ctd>\u003Ccode>docs\u002Findex.md\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>The start page, \u003Ccode>\u002F\u003C\u002Fcode>\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>\u003Ccode>docs\u002Fguides\u002Findex.md\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>The page of the folder \u003Ccode>guides\u003C\u002Fcode>, \u003Ccode>\u002Fguides\u003C\u002Fcode>\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>\u003Ccode>docs\u002Fguides\u002Findex.de.md\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>Its German translation, \u003Ccode>\u002Fde\u002Fguides\u003C\u002Fcode>\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003C\u002Ftbody>\u003C\u002Ftable>\n\u003Cp>An index page is a page like any other, with a heading, text, links, code and alerts. Its front matter also names the folder, see \u003Ca href=\"\u002Fclay-example-repo\u002F3.x\u002Forganizing\u002Ffolders\" data-route=\"\u002F3.x\u002Forganizing\u002Ffolders\">folders\u003C\u002Fa>.\u003C\u002Fp>\n\u003Ch2 id=\"a-list-of-pages-and-a-large-header\">\u003Ca class=\"heading-anchor\" href=\"#a-list-of-pages-and-a-large-header\" aria-label=\"Link to this section\" data-route=\"#a-list-of-pages-and-a-large-header\">#\u003C\u002Fa>A list of pages and a large header\u003C\u002Fh2>\n\u003Cp>Two front matter fields lay out index pages:\u003C\u002Fp>\n\u003Ctable>\n\u003Cthead>\n\u003Ctr>\n\u003Cth>Field\u003C\u002Fth>\n\u003Cth>Effect\u003C\u002Fth>\n\u003C\u002Ftr>\n\u003C\u002Fthead>\n\u003Ctbody>\u003Ctr>\n\u003Ctd>\u003Ccode>list: true\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>Lists the folder’s pages and subfolders below the text, under the heading “In this section”\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>\u003Ccode>hero: true\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>Shows \u003Ccode>title\u003C\u002Fcode>, \u003Ccode>icon\u003C\u002Fcode> and \u003Ccode>description\u003C\u002Fcode> as a large, centered header above the text\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003C\u002Ftbody>\u003C\u002Ftable>\n\u003Cp>The start page of this site uses both fields:\u003C\u002Fp>\n\u003Cdiv class=\"code-block\">\u003Cpre class=\"shiki shiki-themes light-plus dark-plus\" style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4;--shiki-light-bg:#FFFFFF;--shiki-dark-bg:#1E1E1E\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">---\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#569CD6\">title\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#CE9178\">Clay Documentation\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#569CD6\">icon\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#CE9178\">fa-solid fa-book-open\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#569CD6\">description\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#CE9178\">Turn a folder of Markdown files into a fast, searchable documentation website.\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#569CD6\">hero\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">true\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#569CD6\">list\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">true\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">---\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">New to Clay? Read the [\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">introduction\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">](\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-light-text-decoration:underline;--shiki-dark:#D4D4D4;--shiki-dark-text-decoration:underline\">introduction.md\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">) …\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Copy code\" aria-label=\"Copy code\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003Cp>With \u003Ccode>hero: true\u003C\u002Fcode>, leave out the \u003Ccode># heading\u003C\u002Fcode>: the header shows the title already.\u003C\u002Fp>\n\u003Ch2 id=\"folders-without-an-index-page\">\u003Ca class=\"heading-anchor\" href=\"#folders-without-an-index-page\" aria-label=\"Link to this section\" data-route=\"#folders-without-an-index-page\">#\u003C\u002Fa>Folders without an index page\u003C\u002Fh2>\n\u003Cp>A folder without an \u003Ccode>index.md\u003C\u002Fcode>, or one whose \u003Ccode>index.md\u003C\u002Fcode> has no text, gets a page made of its title, its icon and the list of its pages. The site works without any \u003Ccode>index.md\u003C\u002Fcode>; add them where a folder deserves an introduction.\u003C\u002Fp>\n\u003Cp>Without \u003Ccode>docs\u002Findex.md\u003C\u002Fcode>, the start page shows the site title and a list of the top-level pages and folders.\u003C\u002Fp>\n\u003Ch2 id=\"in-the-sidebar\">\u003Ca class=\"heading-anchor\" href=\"#in-the-sidebar\" aria-label=\"Link to this section\" data-route=\"#in-the-sidebar\">#\u003C\u002Fa>In the sidebar\u003C\u002Fh2>\n\u003Cp>A folder’s title in the sidebar opens its page; the arrow next to it shows and hides the pages in it. Breadcrumbs and links to a folder lead to its page too, and so do links to \u003Ccode>index.md\u003C\u002Fcode>:\u003C\u002Fp>\n\u003Cdiv class=\"code-block\">\u003Cpre class=\"shiki shiki-themes light-plus dark-plus\" style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4;--shiki-light-bg:#FFFFFF;--shiki-dark-bg:#1E1E1E\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">[\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">All guides\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">](\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-light-text-decoration:underline;--shiki-dark:#D4D4D4;--shiki-dark-text-decoration:underline\">guides\u002Findex.md\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">)\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">[\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">All guides\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">](\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-light-text-decoration:underline;--shiki-dark:#D4D4D4;--shiki-dark-text-decoration:underline\">guides\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">)\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Copy code\" aria-label=\"Copy code\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003Cp>Links inside an \u003Ccode>index.md\u003C\u002Fcode> are relative to its folder, like on GitHub: in \u003Ccode>docs\u002Fguides\u002Findex.md\u003C\u002Fcode>, \u003Ccode>[Setup](setup.md)\u003C\u002Fcode> leads to \u003Ccode>docs\u002Fguides\u002Fsetup.md\u003C\u002Fcode>.\u003C\u002Fp>\n\u003Cdiv class=\"markdown-alert markdown-alert-tip\">\n\u003Cp class=\"markdown-alert-title text-primary\">\u003Ci class=\"fa-solid fa-lightbulb mr-2\">\u003C\u002Fi>Tip\u003C\u002Fp>\n\u003Cp>Folder pages appear in search results, and the previous and next links lead through them, before the pages of their folder.\u003C\u002Fp>\n\u003C\u002Fdiv>\n",[6,10,13],{"id":7,"text":8,"level":9},"a-list-of-pages-and-a-large-header","A list of pages and a large header",2,{"id":11,"text":12,"level":9},"folders-without-an-index-page","Folders without an index page",{"id":14,"text":15,"level":9},"in-the-sidebar","In the sidebar","The start page and the page of every folder are Markdown files named index.md, with an optional list of pages and a large header.",null,false,"\u002F_clay\u002Fsocial\u002F3.x\u002Forganizing\u002Findex-pages.png",1792666368922]