[{"data":1,"prerenderedAt":20},["ShallowReactive",2],{"clay-page:\u002F4.x\u002Fgetting-started\u002Fintroduction":3},{"html":4,"toc":5,"description":16,"hero":17,"list":18,"socialImage":19},"\u003Ch1 id=\"introduction\">Introduction\u003C\u002Fh1>\n\u003Cp>Clay turns a folder of Markdown files into a fast, searchable documentation website. You write pages in Markdown, describe your site in one small configuration file, and Clay builds a static site that you can host anywhere: GitHub Pages, Netlify, Cloudflare Pages or any web server.\u003C\u002Fp>\n\u003Cp>This website is itself a Clay site. Every page you read here is a Markdown file in the \u003Ca href=\"https:\u002F\u002Fgithub.com\u002Fclay-doc\u002Fclay-example-repo\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Ci class=\"fa-solid fa-arrow-up-right-from-square clay-external-icon\" aria-hidden=\"true\">\u003C\u002Fi>example repository\u003C\u002Fa>, and the repository doubles as a reference you can copy from.\u003C\u002Fp>\n\u003Ch2 id=\"how-it-works\">\u003Ca class=\"heading-anchor\" href=\"#how-it-works\" aria-label=\"Link to this section\" data-route=\"#how-it-works\">#\u003C\u002Fa>How it works\u003C\u002Fh2>\n\u003Cdiv class=\"mermaid-diagram\">\u003Csvg xmlns=\"http:\u002F\u002Fwww.w3.org\u002F2000\u002Fsvg\" viewBox=\"0 0 660.4360000000001 250.925\" width=\"660.4360000000001\" height=\"250.925\">\n\n\u003Cdefs>\n  \u003Cmarker id=\"diagram-1-arrowhead\" markerWidth=\"8\" markerHeight=\"5\" refX=\"7\" refY=\"2.5\" orient=\"auto\">\n    \u003Cpolygon points=\"0 0, 8 2.5, 0 5\" fill=\"var(--_arrow)\" stroke=\"var(--_arrow)\" stroke-width=\"0.75\" stroke-linejoin=\"round\">\u003C\u002Fpolygon>\n  \u003C\u002Fmarker>\n  \u003Cmarker id=\"diagram-1-arrowhead-start\" markerWidth=\"8\" markerHeight=\"5\" refX=\"1\" refY=\"2.5\" orient=\"auto-start-reverse\">\n    \u003Cpolygon points=\"8 0, 0 2.5, 8 5\" fill=\"var(--_arrow)\" stroke=\"var(--_arrow)\" stroke-width=\"0.75\" stroke-linejoin=\"round\">\u003C\u002Fpolygon>\n  \u003C\u002Fmarker>\n\u003C\u002Fdefs>\n\u003Cpolyline class=\"edge\" data-from=\"A\" data-to=\"B\" data-style=\"solid\" data-arrow-start=\"false\" data-arrow-end=\"true\" data-label=\"clay dev\" points=\"141.971,81.93333333333334 177.97100000000012,81.93333333333334 177.97100000000012,58.44999999999999 289.7950000000001,58.44999999999999\" fill=\"none\" stroke=\"var(--_line)\" stroke-width=\"1\" marker-end=\"url(#diagram-1-arrowhead)\">\u003C\u002Fpolyline>\n\u003Cpolyline class=\"edge\" data-from=\"A\" data-to=\"C\" data-style=\"solid\" data-arrow-start=\"false\" data-arrow-end=\"true\" data-label=\"clay build\" points=\"141.971,99.86666666666667 177.971,99.86666666666667 177.971,131.8 289.7950000000001,131.79999999999998\" fill=\"none\" stroke=\"var(--_line)\" stroke-width=\"1\" marker-end=\"url(#diagram-1-arrowhead)\">\u003C\u002Fpolyline>\n\u003Cpolyline class=\"edge\" data-from=\"C\" data-to=\"D\" data-style=\"solid\" data-arrow-start=\"false\" data-arrow-end=\"true\" points=\"413.9960000000001,131.79999999999998 433.1840000000001,131.79999999999998 433.1840000000001,62.675 452.37200000000007,62.675\" fill=\"none\" stroke=\"var(--_line)\" stroke-width=\"1\" marker-end=\"url(#diagram-1-arrowhead)\">\u003C\u002Fpolyline>\n\u003Cpolyline class=\"edge\" data-from=\"C\" data-to=\"E\" data-style=\"solid\" data-arrow-start=\"false\" data-arrow-end=\"true\" points=\"413.9960000000001,131.79999999999998 433.1840000000001,131.79999999999998 433.1840000000001,127.575 452.37200000000007,127.575\" fill=\"none\" stroke=\"var(--_line)\" stroke-width=\"1\" marker-end=\"url(#diagram-1-arrowhead)\">\u003C\u002Fpolyline>\n\u003Cpolyline class=\"edge\" data-from=\"C\" data-to=\"F\" data-style=\"solid\" data-arrow-start=\"false\" data-arrow-end=\"true\" points=\"413.9960000000001,131.79999999999998 433.1840000000001,131.79999999999998 433.1840000000001,192.47500000000002 452.37200000000007,192.47500000000002\" fill=\"none\" stroke=\"var(--_line)\" stroke-width=\"1\" marker-end=\"url(#diagram-1-arrowhead)\">\u003C\u002Fpolyline>\n\u003Cg class=\"edge-label\" data-from=\"A\" data-to=\"B\" data-label=\"clay dev\">\n  \u003Crect x=\"185.97100000000012\" y=\"42.44999999999999\" width=\"57.44799999999999\" height=\"30.3\" rx=\"2\" ry=\"2\" fill=\"var(--bg)\" stroke=\"var(--_inner-stroke)\" stroke-width=\"1\">\u003C\u002Frect>\n  \u003Ctext x=\"214.6950000000001\" y=\"57.59999999999999\" text-anchor=\"middle\" font-size=\"11\" font-weight=\"400\" fill=\"var(--_text-sec)\" dy=\"3.8499999999999996\">clay dev\u003C\u002Ftext>\n\u003C\u002Fg>\n\u003Cg class=\"edge-label\" data-from=\"A\" data-to=\"C\" data-label=\"clay build\">\n  \u003Crect x=\"185.971\" y=\"115.79999999999998\" width=\"62.2\" height=\"30.3\" rx=\"2\" ry=\"2\" fill=\"var(--bg)\" stroke=\"var(--_inner-stroke)\" stroke-width=\"1\">\u003C\u002Frect>\n  \u003Ctext x=\"217.071\" y=\"130.95\" text-anchor=\"middle\" font-size=\"11\" font-weight=\"400\" fill=\"var(--_text-sec)\" dy=\"3.8499999999999996\">clay build\u003C\u002Ftext>\n\u003C\u002Fg>\n\u003Cg class=\"node\" data-id=\"A\" data-label=\"docs\u002F*.md\nclay.yaml\" data-shape=\"rectangle\">\n  \u003Crect x=\"40\" y=\"64\" width=\"101.971\" height=\"53.800000000000004\" rx=\"0\" ry=\"0\" fill=\"var(--_node-fill)\" stroke=\"var(--_node-stroke)\" stroke-width=\"0.75\">\u003C\u002Frect>\n  \u003Ctext x=\"90.9855\" y=\"90.9\" text-anchor=\"middle\" font-size=\"13\" font-weight=\"500\" fill=\"var(--_text)\">\u003Ctspan x=\"90.9855\" dy=\"-3.9000000000000012\">docs\u002F*.md\u003C\u002Ftspan>\u003Ctspan x=\"90.9855\" dy=\"16.900000000000002\">clay.yaml\u003C\u002Ftspan>\u003C\u002Ftext>\n\u003C\u002Fg>\n\u003Cg class=\"node\" data-id=\"B\" data-label=\"Live preview\" data-shape=\"rectangle\">\n  \u003Crect x=\"289.7950000000001\" y=\"39.999999999999986\" width=\"118.27299999999998\" height=\"36.900000000000006\" rx=\"0\" ry=\"0\" fill=\"var(--_node-fill)\" stroke=\"var(--_node-stroke)\" stroke-width=\"0.75\">\u003C\u002Frect>\n  \u003Ctext x=\"348.9315000000001\" y=\"58.44999999999999\" text-anchor=\"middle\" font-size=\"13\" font-weight=\"500\" fill=\"var(--_text)\" dy=\"4.55\">Live preview\u003C\u002Ftext>\n\u003C\u002Fg>\n\u003Cg class=\"node\" data-id=\"C\" data-label=\"Static site\npublish\u002Fpublic\" data-shape=\"rectangle\">\n  \u003Crect x=\"289.7950000000001\" y=\"104.89999999999999\" width=\"124.20100000000001\" height=\"53.800000000000004\" rx=\"0\" ry=\"0\" fill=\"var(--_node-fill)\" stroke=\"var(--_node-stroke)\" stroke-width=\"0.75\">\u003C\u002Frect>\n  \u003Ctext x=\"351.8955000000001\" y=\"131.79999999999998\" text-anchor=\"middle\" font-size=\"13\" font-weight=\"500\" fill=\"var(--_text)\">\u003Ctspan x=\"351.8955000000001\" dy=\"-3.9000000000000012\">Static site\u003C\u002Ftspan>\u003Ctspan x=\"351.8955000000001\" dy=\"16.900000000000002\">publish\u002Fpublic\u003C\u002Ftspan>\u003C\u002Ftext>\n\u003C\u002Fg>\n\u003Cg class=\"node\" data-id=\"D\" data-label=\"GitHub Pages\" data-shape=\"rectangle\">\n  \u003Crect x=\"452.37200000000007\" y=\"44.224999999999994\" width=\"121.237\" height=\"36.900000000000006\" rx=\"0\" ry=\"0\" fill=\"var(--_node-fill)\" stroke=\"var(--_node-stroke)\" stroke-width=\"0.75\">\u003C\u002Frect>\n  \u003Ctext x=\"512.9905000000001\" y=\"62.675\" text-anchor=\"middle\" font-size=\"13\" font-weight=\"500\" fill=\"var(--_text)\" dy=\"4.55\">GitHub Pages\u003C\u002Ftext>\n\u003C\u002Fg>\n\u003Cg class=\"node\" data-id=\"E\" data-label=\"Netlify, Cloudflare, …\" data-shape=\"rectangle\">\n  \u003Crect x=\"452.37200000000007\" y=\"109.125\" width=\"156.06400000000002\" height=\"36.900000000000006\" rx=\"0\" ry=\"0\" fill=\"var(--_node-fill)\" stroke=\"var(--_node-stroke)\" stroke-width=\"0.75\">\u003C\u002Frect>\n  \u003Ctext x=\"530.4040000000001\" y=\"127.575\" text-anchor=\"middle\" font-size=\"13\" font-weight=\"500\" fill=\"var(--_text)\" dy=\"4.55\">Netlify, Cloudflare, …\u003C\u002Ftext>\n\u003C\u002Fg>\n\u003Cg class=\"node\" data-id=\"F\" data-label=\"Any web server\" data-shape=\"rectangle\">\n  \u003Crect x=\"452.37200000000007\" y=\"174.025\" width=\"135.316\" height=\"36.900000000000006\" rx=\"0\" ry=\"0\" fill=\"var(--_node-fill)\" stroke=\"var(--_node-stroke)\" stroke-width=\"0.75\">\u003C\u002Frect>\n  \u003Ctext x=\"520.0300000000001\" y=\"192.47500000000002\" text-anchor=\"middle\" font-size=\"13\" font-weight=\"500\" fill=\"var(--_text)\" dy=\"4.55\">Any web server\u003C\u002Ftext>\n\u003C\u002Fg>\n\u003C\u002Fsvg>\u003C\u002Fdiv>\n\u003Cp>A Clay project is a folder with a configuration file and your docs:\u003C\u002Fp>\n\u003Cdiv class=\"file-tree not-prose\">\u003Cul>\u003Cli>\u003Cdetails open=\"\">\u003Csummary class=\"file-tree-entry file-tree-folder\">\u003Ci class=\"fa-solid fa-chevron-right file-tree-chevron\" aria-hidden=\"true\">\u003C\u002Fi>\u003Ci class=\"fa-solid fa-folder-open file-tree-open\" aria-hidden=\"true\">\u003C\u002Fi>\u003Ci class=\"fa-solid fa-folder file-tree-closed\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"file-tree-name\">my-project\u003C\u002Fspan>\u003C\u002Fsummary>\u003Cul>\u003Cli>\u003Cspan class=\"file-tree-entry\">\u003Cspan class=\"file-tree-chevron\" aria-hidden=\"true\">\u003C\u002Fspan>\u003Ci class=\"fa-regular fa-file-code\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"file-tree-name\">clay.yaml\u003C\u002Fspan>\u003Cspan class=\"file-tree-comment\">site title and links\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003Cli>\u003Cdetails open=\"\">\u003Csummary class=\"file-tree-entry file-tree-folder\">\u003Ci class=\"fa-solid fa-chevron-right file-tree-chevron\" aria-hidden=\"true\">\u003C\u002Fi>\u003Ci class=\"fa-solid fa-folder-open file-tree-open\" aria-hidden=\"true\">\u003C\u002Fi>\u003Ci class=\"fa-solid fa-folder file-tree-closed\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"file-tree-name\">docs\u003C\u002Fspan>\u003Cspan class=\"file-tree-comment\">your Markdown pages, images and files\u003C\u002Fspan>\u003C\u002Fsummary>\u003Cul>\u003Cli>\u003Cspan class=\"file-tree-entry\">\u003Cspan class=\"file-tree-chevron\" aria-hidden=\"true\">\u003C\u002Fspan>\u003Ci class=\"fa-brands fa-markdown\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"file-tree-name\">index.md\u003C\u002Fspan>\u003Cspan class=\"file-tree-comment\">optional: the start page\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fdetails>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fdetails>\u003C\u002Fli>\u003C\u002Ful>\u003C\u002Fdiv>\n\u003Cp>You work with three commands:\u003C\u002Fp>\n\u003Cdiv class=\"code-block is-terminal has-bar\">\u003Cdiv class=\"code-terminal\" aria-hidden=\"true\">\u003Cspan>\u003C\u002Fspan>\u003Cspan>\u003C\u002Fspan>\u003Cspan>\u003C\u002Fspan>\u003C\u002Fdiv>\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 command\">\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">npx\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> clay\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> dev\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#006400;--shiki-dark:#6A9955\">       # live preview while you write\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line command\">\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">npx\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> clay\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> build\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#006400;--shiki-dark:#6A9955\">     # build the static site into publish\u002Fpublic\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line command\">\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">npx\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> clay\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> preview\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#006400;--shiki-dark:#6A9955\">   # check the build the way a web host serves it\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>Clay is a single npm package, \u003Ccode>clay-doc\u003C\u002Fcode>. It builds on \u003Ca href=\"https:\u002F\u002Fnuxt.com\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Ci class=\"fa-solid fa-arrow-up-right-from-square clay-external-icon\" aria-hidden=\"true\">\u003C\u002Fi>Nuxt\u003C\u002Fa> and \u003Ca href=\"https:\u002F\u002Fvuejs.org\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Ci class=\"fa-solid fa-arrow-up-right-from-square clay-external-icon\" aria-hidden=\"true\">\u003C\u002Fi>Vue\u003C\u002Fa>, but you never touch either: there is no theme to set up and no code to write.\u003C\u002Fp>\n\u003Ch2 id=\"what-you-get\">\u003Ca class=\"heading-anchor\" href=\"#what-you-get\" aria-label=\"Link to this section\" data-route=\"#what-you-get\">#\u003C\u002Fa>What you get\u003C\u002Fh2>\n\u003Cdiv class=\"clay-cards not-prose\">\u003Ca class=\"clay-card\" href=\"\u002Fclay-example-repo\u002F4.x\u002Ffeatures\u002Fai-and-agents\" data-route=\"\u002F4.x\u002Ffeatures\u002Fai-and-agents\">\u003Ci class=\"clay-card-icon fa-solid fa-robot\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"clay-card-title\">Ready for AI\u003C\u002Fspan>\u003Cspan class=\"clay-card-text\">Every page as Markdown, llms.txt, and commands that coding agents understand.\u003C\u002Fspan>\u003C\u002Fa>\u003Ca class=\"clay-card\" href=\"\u002Fclay-example-repo\u002F4.x\u002Forganizing\u002Fnavigation\" data-route=\"\u002F4.x\u002Forganizing\u002Fnavigation\">\u003Ci class=\"clay-card-icon fa-solid fa-sitemap\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"clay-card-title\">Navigation\u003C\u002Fspan>\u003Cspan class=\"clay-card-text\">A sidebar from your folders, breadcrumbs, and previous and next links on every page.\u003C\u002Fspan>\u003C\u002Fa>\u003Ca class=\"clay-card\" href=\"\u002Fclay-example-repo\u002F4.x\u002Ffeatures\u002Fsearch\" data-route=\"\u002F4.x\u002Ffeatures\u002Fsearch\">\u003Ci class=\"clay-card-icon fa-solid fa-magnifying-glass\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"clay-card-title\">Search\u003C\u002Fspan>\u003Cspan class=\"clay-card-text\">Every page and section, typos forgiven, filtered by section.\u003C\u002Fspan>\u003C\u002Fa>\u003Ca class=\"clay-card\" href=\"\u002Fclay-example-repo\u002F4.x\u002Fwriting\u002Fcode-blocks\" data-route=\"\u002F4.x\u002Fwriting\u002Fcode-blocks\">\u003Ci class=\"clay-card-icon fa-solid fa-code\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"clay-card-title\">Code\u003C\u002Fspan>\u003Cspan class=\"clay-card-text\">Highlighting for over 200 languages, highlighted lines, diffs and a copy button.\u003C\u002Fspan>\u003C\u002Fa>\u003Ca class=\"clay-card\" href=\"\u002Fclay-example-repo\u002F4.x\u002Fwriting\u002Fcomponents\" data-route=\"\u002F4.x\u002Fwriting\u002Fcomponents\">\u003Ci class=\"clay-card-icon fa-solid fa-puzzle-piece\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"clay-card-title\">Components\u003C\u002Fspan>\u003Cspan class=\"clay-card-text\">Tabs, steps, cards, diagrams, math and file trees in plain Markdown.\u003C\u002Fspan>\u003C\u002Fa>\u003Ca class=\"clay-card\" href=\"\u002Fclay-example-repo\u002F4.x\u002Ffeatures\u002Fseo\" data-route=\"\u002F4.x\u002Ffeatures\u002Fseo\">\u003Ci class=\"clay-card-icon fa-solid fa-chart-line\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"clay-card-title\">Search engines\u003C\u002Fspan>\u003Cspan class=\"clay-card-text\">Titles, descriptions, canonical links, a sitemap and structured data.\u003C\u002Fspan>\u003C\u002Fa>\u003Ca class=\"clay-card\" href=\"\u002Fclay-example-repo\u002F4.x\u002Ffeatures\u002Fthemes-and-icons\" data-route=\"\u002F4.x\u002Ffeatures\u002Fthemes-and-icons\">\u003Ci class=\"clay-card-icon fa-solid fa-circle-half-stroke\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"clay-card-title\">Light and dark\u003C\u002Fspan>\u003Cspan class=\"clay-card-text\">Follows the reader's system, with a switch that remembers their choice.\u003C\u002Fspan>\u003C\u002Fa>\u003Ca class=\"clay-card\" href=\"\u002Fclay-example-repo\u002F4.x\u002Forganizing\u002Fversions\" data-route=\"\u002F4.x\u002Forganizing\u002Fversions\">\u003Ci class=\"clay-card-icon fa-solid fa-code-branch\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"clay-card-title\">Versions\u003C\u002Fspan>\u003Cspan class=\"clay-card-text\">The docs of older releases stay online, with a version switcher.\u003C\u002Fspan>\u003C\u002Fa>\u003Ca class=\"clay-card\" href=\"\u002Fclay-example-repo\u002F4.x\u002Forganizing\u002Ftranslations\" data-route=\"\u002F4.x\u002Forganizing\u002Ftranslations\">\u003Ci class=\"clay-card-icon fa-solid fa-language\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan class=\"clay-card-title\">Languages\u003C\u002Fspan>\u003Cspan class=\"clay-card-text\">Translate page by page; untranslated pages show the original.\u003C\u002Fspan>\u003C\u002Fa>\u003C\u002Fdiv>\n\u003Cp>Every page is pre-rendered to HTML: it loads fast, works without JavaScript and fits small screens, with the navigation in a drawer.\u003C\u002Fp>\n\u003Ch2 id=\"where-to-go-next\">\u003Ca class=\"heading-anchor\" href=\"#where-to-go-next\" aria-label=\"Link to this section\" data-route=\"#where-to-go-next\">#\u003C\u002Fa>Where to go next\u003C\u002Fh2>\n\u003Cdiv class=\"clay-steps\">\u003Col>\n\u003Cli>\u003Cstrong>Install Clay\u003C\u002Fstrong>, see \u003Ca href=\"\u002Fclay-example-repo\u002F4.x\u002Fgetting-started\u002Finstallation\" data-route=\"\u002F4.x\u002Fgetting-started\u002Finstallation\">installation\u003C\u002Fa>.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Build a first site\u003C\u002Fstrong> in five minutes with the \u003Ca href=\"\u002Fclay-example-repo\u002F4.x\u002Fgetting-started\u002Fquick-start\" data-route=\"\u002F4.x\u002Fgetting-started\u002Fquick-start\">quick start\u003C\u002Fa>.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Write your pages\u003C\u002Fstrong>, see \u003Ca href=\"\u002Fclay-example-repo\u002F4.x\u002Fwriting\" data-route=\"\u002F4.x\u002Fwriting\">Writing\u003C\u002Fa>.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Publish\u003C\u002Fstrong> on \u003Ca href=\"\u002Fclay-example-repo\u002F4.x\u002Fpublishing\u002Fgithub-pages\" data-route=\"\u002F4.x\u002Fpublishing\u002Fgithub-pages\">GitHub Pages\u003C\u002Fa> or \u003Ca href=\"\u002Fclay-example-repo\u002F4.x\u002Fpublishing\u002Fother-hosts\" data-route=\"\u002F4.x\u002Fpublishing\u002Fother-hosts\">another host\u003C\u002Fa>.\u003C\u002Fli>\n\u003C\u002Fol>\n\u003C\u002Fdiv>\n\u003Cdiv class=\"markdown-alert markdown-alert-note\">\n\u003Cp class=\"markdown-alert-title text-base-content\">\u003Ci class=\"fa-solid fa-sticky-note mr-2\">\u003C\u002Fi>Note\u003C\u002Fp>\n\u003Cp>Coming from Clay 1 and Clay Oven? Start with \u003Ca href=\"\u002Fclay-example-repo\u002F4.x\u002Fguides\u002Fupgrading-to-clay-2\" data-route=\"\u002F4.x\u002Fguides\u002Fupgrading-to-clay-2\">upgrading to Clay 2\u003C\u002Fa>.\u003C\u002Fp>\n\u003C\u002Fdiv>\n",[6,10,13],{"id":7,"text":8,"level":9},"how-it-works","How it works",2,{"id":11,"text":12,"level":9},"what-you-get","What you get",{"id":14,"text":15,"level":9},"where-to-go-next","Where to go next","What Clay is, what it does for you and how a Clay site comes together.",null,false,"\u002F_clay\u002Fsocial\u002F4.x\u002Fgetting-started\u002Fintroduction.png",1792666369242]