Publishing my notes
# Thinking it through
# Sept. 16, 2022
I’m
currently
publishing via
Blot. It’s an excellent service and has recently launched support for [[wikilink]]
format links. Arguably, this is sufficient for my needs: I just have to be careful not to use Obsidian features in any published pages. Namely, I wouldn’t be able to link sections or blocks nor embed any content. I also wouldn’t have the neat page-preview feature provided by many Obsidian-friendly publishing options. Nor would the site provide backlinks or graph views of the notes.(Do I want backlinks or graph views?) Blot would take the least amount of effort to start publishing and would involve no additional cost.
The case against Blot is that there are some features of “digital gardens” that might be nice to have that aren’t likely to be added to Blot anytime soon. The aforementioned backlinks and graph views are two, as are embedded and previewed content. The trouble is that most of the options β with the exception of Quartz β don’t offer feed-type views of the contents, so if I use any of those alone I will have no way of publishing feeds of articles. This is important to me because I think publishing standalone articles is often the best way to share ideas. Put differently: I think that browsing notes is not a good reader experience.
So, for now, I have to do two things:
- Develop a design theory for publishing. Why do I want to do this? What problems am I trying to solve, and how will I know if the changes I make succeed?
- Look at the options.
# Oct. 26, 2022
After reviewing existing options extensively, I decided to try Quartz. This site is the result of that migration. I’ve actually changed a number of things:
- Switching from https://blot.im to Quartz/Hugo for page rendering
- Self-hosting my site via Linode
- Setting up a personal git server for syncing and publishing
Most of the rough edges have since been polished down, but there’s still some work to do.
# Jan 15, 2023
I’m in the final stages of migration now. I have a few tasks ahead of me:
- Move pages from my previous sites into the new site.
- Update media links:
- .mov should become .gif
- Format should be
![[wikilink embed style]]
- Update page metadata
- Run “Update Title and Date”
- Run “Metadata Menu field options”
- Insert
>
in blank lines in blockquotes - Delete
#
title lines - Fix images
- add figcaption
- Create a parsing rule for figcaptions in Quartz
- [?] Maybe use
]]\n__
, indicating double-underscored text immediately following a line ending in a link
- [?] Maybe use
- Create a parsing rule for figcaptions in Quartz
- Make sure linked images/media are lowercased
- remove
'
s and other special characters from image filenames - use
![[]]
-style images, without URL encoding
- add figcaption
- Switch metadata to lowercase fields
- For major pages, create a direct redirect from previous URLs to the new one (e.g., https://axle.design/obsidian-roam-and-the-rise-of-integrated-thinking-environments/ to https://fulcra.design/articles/obsidian-roam-and-the-rise-of-integrated-thinking-environments/)
- For all other pages, figure out how to create a search redirect so that the page loads with a search for the terms instead of a 404
# Tasks
- Explore using Quartz
- Decide on a tech steck: Notes/β³ Decide on a tech stack for Quartz
- Test a subset of my notes and articles
- Style the site
- Make sidebars responsive
- Add sidebar nav responsiveness
- Put graph under a
summary
, label it “related”- Expand automatically on wide screens / collapse automatically on narrow screens
- On mobile, put graph at the top of
article
- Add backlinks to the footer at the bottom of
Article
- Add “return to top” button
- Differentiate between internal and external links
- Change internal links to full low-opacity gradient background
- Change external links to fully coloured text
- Create a full feed
- Add CSS differentiating Notes from Posts in the article view
- Make the index a continuous list of items sorted by lastmod
- Make posts/articles/projects differentiated in the main page
- Set up feed to show full contents of highlights vs summaries of articles/posts
- Style links
- internal versus external
- Standardize font sizes
- increase header font size on feed for small screens
- Add gradient topbar
- Add to all pages
- Add gradients to headings and links
- Add logos
- Fix header layout on small screens
- Tone down the vibrancy on callout colours
- Fix underlines under tags, meta
- Make notes in the feed more understated, like
https://fulcra.blot.im
’s highlights - Colour headings of items with a summary
- switch the 1000px media queries to 850
- underline all in-text links
- Make sidebars responsive
- If a Post has a Link, include the full text in the feed
- Separate out highlights into their own feed
- Fix the iOS landscape rotation font-size issue
- Revise the summary notes workflow to include Hugo’s draft parameter
- Revise the summary notes workflow to include a
link:
YAML parameter to the original source - Add title and date metadata to automated summary notes
- Look into adding a parser to textprocessing.html to deal with citekeys
- Remove
x-devonthink-item
links- Using
\[(([\.\\=\-βββ¦ββ,?!@#$%^&*\(\)ββ'"éøΔΓ’Ε‘Γ‘\w\d](\s)?)*)\]\(x-devonthink-item:\/\/([A-z0-9](-?))*\)
for search and[[$1.pdf]]
for replace in VS Code’s find and replace all allowed me to replace all instances of DEVONthink links with .pdf-suffixed wikilinks.
- Using
- Place internal-use data in the index notes within comment blocks
- Using
---\n\n(((.*)\n)*```)
for search and---\n\n%%\n$1\n\n%%
for replace in VS Code’s find and replace allowed me to do this to all index notes in one step
- Using
- Sanitize index files
- Merge blog posts in from Blot
- Fulcra
- Axle
- Set up redirects
- Search for instances of axle.design on the web, and fix whatever links are found
- https://axle.design/automation-for-augmented-cognition-mise-en-place
- https://axle.design/a-systems-model-of-anxiety-driven-procrastination
- https://axle.design/the-best-of-both-worlds-one-click-reference-metadata-for-bookends-with-zotero
- https://axle.design/connect-devonthink-pdfs-bookends-references-and-obsidian-summary-notes-with-this-script
- https://axle.design/there-is-only-one-next-action-for-any-project
- https://axle.design/stream-annotations-from-your-pdf-reading-sessions-with-devonthink
- https://axle.design/obsidian-roam-and-the-rise-of-integrated-thinking-environments
- https://axle.design/devonlink-integrate-obsidian-and-devonthink
- https://axle.design/an-integrated-qualitative-analysis-environment-with-obsidian
- https://axle.design/devonsave-v3-a-shortcut-to-help-you-clip-articles-to-clean-pdfs-in-devonthink-to-go-3-and-devonthink
- https://axle.design/devonsave-a-shortcut-to-help-you-clip-websites-to-devonthink-to-go-quickly-and-cleanly
- https://axle.design/an-obsidian-homescreen-for-iphone-and-ipad#books-button
- https://axle.design/working-with-obsidian-and-noteplan
- https://axle.design/systemics-and-design-principles-in-support-of-tiago-forte-s-para-framework
- https://www.youtube.com/redirect?event=video_description&redir_token=QUFFLUhqbmotTHYxQnBpNUppNmV1NlB5LWViYTluYW9yQXxBQ3Jtc0tuZkFlMG5aODg4WTRBZ1RqeHRtMGJENmJyQmJZTXIzZjlnblJEcm0wakpUb3l0QThNNzZBR0JLNTEzTGktNWk1NlVnb096X2U1Wm9PTmw1RTV1QWdrZi1rczV2WEdwWlljazMyOVh0dzVKeHNnSDh3VQ&q=https%3A%2F%2Faxle.design%2Fobsidian-roam-and-the-rise-of-integrated-thinking-environments%25E2%2580%2594what-they-are-what-they-do-and-what-s&v=fhkwEgGFOg8
- Search for instances of axle.design on the web, and fix whatever links are found
- Set up redirects
- [-] Merge pages from Nervous Lightning
- Add about, now, and ideas pages
- Standardize tags
- Check out Obsidian GitHub Publisher
- Create tag/category pages
as per Jacky’s instructions
- Consider layouts like https://gordonbrander.com/pattern
- Revise the design of summarized notes and linkposts
- For linkposts, put the headline/link at the end
- Look into POSSE
- Set up my domain on Mastodon/ActivityPub
- Style RSS https://darekkay.com/blog/rss-styling/
- Set up menus
- Menu options
- Projects
- Posts
- Articles
- Books
- Highlights
- Notes
- Subscribe
- About
- Systems Sketching
- Resources
- Meridian
- Menu options
- Set up a home page
- Inspiration:
- Add a
link:
field to the index note generator, fill it in from DEVONthink metadata - Edit the page template for index notes and reading session notes to make the title link out to the
link
frontmatter value if one is found - Change the index note generator to wrap internal-use data in index files in comment syntax
- Revise the summary notes workflow to link to the resource note instead of the DEVONthink file
- Revise the summary notes automation to make citekey generation add a citekey metadata value to DEVONthink to make the summary note generation more reliable
- Create an “Add summary YAML” workflow via Metadata Menu or Templater
- Look into editing textprocessing.html to enable == highlights on Quartz
- Consider switching from nginx to Caddy
- Figure out how to get citekey links to appear on backlinks/graph
- add a template to generate a json of links from citekey-mentions in the same structure as linkIndex
- trigger that template on site build
- feed both linkIndex.json and citekeyIndex.json into backlinks and graph
- Make sketching.systems redirect to a sketching systems feed on fulcra.design ^f26u69
- Change callout background colour to
rgba(0, 0, 0, .2)
or to the callout colour with low opacity - Fix search
- Add about page
- Create an “edit this page” shortcut for iOS/KM macro
- Create an “Add selected tags” Obsidian workflow
- Add highlights/reading summary notes
- Add continuity features
- Add next and previous footers at the bottom of
Article
- Add recent edits footer at the bottom of
Article
- Add next and previous footers at the bottom of
- Set up separate RSS feeds and newsletters for each stream of posts
- Decide on analytics options
- Fathom
- Matomo
- Keen.io
- IPFS?
- Segment
- Simple Analytics
- Umami
- Implement stacked pages
- Move title to left sidebar
- Develop javascript to add pages as a stack
- Pseudocode: listen for clicks on
internal-link
s; when clicked, run it through thetextprocessing.html
partial and get the result;getElementByID("footer")
, insert the result in the DOM before the footer
- Pseudocode: listen for clicks on
- Develop CSS to handle stacking
- Add download page as PDF feature using Pandoc
- Explore options with paywalling/establishing private sections
- Set up queuing macros for publishing new posts
- Get back to David re: YAML
- [-] Look into using Forklift for Git https://binarynights.com/ ^mxkrvox
# Resources
- GitHub - awesome-selfhosted/awesome-selfhosted: A list of Free Software network services and web applications which can be hosted on your own servers
- Various ways to include comments on your static site
- Chirpy - comments system
- Plausible Analytics | Simple, privacy-friendly Google Analytics alternative