Skip to content

Commit

Permalink
Quickfix
Browse files Browse the repository at this point in the history
  • Loading branch information
@robertdevore
robertdevore committed Oct 2, 2024
1 parent e0422a5 commit 7633c84
Show file tree
Hide file tree
Showing 2 changed files with 319 additions and 0 deletions.
8 changes: 8 additions & 0 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,14 @@ <h2 class="text-4xl font-bold quicksand-700">
</div>
</li>

<li>
<h2 class="text-4xl font-bold quicksand-700">
<a href="/posts/front-matter-fields-for-stattic/" class="text-links hover:underline">Front Matter Fields</a>
</h2>
<div class="dark:text-gray-400"><h3>1. <strong>title</strong> - <strong>Description</strong>: The title of your post or page. - <strong>Type</strong>: String - <strong>Default</strong>: <code>'Untitled'</code> - <strong>Usage</strong>: <code>title: &quot;Your Post Title&quot;</code> ### 2. <strong>date</strong> - <strong>Description</strong>: The...</h3>
</div>
</li>

<li>
<h2 class="text-4xl font-bold quicksand-700">
<a href="/posts/say-hello-to-stattic/" class="text-links hover:underline">Say Hello to Stattic</a>
Expand Down
311 changes: 311 additions & 0 deletions posts/front-matter-fields-for-stattic/index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,311 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Front Matter Fields | Stattic</title>

<meta name="description" content="Stattic is a fast, lightweight static site generator that optimizes images, supports custom fonts, and easily integrates with GitHub Pages for quick, SEO-friendly site deployment without the bloat of traditional CMS platforms like WordPress.">
<meta name="keywords" content="SSG, Static Site Generator">
<meta name="author" content="Robert">

<link href="/assets/css/tailwind.min.css" rel="stylesheet preload" as="style">

<link href="/assets/css/main.min.css" rel="stylesheet preload" as="style">


<!-- Alpine.js for interactive components -->
<script src="/assets/js/alpine.min.js" defer></script>
</head>
<body class="bg-background text-primary quicksand-300">

<header class="bg-background shadow">
<div class="container max-w-screen-xl m-auto py-6 px-4 flex justify-between">
<h2 class="text-3xl font-bold quicksand-700"><a href="/" class="text-links">Stattic Site</a></h2>

<!-- Navigation Menu -->
<nav>
<ul class="flex space-x-6">

<li>
<a href="/about/" class="text-primary hover:underline quicksand-700">About Stattic</a>
</li>

<li>
<a href="/contact/" class="text-primary hover:underline quicksand-700">Contact Us</a>
</li>

</ul>
</nav>
</div>
</header>

<main class="container max-w-2xl m-auto py-10 px-4">

<article class="prose dark:prose-dark max-w-none">
<h1 class="text-6xl font-bold mb-4 text-links quicksand-700">Front Matter Fields</h1>
<p class="text-2md post-meta mb-4 pb-2 text-accent italic border-b border-primary"><span class="date">2024-10-02</span> &middot; <span class="author">Robert</span></p>

