Cecil Static Site Generator

repository·master·Indexed 43 days ago

https://github.com/cecilapp/cecil

A high-performance, content-driven static site generator that uses Markdown for content and Twig for templating. It eliminates the need for a database or running server, providing a secure architecture with a CLI for site management. Features include automatic generation of pagination, sitemaps, RSS feeds, and taxonomies. Requires PHP 8.3 or higher.

Tokens
65.2K
Snippets
288
Records
329
Agent score
53%

What's inside Cecil

  1. Overview of Cecil Features

    master

    Cecil is a content-driven static site generator with the following core characteristics:

    • Architecture: No database or server required, improving performance and security.
    • Content: Pages are stored as Markdown flat files using YAML front matter.
    • Templating: Powered by the Twig template engine with support for themes.
    • Automation: Automatically generates pagination, sitemaps, redirections, robots.txt, taxonomies, and RSS feeds.
    • Asset Management: Handles and optimizes assets automatically.
    • Deployment: Designed for easy deployment to platforms like Netlify or Vercel.
  2. Understand the Cecil project resource structure

    master

    Cecil projects rely on a specific directory structure to manage templates, server configuration, project skeletons, and translations.

    • layouts/: Contains Twig template files.
      • _default/: Core templates for pages, lists, and feeds.
      • extended/: Macros and theme-specific templates.
      • partials/: Reusable UI components like navigation or metatags.
    • server/: Contains files for the local development environment, including router.php (the PHP router) and livereload.js (for automatic browser refreshes).
    • skeleton/: Provides a starting point for new projects, including a default cecil.yml configuration, sample pages/, layouts/, and assets/.
    • translations/: Stores multilingual data using .po (source) and .mo (compiled) files.
  3. Understand the Cecil local PHP server resources

    master

    Cecil's local PHP server uses specific helper files to manage site serving and development features. The server relies on a custom router and a live-reload mechanism to provide a seamless local development experience.

    Core Components

    • router.php: Acts as the router for the PHP built-in server (php -S). It is responsible for resolving requested paths, serving static files, and managing custom 404 behavior for the generated site.
    • livereload.js: A script injected into HTML responses. It enables automatic browser reloading by listening to /watcher via Server-Sent Events (SSE), triggering a reload whenever changes are detected.
  4. Understand the Cecil Skeleton structure

    master

    The Cecil Skeleton provides a standard directory structure for organizing a Cecil site. When starting a new project, use this layout to manage configuration, assets, templates, and content:

    • cecil.yml: The central site configuration file.
    • assets/: Directory for source assets such as styles (CSS), scripts (JS), and other media.
    • layouts/: Contains Twig templates used to define the structure of your pages.
    • pages/: Contains Markdown files which serve as the content for your site pages.
    • static/: Contains static files that are copied directly to the output directory without processing.
  5. Understanding Cecil Sections and Sub-sections

    master

    Cecil uses a file-based routing system based on the pages/ directory.

    Sections

    A root folder in pages/ is a Section. For example, pages/blog/post-1.md belongs to the blog section.

    Sub-sections

    A nested folder becomes a sub-section only if it contains an index.md file. If a nested folder lacks an index.md, its pages simply belong to the parent section.

    Sub-section characteristics:

    • They are full Sections with their own URL (e.g., /blog/2024/).
    • They can be nested at any depth.
    • Their pages belong to the sub-section AND all parent sections.
    • They are not listed among the pages of their parent section.
    • They support front matter variables like sortby, pagination, cascade, and circular. Use cascade on a parent index.md to propagate variables down to sub-sections.
    pages/
    └─ blog                 # Section "blog"
       ├─ index.md
       ├─ post-1.md         # Page in "blog"
       └─ 2024              # Sub-section (contains an "index.md")
          ├─ index.md
          └─ post-2.md         # Page in "blog" AND "blog/2024"
  6. Use file-based routing for pages

    master

    Cecil implements file-based routing based on the location of Markdown files within the pages directory. The URL is constructed from the baseurl, the section (folder), and the slug (filename).

    Example Mapping:

    • File Path: pages/my-projects/project-a.md
    • Resulting URL: https://example.com/my-projects/project-a/ (or .../project-a/index.html depending on server configuration).

    Note: Certain prefixes can alter the URL behavior.

  7. Understand the different types of content in Cecil

    master

    Cecil categorizes content into four main types:

    • Pages: The primary content of your site, written in Markdown. Pages are organized into Sections (root folders) and their structure reflects the rendered website hierarchy.
    • Assets: Files that undergo processing (e.g., resizing images, compiling Sass, minifying scripts). These are accessed in templates using the asset() function.
    • Static files: Files that are copied directly to the built site without modification (e.g., a PDF in static/file.pdf becomes file.pdf in the output).
    • Data files: Collections of custom variables stored in files (like .yml) and exposed in templates via the site.data object.
  8. Use Twig templates in Cecil

    master
    Cecil uses the Twig rendering engine to generate static websites. Templates are organized within the layouts/ directory. You can use default templates, extend them via the extended/ directory, or include reusable components from the partials/ directory during the build process.
  9. Understand Cecil's translation file structure

    master

    Cecil uses Gettext-style translation files to support multiple languages. The system relies on two specific file types for each language:

    1. Source Catalog (.po): The editable text files containing the actual translations (e.g., messages.fr.po). This is where you add or modify translation strings.
    2. Compiled Catalog (.mo): The binary files used by the application at runtime (e.g., messages.fr.mo). These are generated from the .po files.

    Currently, the repository includes translations for French (fr), but the architecture allows for additional languages to be added by providing corresponding .po and .mo files.

  10. Understand the Cecil layout directory structure

    master

    Cecil uses a specific directory structure within resources/layouts/ to manage Twig templates. Understanding this structure is essential for customizing how your site renders:

    • _default/: Contains the primary fallback templates. These provide core structures (like single pages or lists) when no specific template is assigned to a page.
    • partials/: Contains reusable template fragments. Use these for shared UI components like headers, footers, or navigation to avoid code duplication.
    • extended/: An optional directory for advanced or custom rendering scenarios, allowing you to host alternative template variants without modifying the default baseline.
  11. Understand Cecil template lookup rules

    master

    Cecil automatically selects the most appropriate layout based on the page type and front matter. If a specific layout is not found, it falls back through a priority list.

    Lookup Priority by Type

    Type homepage

    1. <layout>.<format>.twig (from front matter)
    2. index.<format>.twig
    3. home.<format>.twig
    4. list.<format>.twig
    5. _default/<layout>.<format>.twig
    6. _default/index.<format>.twig
    7. _default/home.<format>.twig
    8. _default/list.<format>.twig
    9. _default/page.<format>.twig

    Type page

    1. <section>/<layout>.<format>.twig
    2. <layout>.<format>.twig
    3. <section>/page.<format>.twig
    4. _default/<layout>.<format>.twig
    5. page.<format>.twig
    6. _default/page.<format>.twig

    Type section

    1. <layout>.<format>.twig
    2. <section>/index.<format>.twig
    3. <section>/list.<format>.twig
    4. section/<section>.<format>.twig
    5. _default/section.<format>.twig
    6. list.<format>.twig
    7. _default/list.<format>.twig

    Type vocabulary

    1. taxonomy/<plural>.<format>.twig
    2. vocabulary.<format>.twig
    3. _default/vocabulary.<format>.twig

    Type term

    1. taxonomy/<term>.<format>.twig
    2. taxonomy/<singular>.<format>.twig
    3. term.<format>.twig
    4. _default/term.<format>.twig
    5. _default/list.<format>.twig