<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/xsl" href="https://statidocs.cecil.app/xsl/atom.xsl" media="all"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
  <id>https://statidocs.cecil.app/docs/guides/</id>
  <title>Statidocs - Guides</title>
  <subtitle><![CDATA[Write your pages in Markdown, customize templates with Twig and Tailwind CSS, and enjoy the power of Cecil static site generator.]]></subtitle>
  <link href="https://statidocs.cecil.app/docs/guides/atom.xml" rel="self" type="application/atom+xml" />
  <link href="https://statidocs.cecil.app/docs/guides/" rel="alternate" type="text/html" />
  <updated>2026-08-26T22:26:13+00:00</updated>
  <author>
    <name>Arnaud Ligny</name>
    <uri>https://arnaudligny.fr</uri>
  </author>
  <entry xml:lang="en">
    <id>https://statidocs.cecil.app/docs/guides/project-structure/</id>
    <title>Project structure</title>
    <published>2026-08-26T22:26:00+00:00</published>
    <link href="https://statidocs.cecil.app/docs/guides/project-structure/" rel="alternate" type="text/html" />
    <content type="html">
      <![CDATA[<h1>Project structure</h1>
<p>This guide will show you how a Statidocs project is organized and what the different files in your project do.</p>
<p>Statidocs projects follow the same file and directory structure as a Cecil projects. See <a href="https://cecil.app/documentation/content/#files-organization" rel="noopener noreferrer">Cecil’s files organization documentation</a> for more detail.</p>
<h2 id="files-and-directories">Files and directories</h2>
<ul>
<li><code translate="no">cecil.yml</code> — The configuration file.</li>
<li><code translate="no">pages/docs/</code> — Each Markdown file (<code translate="no">.md</code>) in this directory is turns into a page on your site.</li>
<li><code translate="no">assets/</code> — Assets (styles, images, favicon, PDFs, etc.) that will be processed.</li>
<li><code translate="no">translations/</code> (optional) — Translation data to support internationalization.</li>
</ul>]]>
    </content>
  </entry>
  <entry xml:lang="en">
    <id>https://statidocs.cecil.app/docs/guides/authoring-content/</id>
    <title>Authoring content in Markdown</title>
    <published>2026-08-26T22:26:00+00:00</published>
    <link href="https://statidocs.cecil.app/docs/guides/authoring-content/" rel="alternate" type="text/html" />
    <content type="html">
      <![CDATA[<h1>Authoring content in Markdown</h1>
<p>Cecil supports <a href="https://cecil.app/documentation/content/#markdown" rel="noopener noreferrer">Markdown</a> syntax in <code translate="no">.md</code> files as well as <a href="https://cecil.app/documentation/content/#front-matter" rel="noopener noreferrer">front matter</a> to define variables.</p>
<h2 id="inline-style">Inline style</h2>
<p>Text can be <strong>bold</strong>, <em>italic</em>, or <del>strikethrough</del>.</p>
<pre><code class="language-markdown hljs markdown" translate="no">Text can be <span class="hljs-strong">**bold**</span>, <span class="hljs-emphasis">_italic_</span>, or ~~strikethrough~~.</code></pre>
<p>You can <a href="/about/">link to a page</a> or <a href="/">to another page</a>.</p>
<pre><code class="language-markdown hljs markdown" translate="no">You can [<span class="hljs-string">link to a page</span>](<span class="hljs-link">/about.md</span>) or [<span class="hljs-string">to another page</span>](<span class="hljs-link">page:index</span>).</code></pre>
<p>You can highlight <code translate="no">inline code</code> with backticks.</p>
<pre><code class="language-markdown hljs markdown" translate="no">You can highlight <span class="hljs-code">`inline code`</span> with backticks.</code></pre>
<h2 id="how-to-structure-page">How to structure page</h2>
<p>Cecil automatically use the page file name as title, but you can also define title and other variables in the <a href="https://cecil.app/documentation/content/#front-matter" rel="noopener noreferrer">front matter</a>.</p>
<p>You can structure content using a heading. Headings in Markdown are indicated by a number of <code translate="no">#</code> at the start of the line.</p>
<pre><code class="language-yaml hljs yaml" translate="no"><span class="hljs-meta">---</span>
<span class="hljs-attr">title:</span> <span class="hljs-string">Page</span> <span class="hljs-string">title</span>
<span class="hljs-attr">description:</span> <span class="hljs-string">Page</span> <span class="hljs-string">short</span> <span class="hljs-string">description.</span>
<span class="hljs-meta">---</span>

<span class="hljs-string">Lorem</span> <span class="hljs-string">ipsum</span> <span class="hljs-string">dolor</span> <span class="hljs-string">sit</span> <span class="hljs-string">amet,</span> <span class="hljs-string">consectetur</span> <span class="hljs-string">adipiscing</span> <span class="hljs-string">elit,</span> <span class="hljs-string">sed</span> <span class="hljs-string">do</span> <span class="hljs-string">eiusmod</span> <span class="hljs-string">tempor</span> <span class="hljs-string">incididunt</span> <span class="hljs-string">ut</span> <span class="hljs-string">labore.</span>

<span class="hljs-comment">## Heading</span>

<span class="hljs-string">Lorem</span> <span class="hljs-string">ipsum</span> <span class="hljs-string">dolor</span> <span class="hljs-string">sit</span> <span class="hljs-string">amet,</span> <span class="hljs-string">consectetur</span> <span class="hljs-string">adipiscing</span> <span class="hljs-string">elit,</span> <span class="hljs-string">sed</span> <span class="hljs-string">do</span> <span class="hljs-string">eiusmod</span> <span class="hljs-string">tempor</span> <span class="hljs-string">incididunt</span> <span class="hljs-string">ut</span> <span class="hljs-string">labore.</span></code></pre>
<h2 id="image">Image</h2>
<p>Images use Cecil’s built-in optimized asset support.</p>
<figure>
<img src="/favicon.7ff4b89eec6dad139a7d2d6561543285.png" alt="Cecil favicon" title="Cecil favicon" loading="lazy" decoding="async" class="dark:brightness-90" width="250" height="250">
<figcaption>Cecil favicon</figcaption>
</figure>
<pre><code class="language-markdown hljs markdown" translate="no">![<span class="hljs-string">Cecil favicon</span>](<span class="hljs-link">/favicon.png "Cecil favicon"</span>)</code></pre>
<p>Cecil search images in <code translate="no">assets/</code> and <code translate="no">static/</code> folders, but relative path is also supported:</p>
<pre><code class="language-markdown hljs markdown" translate="no">![<span class="hljs-string">Cecil favicon</span>](<span class="hljs-link">../../../assets/favicon.png "Cecil favicon"</span>)</code></pre>
<h2 id="list">List</h2>
<ul>
<li>Unordered list</li>
<li>Unordered list</li>
<li>Unordered list</li>
</ul>
<ol>
<li>Ordered list</li>
<li>Ordered list</li>
<li>Ordered list</li>
</ol>
<ul>
<li>Level 1<ul>
<li>Level 2</li>
<li>Level 2<ul>
<li>Level 3</li>
<li>Level 3</li>
</ul>
</li>
</ul>
</li>
</ul>
<pre><code class="language-markdown hljs markdown" translate="no"><span class="hljs-bullet">* </span>Unordered list
<span class="hljs-bullet">* </span>Unordered list
<span class="hljs-bullet">* </span>Unordered list
<span class="hljs-bullet">
1. </span>Ordered list
<span class="hljs-bullet">2. </span>Ordered list
<span class="hljs-bullet">3. </span>Ordered list
<span class="hljs-bullet">
* </span>Level 1
<span class="hljs-bullet">  * </span>Level 2
<span class="hljs-bullet">  * </span>Level 2
<span class="hljs-bullet">    * </span>Level 3
<span class="hljs-bullet">    * </span>Level 3</code></pre>
<h2 id="blockquote">Blockquote</h2>
<blockquote>
<p>This is a blockquote, which is commonly used when quoting another person or document.</p>
<p>Blockquotes are indicated by a <code translate="no">&gt;</code> at the start of each line.</p>
</blockquote>
<pre><code class="language-markdown hljs markdown" translate="no"><span class="hljs-quote">&gt; This is a blockquote, which is commonly used when quoting another person or document.</span>
<span class="hljs-quote">&gt;
&gt; Blockquotes are indicated by a `&gt;` at the start of each line.</span></code></pre>
<h2 id="code-block">Code block</h2>
<p>A code block is indicated by a block with three backticks <code translate="no">```</code> at the start and end. You can indicate the programming language being used after the opening backticks.</p>
<pre><code class="language-php hljs php" translate="no"><span class="hljs-comment">// PHP code</span>
$config = [
    <span class="hljs-string">'title'</span>   =&gt; <span class="hljs-string">"My website"</span>,
    <span class="hljs-string">'baseurl'</span> =&gt; <span class="hljs-string">'http://localhost:8000/'</span>,
];

Builder::create($config)-&gt;build();</code></pre>
<pre>
```php
// PHP code
$config = [
    'title'   =&gt; "My website",
    'baseurl' =&gt; 'http://localhost:8000/',
];

Builder::create($config)-&gt;build();
```
</pre>
<h2 id="horizontal-rule-below">Horizontal rule below</h2>
<hr>
<pre><code class="language-markdown hljs markdown" translate="no">---</code></pre>
<h2 id="definition-list">Definition list</h2>
<dl>
<dt>First Term</dt>
<dd>This is the definition of the first term.</dd>
<dt>Second Term</dt>
<dd>This is one definition of the second term.</dd>
<dd>This is another definition of the second term.</dd>
</dl>
<pre><code class="language-markdown hljs markdown" translate="no">First Term
: This is the definition of the first term.

Second Term
: This is one definition of the second term.
: This is another definition of the second term.</code></pre>
<h2 id="table">Table</h2>
<table>
<thead>
<tr>
<th style="text-align: left;">Head 1</th>
<th style="text-align: left;">Head 2</th>
<th style="text-align: left;">Head 3</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left;">ok</td>
<td style="text-align: left;">good swedish fish</td>
<td style="text-align: left;">nice</td>
</tr>
<tr>
<td style="text-align: left;">out of stock</td>
<td style="text-align: left;">good and plenty</td>
<td style="text-align: left;">nice</td>
</tr>
<tr>
<td style="text-align: left;">ok</td>
<td style="text-align: left;">good <code translate="no">oreos</code></td>
<td style="text-align: left;">hmm</td>
</tr>
<tr>
<td style="text-align: left;">ok</td>
<td style="text-align: left;">good <code translate="no">zoute</code> drop</td>
<td style="text-align: left;">yumm</td>
</tr>
</tbody>
</table>
<pre><code class="language-markdown hljs markdown" translate="no">| Head 1       | Head 2            | Head 3 |
|:-------------|:------------------|:-------|
| ok           | good swedish fish | nice   |
| out of stock | good and plenty   | nice   |
| ok           | good <span class="hljs-code">`oreos`</span>      | hmm    |
| ok           | good <span class="hljs-code">`zoute`</span> drop | yumm   |</code></pre>
<h2 id="notes">Notes</h2>
<aside class="note"><p>empty</p></aside>
<aside class="note note-info"><p>info</p></aside>
<aside class="note note-tip"><p>tip</p></aside>
<aside class="note note-important"><p>important</p></aside>
<aside class="note note-warning"><p>warning</p></aside>
<aside class="note note-caution"><p>caution</p></aside>
<pre><code class="language-markdown hljs markdown" translate="no">:::info|tip|important|warning|caution
Note here.
:::</code></pre>
<h2 id="diagrams-and-charts">Diagrams and charts</h2>
<p>Diagramming and charting with <a href="https://mermaid.js.org" rel="noopener noreferrer">Mermaid</a>.</p>
<h3 id="sequence-diagram">Sequence diagram</h3>
<pre><code class="language-mermaid" translate="no">sequenceDiagram
  participant Alice
  participant Bob
  Alice-&gt;&gt;John: Hello John, how are you?
  loop HealthCheck
    John-&gt;&gt;John: Fight against hypochondria
  end
  Note right of John: Rational thoughts &lt;br/&gt;prevail!
  John--&gt;&gt;Alice: Great!
  John-&gt;&gt;Bob: How about you?
  Bob--&gt;&gt;John: Jolly good!</code></pre>
<pre>
```mermaid
sequenceDiagram
  participant Alice
  participant Bob
  Alice-&gt;&gt;John: Hello John, how are you?
  loop HealthCheck
    John-&gt;&gt;John: Fight against hypochondria
  end
  Note right of John: Rational thoughts <br>prevail!
  John--&gt;&gt;Alice: Great!
  John-&gt;&gt;Bob: How about you?
  Bob--&gt;&gt;John: Jolly good!
```
</pre>
<h3 id="git-graph">Git graph</h3>
<pre><code class="language-mermaid" translate="no">gitGraph
  commit
  commit
  branch develop
  commit
  commit
  commit
  checkout main
  commit
  commit</code></pre>
<pre>
```mermaid
gitGraph
  commit
  commit
  branch develop
  commit
  commit
  commit
  checkout main
  commit
  commit
```
</pre>]]>
    </content>
  </entry>
  <entry xml:lang="en">
    <id>https://statidocs.cecil.app/docs/guides/search/</id>
    <title>Site Search</title>
    <published>2026-08-26T22:26:00+00:00</published>
    <link href="https://statidocs.cecil.app/docs/guides/search/" rel="alternate" type="text/html" />
    <content type="html">
      <![CDATA[<h1>Site Search</h1>
<p>Statidocs has support for <a href="https://docsearch.algolia.com" rel="noopener noreferrer">Algolia DocSearch</a>.</p>
<p>The service is free for any open-source project: <a href="https://docsearch.algolia.com/apply/" rel="noopener noreferrer">apply to the DocSearch program</a>.</p>
<p>DocSearch crawls your website once a week and aggregates the content in an Algolia index. This content is then queried directly from your front-end using the Algolia API.</p>
<aside class="note note-info"><p>If your website is <a href="https://docsearch.algolia.com/docs/who-can-apply/" rel="noopener noreferrer">not eligible</a> for the free or if your website sits behind a firewall, then you can <a href="https://docsearch.algolia.com/docs/run-your-own/" rel="noopener noreferrer">run your own</a> DocSearch crawler.</p></aside>
<h2 id="crawler-configuration">Crawler configuration</h2>
<p>Editing and managing your crawls can be done via <a href="https://crawler.algolia.com" rel="noopener noreferrer">the web interface</a>. Indices are readily available after deployment, so manual configuration usually isn't necessary.</p>
<p>Recommended configuration:</p>
<pre><code class="language-json hljs json" translate="no">new Crawler({
  appId: <span class="hljs-string">"YOUR_APP_ID"</span>,
  apiKey: <span class="hljs-string">"YOUR_SEARCH_API_KEY"</span>,
  indexPrefix: <span class="hljs-string">""</span>,
  rateLimit: <span class="hljs-number">8</span>,
  maxDepth: <span class="hljs-number">10</span>,
  maxUrls: <span class="hljs-number">5000</span>,
  startUrls: [<span class="hljs-string">"https://YOUR_WEBSITE_URL"</span>],
  renderJavaScript: <span class="hljs-literal">false</span>,
  sitemaps: [<span class="hljs-string">"https://YOUR_WEBSITE_URL/sitemap.xml"</span>],
  ignoreCanonicalTo: <span class="hljs-literal">false</span>,
  discoveryPatterns: [<span class="hljs-string">"https://YOUR_WEBSITE_URL/**"</span>],
  actions: [
    {
      indexName: <span class="hljs-string">"YOUR_INDEX_NAME"</span>,
      pathsToMatch: [<span class="hljs-string">"https://YOUR_WEBSITE_URL/**"</span>],
      recordExtractor: ({ helpers }) =&gt; {
        return helpers.docsearch({
          recordProps: {
            lvl0: {
              selectors: <span class="hljs-string">"#sidebar ul&gt;li&gt;a.active"</span>,
              defaultValue: <span class="hljs-string">"Documentation"</span>,
            },
            lvl1: [<span class="hljs-string">"article h1"</span>],
            lvl2: [<span class="hljs-string">"article h2"</span>],
            lvl3: [<span class="hljs-string">"article h3"</span>],
            lvl4: [<span class="hljs-string">"article h4"</span>],
            lvl5: [<span class="hljs-string">"article h5"</span>],
            lvl6: [<span class="hljs-string">"article h6"</span>],
            content: [<span class="hljs-string">"#content p, #content li"</span>],
          },
          aggregateContent: <span class="hljs-literal">true</span>,
          recordVersion: <span class="hljs-string">"v3"</span>,
        });
      },
    },
  ],
  safetyChecks: { beforeIndexPublishing: { maxLostRecordsPercentage: <span class="hljs-number">30</span> } },
  initialIndexSettings: {
    staticecil: {
      attributesForFaceting: [<span class="hljs-string">"type"</span>, <span class="hljs-string">"lang"</span>],
      attributesToRetrieve: [
        <span class="hljs-string">"hierarchy"</span>,
        <span class="hljs-string">"content"</span>,
        <span class="hljs-string">"anchor"</span>,
        <span class="hljs-string">"url"</span>,
        <span class="hljs-string">"url_without_anchor"</span>,
        <span class="hljs-string">"type"</span>,
      ],
      attributesToHighlight: [<span class="hljs-string">"hierarchy"</span>, <span class="hljs-string">"content"</span>],
      attributesToSnippet: [<span class="hljs-string">"content:10"</span>],
      camelCaseAttributes: [<span class="hljs-string">"hierarchy"</span>, <span class="hljs-string">"content"</span>],
      searchableAttributes: [
        <span class="hljs-string">"unordered(hierarchy.lvl0)"</span>,
        <span class="hljs-string">"unordered(hierarchy.lvl1)"</span>,
        <span class="hljs-string">"unordered(hierarchy.lvl2)"</span>,
        <span class="hljs-string">"unordered(hierarchy.lvl3)"</span>,
        <span class="hljs-string">"unordered(hierarchy.lvl4)"</span>,
        <span class="hljs-string">"unordered(hierarchy.lvl5)"</span>,
        <span class="hljs-string">"unordered(hierarchy.lvl6)"</span>,
        <span class="hljs-string">"content"</span>,
      ],
      distinct: <span class="hljs-literal">true</span>,
      attributeForDistinct: <span class="hljs-string">"url"</span>,
      customRanking: [
        <span class="hljs-string">"desc(weight.pageRank)"</span>,
        <span class="hljs-string">"desc(weight.level)"</span>,
        <span class="hljs-string">"asc(weight.position)"</span>,
      ],
      ranking: [
        <span class="hljs-string">"words"</span>,
        <span class="hljs-string">"filters"</span>,
        <span class="hljs-string">"typo"</span>,
        <span class="hljs-string">"attribute"</span>,
        <span class="hljs-string">"proximity"</span>,
        <span class="hljs-string">"exact"</span>,
        <span class="hljs-string">"custom"</span>,
      ],
      highlightPreTag: '&lt;span class=<span class="hljs-string">"algolia-docsearch-suggestion--highlight"</span>&gt;',
      highlightPostTag: <span class="hljs-string">"&lt;/span&gt;"</span>,
      minWordSizefor1Typo: <span class="hljs-number">3</span>,
      minWordSizefor2Typos: <span class="hljs-number">7</span>,
      allowTyposOnNumericTokens: <span class="hljs-literal">false</span>,
      minProximity: <span class="hljs-number">1</span>,
      ignorePlurals: <span class="hljs-literal">true</span>,
      advancedSyntax: <span class="hljs-literal">true</span>,
      attributeCriteriaComputedByMinProximity: <span class="hljs-literal">true</span>,
      removeWordsIfNoResults: <span class="hljs-string">"allOptional"</span>,
    },
  },
});</code></pre>
<h2 id="docsearch-configuration">DocSearch configuration</h2>
<pre><code class="language-yaml hljs yaml" translate="no"><span class="hljs-attr">docsearch:</span>
  <span class="hljs-attr">enabled:</span> <span class="hljs-literal">true</span><span class="hljs-string">|false</span>
  <span class="hljs-attr">appId:</span> <span class="hljs-string">&lt;YOUR_APP_ID&gt;</span>
  <span class="hljs-attr">indexName:</span> <span class="hljs-string">&lt;YOUR_INDEX_NAME&gt;</span>
  <span class="hljs-attr">apiKey:</span> <span class="hljs-string">&lt;YOUR_SEARCH_API_KEY&gt;</span>
  <span class="hljs-attr">insights:</span> <span class="hljs-literal">true</span><span class="hljs-string">|false</span>
  <span class="hljs-attr">debug:</span> <span class="hljs-literal">false</span><span class="hljs-string">|true</span></code></pre>]]>
    </content>
  </entry>
  <entry xml:lang="en">
    <id>https://statidocs.cecil.app/docs/guides/internationalization/</id>
    <title>Internationalization (i18n)</title>
    <published>2026-08-26T22:26:00+00:00</published>
    <link href="https://statidocs.cecil.app/docs/guides/internationalization/" rel="alternate" type="text/html" />
    <content type="html">
      <![CDATA[<h1>Internationalization (i18n)</h1>
<p>Statidocs provides built-in support for multilingual sites.</p>
<h2 id="configure-i18n">Configure i18n</h2>
<p>Tell Statidocs about the languages you support by passing locales in the configuraiton (<code translate="no">cecil.yml</code>) file:</p>
<pre><code class="language-yaml hljs yaml" translate="no"><span class="hljs-attr">language:</span> <span class="hljs-string">en</span> <span class="hljs-comment"># default language</span>
<span class="hljs-attr">languages:</span>
  <span class="hljs-bullet">-</span> <span class="hljs-attr">code:</span> <span class="hljs-string">en</span>
    <span class="hljs-attr">name:</span> <span class="hljs-string">English</span>
    <span class="hljs-attr">locale:</span> <span class="hljs-string">en</span>
  <span class="hljs-bullet">-</span> <span class="hljs-attr">code:</span> <span class="hljs-string">fr</span>
    <span class="hljs-attr">enabled:</span> <span class="hljs-literal">true</span> <span class="hljs-comment"># disable with "false"</span>
    <span class="hljs-attr">name:</span> <span class="hljs-string">Français</span>
    <span class="hljs-attr">locale:</span> <span class="hljs-string">fr</span></code></pre>
<h2 id="translate-pages">Translate pages</h2>
<p>Duplicate pages you want to translate by adding language code as suffix, for example:</p>
<pre><code class="language-text" translate="no">&lt;my-project&gt;
└─ pages
   └─ docs
      ├─ getting-started.md
      └─ getting-started.fr.md</code></pre>
<aside class="note note-tip"><p><a href="https://cecil.app/documentation/content/#multilingual" rel="noopener noreferrer">Cecil documentation</a></p></aside>
<h2 id="translate-templates">Translate templates</h2>
<aside class="note note-tip"><p><a href="https://cecil.app/documentation/templates/#localization" rel="noopener noreferrer">Cecil documentation</a></p></aside>]]>
    </content>
  </entry>
</feed>
