Writing Content

Pages

Adding New Pages

To add a new page, create a new Markdown (.md) or HTML (.html) file in the ./public directory. The filename will determine the URL path of the page. For example, hello-world.md will be accessible at /p/hello-word.

For pages that mix Markdown and HTML, use the .md extension.

Index and Footer

./public/.index.md and ./public/.footer.md are reserved files that define the content of the landing page and footer. The content of these files will be rendered at the root of your site (/) and at the bottom of every page, respectively.

For help building pretty landings quickly, I'd check out the hero component from DaisyUI.
For footers, their footer component is a great starting point.

Ignored Paths

Any files or directories that start with a dot (e.g., .thing) will be ignored by Intermark. This allows you to keep non-content files in the public directory without affecting your site.

Meta data

Intermark keeps meta data and various runtime files in ./public/.meta/* You don't need to edit any of these files directly, as they are managed by Intermark.

Markdown

Basic Syntax

.md pages can utilize markdown syntax for formatting. Here is a cheat sheet:

# H1
## H2
### H3

**bold text**

*italicized text*

> blockquote

1. First item
2. Second item
3. Third item

- First item
- Second item
- Third item

`code`

---

[title](https://www.example.com)

![alt text](image.jpg)

| Syntax | Description |
| ----------- | ----------- |
| Header | Title |
| Paragraph | Text |

```json
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}
```

{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}

~~The world is flat.~~

- [x] Write the press release
- [ ] Update the website
- [ ] Contact the media

Embedding In HTML

When embedding / nesting Markdown inside HTML (e.g., within a component), you need to be aware of how Markdown interprets indentation and blank lines.

Key rules:

1. Blank Line Before Markdown: Always insert an empty line before starting a Markdown block inside HTML.
2. Unindented Markdown: Markdown content must be left-aligned, even if it's visually nested within HTML tags.

Example

Fancy Code Blocks

Intermark includes shiki via their CDN and exposes it via a window function you can use to render code.

First, create a <div> with an ID where you want the code block to appear.

Then in <script></script> tags, call the codeBlock function with the target element ID, code, and language:

For a list of supported languages, check the shiki docs.

Templates

Intermark uses templates to define the layout of pages under the hood. The data passed into these templates is also available to you in your Markdown and HTML files.

The data available in templates includes:

• {{ .Layout }} - The layout of the site. Can be used to iterate over the pages in the sidebar.
  It's a little hacky, but see the sidebar template for an example of how to use it.
• {{ .Themes }} - A list of all available themes.
• {{ .EditMode }} - A boolean indicating if the site is in edit mode.
• {{ .Debug }} - A boolean indicating if debug level logging is enabled.

Escaping

TOC and Search

If you want to prevent a heading or content from being included in the table of contents or search results, you can add the data-notoc and data-nosearch attributes to the element or it's direct parent. For example:

Prose styling

To prevent Intermark from applying prose styling to a section of HTML, you can use the not-prose class. Otherwise, tailwind prose styles will be applied to all content within the element. This is how the markdown content is styled by default.

Everything

To prevent Intermark from processing a section of content in any way, you can use {{< raw >}} and {{< /raw >}} tags. This will render the content exactly as it is, without any processing or formatting.

Assets

Adding Files

To add files (images, documents, scripts, etc.) to your site, place them in the ./assets directory (which is handled by LFS). You can then link to these files in your Markdown or HTML content like this:

Fingerprinting

Intermark automatically fingerprints assets for cache busting. When you link to an asset, at runtime, Intermark will replace the link with a version that includes a hash of the file content. This ensures that browsers always load the latest version of your assets and only re-download them when they change.

To escape the fingerprinting system, you can add a '/' before the link, like this: