https://github.com/cjerrington/journa11ty
Simple blog or journal site built with Eleventy and Pico CSS
https://github.com/cjerrington/journa11ty
11ty 11ty-starter 11ty-template eleventy eleventy-starter eleventy-template eleventy-website static-site
Last synced: 2 months ago
JSON representation
Simple blog or journal site built with Eleventy and Pico CSS
- Host: GitHub
- URL: https://github.com/cjerrington/journa11ty
- Owner: cjerrington
- Created: 2025-05-22T20:25:15.000Z (5 months ago)
- Default Branch: master
- Last Pushed: 2025-05-23T13:22:13.000Z (5 months ago)
- Last Synced: 2025-06-20T00:38:30.402Z (4 months ago)
- Topics: 11ty, 11ty-starter, 11ty-template, eleventy, eleventy-starter, eleventy-template, eleventy-website, static-site
- Language: JavaScript
- Homepage: https://journa11ty.pages.dev/
- Size: 29.3 KB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# journa11ty
A simple [11ty](https://www.11ty.dev/) blog, notes, journal site using [Pico](https://picocss.com/) for CSS.
I wanted something quick and easy to setup and get working for some personal notes, journal, etc. I decided to use `pico` for the CSS framework since it was lightweight and still looked good.
This is a pretty basic and simple start to any 11ty template allowing you some basic features:
- blog
- pages
- tags
- light/dark theme switch
- code syntax highlighting
## Todo
- add RSS feeds
- install and deploy instructions
- pagination for home page
## Customizations
Pico is installed with NPM so you can choose your CSS version and theme.
```js
eleventyConfig.addPassthroughCopy({"node_modules/@picocss/pico/css/pico.min.css": "css/pico.min.css"});
```
PrismJS for code syntax highlighting is also installed with NPM for you to choose your version and theme.
```js
eleventyConfig.addPassthroughCopy({"node_modules/prismjs/themes/prism-tomorrow.min.css": "css/prism-tomorrow.min.css"});
```
Within `_data\metadata.json` you have some config values you can set like the name of the site, description, etc.