<div class="stattic-content mb-12">
<h3>1. <strong>title</strong></h3>
<ul>
<li><strong>Description</strong>: The title of your post or page.</li>
<li><strong>Type</strong>: String</li>
<li><strong>Default</strong>: <code>'Untitled'</code></li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>title: "Your Post Title"</code></p>
</li>
</ul>
<h3>2. <strong>date</strong></h3>
<ul>
<li><strong>Description</strong>: The publication date of your post or page.</li>
<li><strong>Type</strong>: String (formatted as <code>YYYY-MM-DDTHH:MM:SS</code>)</li>
<li><strong>Default</strong>: Current date and time if not provided.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>date: "2023-10-15T10:00:00"</code></p>
</li>
</ul>
<h3>3. <strong>author</strong></h3>
<ul>
<li><strong>Description</strong>: The ID of the author of the post or page.</li>
<li><strong>Type</strong>: Integer or String (should correspond to an ID in <code>authors.yml</code>)</li>
<li><strong>Default</strong>: <code>'Unknown'</code> if not provided.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>author: 1 # Assuming '1' corresponds to an author in authors.yml</code></p>
</li>
</ul>
<h3>4. <strong>categories</strong></h3>
<ul>
<li><strong>Description</strong>: A list of category IDs that the post belongs to.</li>
<li><strong>Type</strong>: List of Integers (IDs corresponding to entries in <code>categories.yml</code>)</li>
<li><strong>Default</strong>: Empty list <code>[]</code> if not provided.</li>
<li><strong>Usage</strong>:</li>
</ul>
<p><code>categories:
- 2
- 5</code></p>
<h3>5. <strong>tags</strong></h3>
<ul>
<li><strong>Description</strong>: A list of tag IDs associated with the post.</li>
<li><strong>Type</strong>: List of Integers (IDs corresponding to entries in <code>tags.yml</code>)</li>
<li><strong>Default</strong>: Empty list <code>[]</code> if not provided.</li>
<li><strong>Usage</strong>:</li>
</ul>
<p><code>tags:
- 3
- 7</code></p>
<h3>6. <strong>draft</strong></h3>
<ul>
<li><strong>Description</strong>: Indicates whether the post is a draft.</li>
<li><strong>Type</strong>: Boolean (<code>true</code> or <code>false</code>)</li>
<li><strong>Default</strong>: <code>false</code> (the post will be published by default)</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>draft: true # The post will be skipped during the build process</code></p>
</li>
</ul>
<h3>7. <strong>template</strong></h3>
<ul>
<li><strong>Description</strong>: Specifies a custom template to use for rendering.</li>
<li><strong>Type</strong>: String (the name of the template part)</li>
<li><strong>Default</strong>: <code>'post.html'</code> for posts, <code>'page.html'</code> for pages if not specified.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>template: "custom" # Will use 'post-custom.html' or 'page-custom.html'</code></p>
</li>
</ul>
<h3>8. <strong>custom_url</strong></h3>
<ul>
<li><strong>Description</strong>: Custom URL slug for the post or page.</li>
<li><strong>Type</strong>: String</li>
<li><strong>Default</strong>: The filename without the <code>.md</code> extension.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>custom_url: "my-custom-path"</code></p>
</li>
</ul>
<h3>9. <strong>order</strong></h3>
<ul>
<li><strong>Description</strong>: Determines the order of pages in navigation menus.</li>
<li><strong>Type</strong>: Integer (lower numbers appear first)</li>
<li><strong>Default</strong>: <code>100</code> if not specified.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>order: 1 # This page will appear before pages with higher 'order' values</code></p>
</li>
</ul>
<h3>10. <strong>featured_image</strong></h3>
<ul>
<li><strong>Description</strong>: URL of the featured image for the post or page.</li>
<li><strong>Type</strong>: String (URL)</li>
<li><strong>Default</strong>: <code>None</code> if not provided.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>featured_image: "https://example.com/images/featured.jpg"</code></p>
</li>
</ul>
<h3>11. <strong>seo_title</strong></h3>
<ul>
<li><strong>Description</strong>: Custom title for SEO purposes.</li>
<li><strong>Type</strong>: String</li>
<li><strong>Default</strong>: Uses the <code>title</code> field if not provided.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>seo_title: "Optimized SEO Title for Search Engines"</code></p>
</li>
</ul>
<h3>12. <strong>keywords</strong></h3>
<ul>
<li><strong>Description</strong>: SEO keywords for the post or page.</li>
<li><strong>Type</strong>: String (comma-separated)</li>
<li><strong>Default</strong>: Empty string <code>''</code> if not provided.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>keywords: "keyword1, keyword2, keyword3"</code></p>
</li>
</ul>
<h3>13. <strong>description</strong></h3>
<ul>
<li><strong>Description</strong>: SEO description for the post or page.</li>
<li><strong>Type</strong>: String</li>
<li><strong>Default</strong>: Empty string <code>''</code> if not provided.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>description: "A brief description of the content for SEO purposes."</code></p>
</li>
</ul>
<h3>14. <strong>lang</strong></h3>
<ul>
<li><strong>Description</strong>: Language code for the content.</li>
<li><strong>Type</strong>: String (e.g., <code>'en'</code>, <code>'fr'</code>, <code>'es'</code>)</li>
<li><strong>Default</strong>: <code>'en'</code> (English) if not specified.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>lang: "en"</code></p>
</li>
</ul>
<h3>15. <strong>excerpt</strong></h3>
<ul>
<li><strong>Description</strong>: Custom excerpt or summary of the post.</li>
<li><strong>Type</strong>: String (supports Markdown)</li>
<li><strong>Default</strong>: Automatically generated from the first 30 words of the content if not provided.</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>excerpt: "This is a custom excerpt for the post."</code></p>
</li>
</ul>
<hr />
<h2>Additional Details and Usage</h2>
<h3><strong>Categories and Tags</strong></h3>
<ul>
<li><strong>Definition Files</strong>: Categories and tags are defined in <code>categories.yml</code> and <code>tags.yml</code>, respectively.</li>
<li>
<p><strong>Structure of YAML Files</strong>:
```
# categories.yml
1:
name: "Technology"
2:
name: "Science"</p>
<h1>tags.yml</h1>
<p>1:
name: "Python"
2:
name: "AI"
```
- <strong>Usage in Front Matter</strong>:</p>
</li>
</ul>
<p><code>categories:
- 1 # Refers to "Technology"
- 2 # Refers to "Science"
tags:
- 1 # Refers to "Python"
- 2 # Refers to "AI"</code></p>
<h3><strong>Authors</strong></h3>
<ul>
<li><strong>Definition File</strong>: Authors are defined in <code>authors.yml</code>.</li>
<li>
<p><strong>Structure</strong>:
<code># authors.yml
1: "Jane Doe"
2: "John Smith"</code></p>
</li>
<li>
<p><strong>Usage in Front Matter</strong>:</p>
<p><code>author: 1 # Refers to "Jane Doe"</code></p>
</li>
</ul>
<h3><strong>Custom Templates</strong></h3>
<ul>
<li><strong>Templates Directory</strong>: Templates are stored in the <code>templates</code> directory.</li>
<li><strong>Template Naming</strong>:<ul>
<li>For posts: <code>post.html</code> or <code>post-{template}.html</code></li>
<li>For pages: <code>page.html</code> or <code>page-{template}.html</code></li>
</ul>
</li>
<li>
<p><strong>Usage</strong>:</p>
<p><code>template: "gallery" # Will use 'post-gallery.html' or 'page-gallery.html'</code></p>
</li>
</ul>
<h3><strong>Example of Complete Front Matter</strong></h3>
<p><code>---
title: "Exploring the Stars"
date: "2023-10-15T10:00:00"
author: 2
categories:
- 3
- 4
tags:
- 5
- 6
draft: false
template: "astronomy"
custom_url: "exploring-the-stars"
order: 2
featured_image: "https://example.com/images/stars.jpg"
seo_title: "A Deep Dive into Astronomy"
keywords: "astronomy, stars, space"
description: "An in-depth exploration of the wonders of the universe."
lang: "en"
excerpt: "Join us as we journey through the cosmos, exploring the mysteries of the stars..."
---</code></p>
<hr />
<h2>Notes on Usage</h2>
<ul>
<li><strong>Front Matter Format</strong>: Ensure the front matter is enclosed at the top of your Markdown file between <code>---</code> lines.</li>
<li><strong>YAML Syntax</strong>: Use proper YAML syntax to avoid parsing errors. Indentation and formatting are important.</li>
<li><strong>Optional Fields</strong>: All fields are optional unless required by your site's design or functionality. The script provides default values where appropriate.</li>
<li><strong>Draft Posts</strong>:<ul>
<li>Set <code>draft: true</code> to exclude a post from the build.</li>
<li>Remove the <code>draft</code> field or set it to <code>false</code> when you're ready to publish.</li>
</ul>
</li>
<li><strong>Custom URLs</strong>:<ul>
<li>Use <code>custom_url</code> to define a specific path for your post or page.</li>
<li>If not specified, the filename (without the <code>.md</code> extension) is used as the slug.</li>
</ul>
</li>
</ul>
<hr />
<h2>Summary</h2>
<p>By utilizing these front matter fields, you can control various aspects of how your content is processed and displayed by the <strong>Stattic</strong> static site generator. </p>
<p>This includes metadata for SEO, content organization through categories and tags, custom templates for different types of content, and more.</p>
<p>Feel free to include any or all of these fields in the front matter of your Markdown files to customize your site's behavior and appearance according to your needs.</p>
</div>
</article>

</main>

<footer class="bg-background border-t border-primary mt-10 py-6">
<div class="container max-w-screen-xl m-auto px-4 text-center">
<p>Get <a href="https://stattic.site/" target="_blank" class="text-links font-bold">Stattic</a>.</p>
</div>
</footer>

</body>
</html>

0 comments on commit 7633c84

Please sign in to comment.