alifeee / blog Goto Github PK

HTML blog

Jupyter Notebook 95.07% HTML 2.96% CSS 0.21% Python 0.50% JavaScript 1.14% XSLT 0.10% Shell 0.02%

alpinejs giscus zero-md anchorjs blog google-fonts

blog's Introduction

alifeee's blog

This repo contains blog stuff that I write, as well as any code used to generate it. It can be found on blog.alifeee.co.uk

Markdown

Markdown parsing is done client side using zero-md. This is to avoid using a build step.

<head>
    ...
  <script
    type="module"
    src="../zero-md.js"
  ></script>
  ...
</head>
<body>
  ...
  <zero-md src="/example.md"></zero-md>
  ...
</body>

RSS Feed

An RSS feed is generated using Python via workflow. You can find (and subscribe to it) here: https://blog.alifeee.co.uk/feed.xml.

blog's People

Contributors

Watchers

blog's Issues

add tagging system

some examples sites with this:

https://www.tomforth.co.uk/allposts/

https://eleventy-base-blog.netlify.app/tags/second-tag/

basically, tag each article with 1+ tags, and collate them at the top of the main HTML page, for the user to click. Clicking a tag takes you to a list (or filters the page) to pages with only that tag

redo footer

it is outdated

however, I should probably wait for #30 to be complete as it will be easier then than changing all 10 html files

add analytics with https://www.goatcounter.com/

add clickspark

https://github.com/hexagoncircle/click-spark

add "articles from around the web" section

This probably should wait until I use a static site generator like eleventy

Source: https://sr.ht/~sircmpwn/openring/

example:

add light/dark mode toggle?

mainly just because I want to implement a switch like this

https://codepen.io/logs/pen/gZZGpm

add length preview

On some blogging sites, there is a preview, something like

248 words, 8 minutes

see, e.g., Medium

It would be neat to have something like this on here

remove data-loading="lazy" from giscus

I did this in ccce06c but it may not be done for new blogs. Maybe come up with a way of ensuring this script is the same in all pages that include it

...(uh oh, this is starting to look like it would be improved with templates...)

make external links target="blank"

if a link does not go to my site (blog.alifeee.co.uk), it should have target="_blank". I think this is the standard.

This would involve adding a rule to the Markdown parser to add target="_blank" if the base URL did not match my blog.

Probably should wait until #30 is done to be easier

Add tiny intro on main page

Maybe remove the "first" blog post and just put it on the main page

make "/latest" endpoint

this will go to the latest blog post

again, this will be very doable after #30 with <meta refresh

add images to RSS feed

Examples

RSS feed without images (mine):

RSS feed with images:

How to

It seems like you have to cheat RSS/Atom. There is no native way of doing this.

See:

make RSS feed

the current feed (https://blog.alifeee.co.uk/feed.xml) is an ATOM feed. I should make an RSS feed

add AnchorJS

Currently, this must be done by adding the no-shadow tag to the <zero-md> elements. This is a bit sad, I like shadow DOM.

However, there doesn't seem to currently be a better way.

However however, disabling the shadow dom at the moment would anchor links (as per zerodevx/zero-md#82). So once that is closed, I can implement this using light-dom.