summaryrefslogtreecommitdiff
path: root/posts
diff options
context:
space:
mode:
authorbt <bt@web>2023-12-09 09:44:35 -0500
committerIkiWiki <ikiwiki.info>2023-12-09 09:44:35 -0500
commite97811f0023991ebaccc7f891c19038937447ac6 (patch)
tree547c0bbfc67fde101a38234e5cdd792bda71c470 /posts
parent41fdd2b674e60d097289e67350e5a2ed462f9d97 (diff)
Diffstat (limited to 'posts')
-rw-r--r--posts/openring.md144
1 files changed, 70 insertions, 74 deletions
diff --git a/posts/openring.md b/posts/openring.md
index 8c1c6c6..39c9d00 100644
--- a/posts/openring.md
+++ b/posts/openring.md
@@ -1,6 +1,5 @@
-# Building openring with Jekyll Build
-
-2022-12-02
+[[!meta title="Building openring with Jekyll Build"]]
+[[!meta date="2022-12-02"]]
I think it's great when bloggers post their own personal "reading list" of blogs they themselves follow. Whether this is a customized Blogroll page or footnotes in their individual articles, I find it really helpful to find more interesting content on the "indie" web. This isn't a new concept by any means, but I wanted something a little more "dynamic"[^1] for my own blog.
@@ -24,58 +23,58 @@ You *could* setup a whole new directory specifically for your openring files, bu
### openring-in.html Contents
-```
-<!-- License-Id: CC0-1.0 -->
-<section class="webring">
- <h3>Articles from blogs I follow around the world wide web</h3>
- <section class="articles">
- {{range .Articles}}
- <div class="article">
- <h4 class="title">
- <a href="{{.Link}}" rel="noopener">{{.Title}}</a>
- </h4>
- <p class="summary">{{.Summary}}</p>
- <small class="source">
- via <a href="{{.SourceLink}}">{{.SourceTitle}}</a>
- </small>
- <small class="date">{{.Date | datef "January 2, 2006"}}</small>
- </div>
- {{end}}
- </section>
- <p class="attribution">
- Generated by
- <a href="https://git.sr.ht/~sircmpwn/openring">openring</a>
- </p>
-</section>
-<style>
-.webring .articles {
- display: flex;
- flex-wrap: wrap;
- margin: -0.5rem;
-}
-.webring .title {
- margin: 0;
-}
-.webring .article {
- flex: 1 1 0;
- display: flex;
- flex-direction: column;
- margin: 0.5rem;
- padding: 0.5rem;
- background: #eee;
- min-width: 10rem;
-}
-.webring .summary {
- font-size: 0.8rem;
- flex: 1 1 0;
-}
-.webring .attribution {
- text-align: right;
- font-size: 0.8rem;
- color: #555;
-}
-</style>
-```
+
+ <!-- License-Id: CC0-1.0 -->
+ <section class="webring">
+ <h3>Articles from blogs I follow around the world wide web</h3>
+ <section class="articles">
+ {{range .Articles}}
+ <div class="article">
+ <h4 class="title">
+ <a href="{{.Link}}" rel="noopener">{{.Title}}</a>
+ </h4>
+ <p class="summary">{{.Summary}}</p>
+ <small class="source">
+ via <a href="{{.SourceLink}}">{{.SourceTitle}}</a>
+ </small>
+ <small class="date">{{.Date | datef "January 2, 2006"}}</small>
+ </div>
+ {{end}}
+ </section>
+ <p class="attribution">
+ Generated by
+ <a href="https://git.sr.ht/~sircmpwn/openring">openring</a>
+ </p>
+ </section>
+ <style>
+ .webring .articles {
+ display: flex;
+ flex-wrap: wrap;
+ margin: -0.5rem;
+ }
+ .webring .title {
+ margin: 0;
+ }
+ .webring .article {
+ flex: 1 1 0;
+ display: flex;
+ flex-direction: column;
+ margin: 0.5rem;
+ padding: 0.5rem;
+ background: #eee;
+ min-width: 10rem;
+ }
+ .webring .summary {
+ font-size: 0.8rem;
+ flex: 1 1 0;
+ }
+ .webring .attribution {
+ text-align: right;
+ font-size: 0.8rem;
+ color: #555;
+ }
+ </style>
+
> Sidenote: You will get minor Liquid Syntax warnings in the console when running your website via `serve` or `build`. I don't really mind those warnings but if you do, feel free to move these files out into their own sub-directory in your project folder.
@@ -89,33 +88,31 @@ To simplify things, we are going to place our main commands in a single build sc
Place the following inside that file:
-```
-openring \
- -s https://example.com/feed.xml \
- -s https://example.com/feed.xml \
- -s https://example.com/feed.xml \
- < _includes/openring-in.html \
- > _includes/openring-out.html
-bundle exec jekyll build
-```
+
+ openring \
+ -s https://example.com/feed.xml \
+ -s https://example.com/feed.xml \
+ -s https://example.com/feed.xml \
+ < _includes/openring-in.html \
+ > _includes/openring-out.html
+ bundle exec jekyll build
+
## Edit `_config.yml`
Next we need to make sure we exclude our new `build-site` script file, since we really don't need that pushed up to the main server:
-```
-# Includes / Excludes
-exclude:
- - build-site.sh
-```
+ # Includes / Excludes
+ exclude:
+ - build-site.sh
## Almost Done...
Now you just need to decide where you want your `openring` feed outputs to render. For this example, we will place them at the bottom of every blog post inside the `_layouts/post.html` file, like so:
-```
-{% raw %}{% include openring-out.html %}{% endraw %}
-```
+
+ {% raw %}{% include openring-out.html %}{% endraw %}
+
## Build It & They Will Come
@@ -127,6 +124,5 @@ I won't go into great detail about build script for SourceHut Pages, but feel fr
Happy sharing!
-## Refs
-1. Well, as dynamic as a static website can be! \ No newline at end of file
+[^1]: Well, as dynamic as a static website can be!