[{"data":1,"prerenderedAt":29},["ShallowReactive",2],{"clay-page:\u002F4.x\u002Fde\u002Fwriting\u002Fcode-blocks":3},{"html":4,"toc":5,"description":25,"hero":26,"list":27,"socialImage":28},"\u003Ch1 id=\"codeblöcke\">Codeblöcke\u003C\u002Fh1>\n\u003Cp>Umschließe Code mit drei Backticks und nenne seine Sprache. Clay hebt ihn mit \u003Ca href=\"https:\u002F\u002Fshiki.style\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Ci class=\"fa-solid fa-arrow-up-right-from-square clay-external-icon\" aria-hidden=\"true\">\u003C\u002Fi>Shiki\u003C\u002Fa> hervor, dem Highlighter von VS Code, in passenden Farben für das helle und das dunkle Design.\u003C\u002Fp>\n\u003Cdiv class=\"clay-tabs\" data-tabs=\"\">\u003Cdiv role=\"tablist\" class=\"tabs tabs-border not-prose\">\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-1-0\" class=\"tab tab-active\" aria-controls=\"clay-tabs-1-0-panel\" aria-selected=\"true\" tabindex=\"0\">Ergebnis\u003C\u002Fbutton>\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-1-1\" class=\"tab\" aria-controls=\"clay-tabs-1-1-panel\" aria-selected=\"false\" tabindex=\"-1\">Markdown\u003C\u002Fbutton>\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-1-0-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-1-0\" data-label=\"Ergebnis\">\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:#0000FF;--shiki-dark:#569CD6\">def\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\"> greet\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">name\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#1b5b6e;--shiki-dark:#4EC9B0\">str\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">) -&gt; \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#1b5b6e;--shiki-dark:#4EC9B0\">str\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">:\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#8f00b4;--shiki-dark:#C586C0\">    return\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\"> f\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"Hallo, \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">{\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">name\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">}\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">!\"\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-1-1-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-1-1\" data-label=\"Markdown\" hidden=\"\">\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\">```python\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">def\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\"> greet\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">name\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#1b5b6e;--shiki-dark:#4EC9B0\">str\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">) -&gt; \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#1b5b6e;--shiki-dark:#4EC9B0\">str\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">:\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#8f00b4;--shiki-dark:#C586C0\">    return\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\"> f\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"Hallo, \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">{\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">name\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">}\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">!\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\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=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003C\u002Fdiv>\n\u003Cp>Jeder Codeblock hat oben rechts einen Kopierknopf; auf Touchscreens ist er immer sichtbar.\u003C\u002Fp>\n\u003Ch2 id=\"sprachen\">\u003Ca class=\"heading-anchor\" href=\"#sprachen\" aria-label=\"Link zu diesem Abschnitt\" data-route=\"#sprachen\">#\u003C\u002Fa>Sprachen\u003C\u002Fh2>\n\u003Cp>Clay erkennt die Sprachen deiner Dokumentation und lädt nur diese, du konfigurierst also nie etwas. Jede \u003Ca href=\"https:\u002F\u002Fshiki.style\u002Flanguages\" target=\"_blank\" rel=\"noopener noreferrer\">\u003Ci class=\"fa-solid fa-arrow-up-right-from-square clay-external-icon\" aria-hidden=\"true\">\u003C\u002Fi>Sprache, die Shiki kennt\u003C\u002Fa>, funktioniert, unter ihrem Namen oder einem gängigen Kürzel: \u003Ccode>js\u003C\u002Fcode>, \u003Ccode>ts\u003C\u002Fcode>, \u003Ccode>py\u003C\u002Fcode>, \u003Ccode>sh\u003C\u002Fcode>, \u003Ccode>yml\u003C\u002Fcode>, \u003Ccode>md\u003C\u002Fcode> und so weiter. Ein Block mit unbekannter oder ohne Sprache erscheint als schlichter Text.\u003C\u002Fp>\n\u003Cdiv class=\"clay-tabs clay-code-group\" data-tabs=\"\">\u003Cdiv role=\"tablist\" class=\"tabs tabs-border not-prose\">\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-2-0\" class=\"tab tab-active\" aria-controls=\"clay-tabs-2-0-panel\" aria-selected=\"true\" tabindex=\"0\">go\u003C\u002Fbutton>\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-2-1\" class=\"tab\" aria-controls=\"clay-tabs-2-1-panel\" aria-selected=\"false\" tabindex=\"-1\">rust\u003C\u002Fbutton>\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-2-2\" class=\"tab\" aria-controls=\"clay-tabs-2-2-panel\" aria-selected=\"false\" tabindex=\"-1\">sql\u003C\u002Fbutton>\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-2-0-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-2-0\" data-label=\"go\">\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:#0000FF;--shiki-dark:#569CD6\">package\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#1b5b6e;--shiki-dark:#4EC9B0\"> main\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#8f00b4;--shiki-dark:#C586C0\">import\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> \"fmt\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">func\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\"> main\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">() {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">    fmt\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">Println\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"Hallo aus Go\"\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>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-2-1-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-2-1\" data-label=\"rust\" hidden=\"\">\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:#0000FF;--shiki-dark:#569CD6\">fn\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\"> main\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">() {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">    println!\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"Hallo aus Rust\"\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>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-2-2-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-2-2\" data-label=\"sql\" hidden=\"\">\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:#0000FF;--shiki-dark:#569CD6\">SELECT\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> title, updated \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">FROM\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> pages \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">WHERE\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\"> language\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> = \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">'de'\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\"> ORDER BY\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> updated \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">DESC\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=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003C\u002Fdiv>\n\u003Cp>Derselbe Code in mehreren Sprachen oder für mehrere Werkzeuge passt in eine \u003Ca href=\"\u002Fclay-example-repo\u002F4.x\u002Fde\u002Fwriting\u002Fcomponents\u002Ftabs#codegruppen\" data-route=\"\u002F4.x\u002Fde\u002Fwriting\u002Fcomponents\u002Ftabs#codegruppen\">Codegruppe\u003C\u002Fa> wie die oben.\u003C\u002Fp>\n\u003Ch2 id=\"zeilen-hervorheben\">\u003Ca class=\"heading-anchor\" href=\"#zeilen-hervorheben\" aria-label=\"Link zu diesem Abschnitt\" data-route=\"#zeilen-hervorheben\">#\u003C\u002Fa>Zeilen hervorheben\u003C\u002Fh2>\n\u003Cp>Schreib die Zeilennummern in geschweiften Klammern hinter die Sprache, einzeln oder als Bereiche: \u003Ccode>ts {2}\u003C\u002Fcode> oder \u003Ccode>ts {1,3-4}\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\">```ts {2}\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">const\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#005797;--shiki-dark:#4FC1FF\"> site\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> =\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\"> loadSite\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">root\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">);\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">const\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#005797;--shiki-dark:#4FC1FF\"> pages\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> =\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\"> site\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">pages\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">filter\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">page\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\"> =&gt;\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> !\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">page\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">isDir\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">);\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">console\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">log\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">`\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">${\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">pages\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">length\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">}\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> Seiten`\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">);\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\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=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\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:#0000FF;--shiki-dark:#569CD6\">const\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#005797;--shiki-dark:#4FC1FF\"> site\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> = \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">loadSite\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">root\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">);\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line highlighted\">\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">const\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#005797;--shiki-dark:#4FC1FF\"> pages\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> = \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">site\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">pages\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">filter\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">page\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\"> =&gt;\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> !\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">page\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">isDir\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">);\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">console\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">log\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">`\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">${\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">pages\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">length\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">}\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> Seiten`\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=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003Ch2 id=\"dateinamen\">\u003Ca class=\"heading-anchor\" href=\"#dateinamen\" aria-label=\"Link zu diesem Abschnitt\" data-route=\"#dateinamen\">#\u003C\u002Fa>Dateinamen \u003Cspan class=\"badge badge-sm badge-soft badge-success clay-badge\">Neu in Clay 4\u003C\u002Fspan>\u003C\u002Fh2>\n\u003Cp>Schreib den Namen der Datei in eckigen Klammern hinter die Sprache, und Clay zeigt ihn in einer Leiste über dem Code. So sehen Leser sofort, wohin der Code gehört:\u003C\u002Fp>\n\u003Cdiv class=\"clay-tabs\" data-tabs=\"\">\u003Cdiv role=\"tablist\" class=\"tabs tabs-border not-prose\">\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-3-0\" class=\"tab tab-active\" aria-controls=\"clay-tabs-3-0-panel\" aria-selected=\"true\" tabindex=\"0\">Ergebnis\u003C\u002Fbutton>\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-3-1\" class=\"tab\" aria-controls=\"clay-tabs-3-1-panel\" aria-selected=\"false\" tabindex=\"-1\">Markdown\u003C\u002Fbutton>\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-3-0-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-3-0\" data-label=\"Ergebnis\">\u003Cdiv class=\"code-block has-title\">\u003Cdiv class=\"code-title\">\u003Ci class=\"fa-regular fa-file-lines\" aria-hidden=\"true\">\u003C\u002Fi>\u003Cspan>clay.yaml\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\">\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#569CD6\">title\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"Mein Projekt\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#569CD6\">baseURL\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"\u002Fmein-projekt\u002F\"\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-3-1-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-3-1\" data-label=\"Markdown\" hidden=\"\">\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\">```yaml [clay.yaml]\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:#A31515;--shiki-dark:#CE9178\">\"Mein Projekt\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#569CD6\">baseURL\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"\u002Fmein-projekt\u002F\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\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=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003C\u002Fdiv>\n\u003Cp>Der Name darf Ordner und Leerzeichen enthalten, etwa \u003Ccode>[docs\u002Fguides\u002Fsetup.md]\u003C\u002Fcode>, und lässt sich mit hervorgehobenen Zeilen kombinieren: \u003Ccode>ts [src\u002Fclient.ts] {2}\u003C\u002Fcode>. In einer \u003Ca href=\"\u002Fclay-example-repo\u002F4.x\u002Fde\u002Fwriting\u002Fcomponents\u002Ftabs#codegruppen\" data-route=\"\u002F4.x\u002Fde\u002Fwriting\u002Fcomponents\u002Ftabs#codegruppen\">Code-Gruppe\u003C\u002Fa> benennt der Name in Klammern stattdessen den Tab.\u003C\u002Fp>\n\u003Ch2 id=\"markierungen-in-kommentaren\">\u003Ca class=\"heading-anchor\" href=\"#markierungen-in-kommentaren\" aria-label=\"Link zu diesem Abschnitt\" data-route=\"#markierungen-in-kommentaren\">#\u003C\u002Fa>Markierungen in Kommentaren\u003C\u002Fh2>\n\u003Cp>Manche Änderungen markierst du leichter direkt in der Zeile. Setz einen Kommentar mit einer Markierung ans Zeilenende; Clay entfernt den Kommentar und markiert die Zeile:\u003C\u002Fp>\n\u003Ctable>\n\u003Cthead>\n\u003Ctr>\n\u003Cth>Markierung\u003C\u002Fth>\n\u003Cth>Wirkung\u003C\u002Fth>\n\u003C\u002Ftr>\n\u003C\u002Fthead>\n\u003Ctbody>\u003Ctr>\n\u003Ctd>\u003Ccode>\u002F\u002F [!code highlight]\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>Hebt die Zeile hervor\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>\u003Ccode>\u002F\u002F [!code ++]\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>Markiert die Zeile als hinzugefügt (grün, mit \u003Ccode>+\u003C\u002Fcode>)\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>\u003Ccode>\u002F\u002F [!code --]\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>Markiert die Zeile als entfernt (rot, mit \u003Ccode>-\u003C\u002Fcode>)\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>\u003Ccode>\u002F\u002F [!code focus]\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>Blendet die anderen Zeilen ab, bis Leser über den Block fahren\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>\u003Ccode>\u002F\u002F [!code warning]\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>Markiert die Zeile als Warnung (gelb)\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>\u003Ccode>\u002F\u002F [!code error]\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>Markiert die Zeile als Fehler (rot)\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003Ctr>\n\u003Ctd>\u003Ccode>\u002F\u002F [!code word:name]\u003C\u002Fcode>\u003C\u002Ftd>\n\u003Ctd>Hebt jedes \u003Ccode>name\u003C\u002Fcode> im Block hervor\u003C\u002Ftd>\n\u003C\u002Ftr>\n\u003C\u002Ftbody>\u003C\u002Ftable>\n\u003Cp>Nutze die Kommentarsyntax der Sprache des Blocks: \u003Ccode>#\u003C\u002Fcode> in Python, YAML oder Shell, \u003Ccode>&lt;!-- --&gt;\u003C\u002Fcode> in HTML, \u003Ccode>--\u003C\u002Fcode> in SQL.\u003C\u002Fp>\n\u003Cdiv class=\"clay-tabs\" data-tabs=\"\">\u003Cdiv role=\"tablist\" class=\"tabs tabs-border not-prose\">\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-4-0\" class=\"tab tab-active\" aria-controls=\"clay-tabs-4-0-panel\" aria-selected=\"true\" tabindex=\"0\">Diff\u003C\u002Fbutton>\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-4-1\" class=\"tab\" aria-controls=\"clay-tabs-4-1-panel\" aria-selected=\"false\" tabindex=\"-1\">Hervorhebung und Warnung\u003C\u002Fbutton>\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-4-2\" class=\"tab\" aria-controls=\"clay-tabs-4-2-panel\" aria-selected=\"false\" tabindex=\"-1\">Fokus\u003C\u002Fbutton>\u003Cbutton type=\"button\" role=\"tab\" id=\"clay-tabs-4-3\" class=\"tab\" aria-controls=\"clay-tabs-4-3-panel\" aria-selected=\"false\" tabindex=\"-1\">Wörter\u003C\u002Fbutton>\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-4-0-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-4-0\" data-label=\"Diff\">\u003Cdiv class=\"code-block\">\u003Cpre class=\"shiki shiki-themes light-plus dark-plus has-diff\" 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:#8f00b4;--shiki-dark:#C586C0\">export\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#8f00b4;--shiki-dark:#C586C0\"> default\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\"> defineConfig\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">({\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line diff remove\">\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">  title:\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> \"Mein Projekt\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">, \u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line diff add\">\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">  title:\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> \"Meine Dokumentation\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">, \u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">  base:\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\"> \"\u002Fdocs\u002F\"\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>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-4-1-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-4-1\" data-label=\"Hervorhebung und Warnung\" hidden=\"\">\u003Cdiv class=\"code-block\">\u003Cpre class=\"shiki shiki-themes light-plus dark-plus has-highlighted\" 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\">config = load_config(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"clay.yaml\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">)\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line highlighted\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">config[\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"baseURL\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">] = \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"\u002Fdocs\u002F\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line highlighted warning\">\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">build(config, \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">strict\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">False\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=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-4-2-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-4-2\" data-label=\"Fokus\" hidden=\"\">\u003Cdiv class=\"code-block\">\u003Cpre class=\"shiki shiki-themes light-plus dark-plus has-focused\" 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:#800000;--shiki-dark:#569CD6\">title\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"Mein Projekt\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line focused\">\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#569CD6\">baseURL\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"\u002Fmein-projekt\u002F\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#800000;--shiki-dark:#569CD6\">siteURL\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"https:\u002F\u002Fexample.com\"\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003Cdiv role=\"tabpanel\" id=\"clay-tabs-4-3-panel\" class=\"clay-tab-panel\" aria-labelledby=\"clay-tabs-4-3\" data-label=\"Wörter\" hidden=\"\">\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:#0000FF;--shiki-dark:#569CD6\">const\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#005797;--shiki-dark:#4FC1FF\"> \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#005797;--shiki-dark:#4FC1FF\" class=\"highlighted-word\">edition\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> = \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\" class=\"highlighted-word\">edition\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">Of\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">route\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">path\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">, \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">versions\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">, \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">languages\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">);\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#0000FF;--shiki-dark:#569CD6\">const\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#005797;--shiki-dark:#4FC1FF\"> nav\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\"> = \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">navs\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">[\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\" class=\"highlighted-word\">edition\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">prefix\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=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003C\u002Fdiv>\u003C\u002Fdiv>\n\u003Ch2 id=\"codeblöcke-zeigen\">\u003Ca class=\"heading-anchor\" href=\"#codeblöcke-zeigen\" aria-label=\"Link zu diesem Abschnitt\" data-route=\"#codeblöcke-zeigen\">#\u003C\u002Fa>Codeblöcke zeigen\u003C\u002Fh2>\n\u003Cp>Um einen Codeblock in einem Codeblock zu zeigen, wie diese Seite es tut, umschließe den äußeren Block mit vier Backticks:\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\">````markdown\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">```js\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#001080;--shiki-dark:#9CDCFE\">console\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">.\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#695221;--shiki-dark:#DCDCAA\">log\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">(\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#A31515;--shiki-dark:#CE9178\">\"innen\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#000000FF;--shiki-dark:#D4D4D4\">);\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\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>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>\u003Cbutton type=\"button\" class=\"copy-code btn btn-sm btn-square btn-ghost\" title=\"Code kopieren\" aria-label=\"Code kopieren\">\u003Ci class=\"fa-solid fa-copy\">\u003C\u002Fi>\u003C\u002Fbutton>\u003C\u002Fdiv>\n\u003Ch2 id=\"code-im-text\">\u003Ca class=\"heading-anchor\" href=\"#code-im-text\" aria-label=\"Link zu diesem Abschnitt\" data-route=\"#code-im-text\">#\u003C\u002Fa>Code im Text\u003C\u002Fh2>\n\u003Cp>Einfache Backticks markieren Code in einem Satz: \u003Ccode>npm install --save-dev clay-doc\u003C\u002Fcode>. Code im Text wird nicht hervorgehoben.\u003C\u002Fp>\n",[6,10,13,16,19,22],{"id":7,"text":8,"level":9},"sprachen","Sprachen",2,{"id":11,"text":12,"level":9},"zeilen-hervorheben","Zeilen hervorheben",{"id":14,"text":15,"level":9},"dateinamen","Dateinamen Neu in Clay 4",{"id":17,"text":18,"level":9},"markierungen-in-kommentaren","Markierungen in Kommentaren",{"id":20,"text":21,"level":9},"codeblöcke-zeigen","Codeblöcke zeigen",{"id":23,"text":24,"level":9},"code-im-text","Code im Text","Syntaxhervorhebung für über 200 Sprachen, Dateinamen, hervorgehobene Zeilen, Diffs, Fokus und ein Kopierknopf.",null,false,"\u002F_clay\u002Fsocial\u002F4.x\u002Fde\u002Fwriting\u002Fcode-blocks.png",1792666372508]