# metachris.github.io

**Repository Path**: mirrors_metachris/metachris.github.io

## Basic Information

- **Project Name**: metachris.github.io
- **Description**: Homepage & Blog
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2021-03-31
- **Last Updated**: 2026-03-21

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

https://www.metachris.dev/

https://github.com/metachris/website

Dependencies:

* [Hugo](https://gohugo.io/)
* [hugo-coder theme](https://github.com/luizdepra/hugo-coder)
* [hugo-easy-gallery](https://github.com/liwenyip/hugo-easy-gallery/) ([examples](https://www.liwen.id.au/heg/))

Internal pages:

* Example 404 page: http://localhost:1313/404.html

## Getting started

```bash
make docker-serve
```

## Shortcodes

### Admonition / Callout

Use admonitions to highlight important information in posts:

```markdown
{{< admonition note "Optional Title" >}}
This is a note with a title.
{{< /admonition >}}

{{< admonition tip >}}
A tip without a title - supports **markdown** inside.
{{< /admonition >}}
```

**Available types:**

| Type | Color | Use case |
|------|-------|----------|
| `note` | Blue | General notes (default) |
| `info` | Blue | Informational |
| `tip` | Green | Helpful tips |
| `success` | Green | Success messages |
| `warning` | Orange | Cautions |
| `danger` | Red | Critical warnings |

All types support dark mode.


# Writing & Publishing Tips

## For each post

* Add a header image (1200x630px or 1024x540)
* Possible to add a diagram?
* Possible to make code run interactively? eg. with jsfiddle.net
* Reach out to someone?

Image resources

- https://pixabay.com
- http://www.europeana.eu/portal/en
- https://unsplash.com/

Icons

- https://feathericons.com/
- https://boxicons.com/
- https://icons.getbootstrap.com/

## Before publishing

Check Post

* Typos
* Keywords
* Tags
* Title (Google search for inspiration and related keywords)
* OG meta tags in HTML

Check Social Infos

* [Twitter Card Validator](https://cards-dev.twitter.com/validator)
* [Facebook Debugger](https://developers.facebook.com/tools/debug/)
* https://search.google.com/structured-data/testing-tool

## Inspiration

Nice blogs

- https://www.seangoedecke.com