Notes

Notes are Izar’s blog. Each one is a Markdown file in _posts/. They appear on the Notes page, on the Topics page, and anywhere you add a notes section.

Add a note

Add a file to _posts/ named YYYY-MM-DD-title.md, such as 2026-12-01-my-first-note.md. The title part of the name becomes the address: /notes/my-first-note/. The date in the name is the note’s date.

---
title: "Why I still write plain CSS"
description: "How custom properties and cascade layers cover most of what I need."
date: 2026-10-28 09:00:00 +0000
tags: [CSS, Front-end]
---

Your note, in Markdown.

Field	What it does
title	The heading.
description	The lead line under the heading, the line on the note’s card, and what search engines show. Always write one.
date	Optional if the file name has the date.
tags	The note’s topics. See below.
image	An optional cover picture, with src, widths, width, height and alt, as in Works. Add path (the full-size file) for the picture shown when the note is shared.

What a note shows:

• The date and reading time (“4 min read”), worked out from the word count at 200 words a minute, never under one minute.
• A back link to All notes, and the topics as links.
• Code blocks, quotes, lists and ## headings styled for the theme.
• Links to the previous and next notes by date.
• An author box at the end: your initials in a round badge, “Written by” and your izar.name, a short bio and a “Say hello” link to /contact/. The bio is the author_bio line in _data/strings.yml, so write your own there.

Delete the four sample notes when you have your own.

Topics

tags are the topics. Every topic chip links to its group on the Topics page, at /notes/tags/#css. The group’s id is the topic with spaces and capitals turned into a web-safe form, so “Front-end” is #front-end.

The Topics page is notes-tags.md. Its notes section has variant: tags: each topic is its own heading with a count, in alphabetical order, with its notes listed under it. You don’t have to maintain anything: add a tag to a note and the topic appears.

Use the same spelling every time (“Front-end”, not “Front end” or “front-end”), or you’ll get two topics.

The Notes page (notes.md) has a topics_link, which adds the “All topics” link at the top. Remove it if you don’t want the link.

Showing notes elsewhere

The notes section reads the notes for you. Add it to any page, for example three cards on the home page:

  - type: notes
    variant: cards
    tone: band
    heading: From the Notes
    limit: 3
    link:
      label: All notes
      url: /notes/

Use tag: CSS to show only the notes with that topic. See Sections.

The feed

The jekyll-feed plugin builds an RSS feed of your notes at /feed.xml, and links to it in every page’s <head> so feed readers can find it. Set title, description and url in _config.yml, because the feed uses them. The plugin is on GitHub Pages’ list, so there’s nothing to install.

Keep these addresses

Some links inside the theme are fixed: notes link back to /notes/, topics link to /notes/tags/, and the author box links to /contact/. If you move those pages, change the permalinks back or edit _layouts/post.html and _includes/tag-links.html.

Words on note pages

The dates and the labels such as “Previous”, “Next” and “min read” come from _data/strings.yml. To show dates as 28/10/2026, set date_format: "%d/%m/%Y".