KnowledgeBase

Search

SearchSearch

Quartz

Dec 12, 2023, 7 min read

Local Test Install

Installed Quartz from : https://quartz.jzhao.xyz

Install Commands:

git clone https://github.com/jackyzha0/quartz.git
cd quartz
npx quartz create

Setup: ◇  Choose how to initialize the content in /Users/abrophy/quartz/content │  Empty Quartz

◇  Choose how Quartz should resolve links in your content. You can change this later in quartz.config.ts. │  Treat links as absolute path

Start Serving:

npx quartz build --serve

Also found you can export word files to markdown using Pandoc. More info here https://medium.com/geekculture/how-to-easily-convert-word-to-markdown-with-pandoc-4d60878ccc64

Can install with brew:

brew install pandoc

Left off with quartz installed and ready to run using the serve command above. Access the web page at http://localhost:8080

Need to play with creating a fuller site inside Quartz as well as learning how to publish the static pages to a real server.

CloudFlare Pages Install

This setup involves forking quartz from github into my github. Then cloning my github quartz repository to my local MacBook Pro.

Forking quartz onto my GitHub so I can use GitHub or Cloudflare to host quartz site. This page describes the process for quartz 3 but works for v4 https://robzeh.github.io/quartz/notes/setup/

I forked his github repository to my account. In github desktop I cloned it to my local MacBook Pro in Documents/GitHub/quartz

In CloudFlare I created a Pages application using the info from https://robzeh.github.io/quartz/notes/setup/ using the following info for CloudFlare:

Configuration optionValue
Production branchv4
Framework presetNone
Build commandnpx quartz build
Build output directorypublic

Needed to add all the files in the ‘content’ folder in git in terminal. Then a commit pushed my local files to the GitHub version.

Added the subdomain blog.porpoiseunknown.com to point to this cloudflare page.

All is working now.

My Vault

https://knowledgebase-9vj.pages.dev/

I created a new clone of quartz in my github account by using the “import repository” option in github online. I then pulled the origin to my macbook pro in the folder Documents/GitHub/KnowledgeBase/.

I couldn’t figure out how to symlink my live obsidian files, so I just emptied the base content folder and made a copy of the live files for now in the content folder.

I overwrote the index.md file by mistake, so I grabbed another one.

After all that I was able to make a new Page in cloudflare and point it to the github repository KnowledgeBase.

I setup a folder action to copy all files from Obsidian Vault to the Documents/GitHub/KnowledgeBase/content/ folder. When a new file is made in the vault it will copy all files. Typically, this update will happen every day when Obsidian creates a daily note. However, it’s not perfect since the new page triggers the update, but the new page content isn’t there at time of trigger. Also, since the repository is on my laptop, the folder action will only run if the laptop is up and running.

Redeployment of My Vault

I moved my vault into GitHub/KnowledgeBase folder from the iCloud Drive/Obsidian folder. This also changed the name of my vault from Obsidian Vault to KnowledgeBase. This allowed me to have my vault directly in the place where my github repositories are, making deployment via quartz more standard.

This also solved the problem of needing to copy my Obsidian files into the GitHub/KnowledgeBase folder.

I changed the default quartz deployment on CloudFlare to use: npx quartz build -d 'KnowledgeBase' which changes the ‘content’ directory to be ‘KnowledgeBase’ instead.

I added a publish filter that requires an explicit publish directive in the frontmatter

publish: true

I added the publish filter to the quartz.config.ts file

    filters: [
      Plugin.RemoveDrafts(),
      Plugin.ExplicitPublish(),
    ],

I also added a subdomain to CloudFlare: kb.ecoplunge.com

Installing Obsidian GIT on iPhone

Since the KnowledgeBase vault is outside of the Obsidian folder in iCloud drive, Obsidian for iOS can not interact with it. Obsidian needs full access to all files in the vault at all times to maintain the file contents when changes are made, e.g., fixing links.

The solution to this is to use the Obsidian Git plugin to sync the changes with GitHub. Since GitHub is now the source of truth for my main vault KnowledgeBase, this works well.

Caveats

The biggest issue with this deployment is that the entire quartz folder is the vault on the iPhone. On the Mac, Obsidian can open any folder as a vault, so it’s just opening the KnowledgeBase sub folder in the KnowledgeBase repository. But on iOS, I’m using the Obsidian Git plugin which means to fill the local iOS vault with content I have to checkout the whole GitHub repository KnowledgeBase. Now I have the quartz files in my vault on iOS. I don’t think there are any ill effects. I can edit files on iOS or other locations and the files get synced via the source of truth on GitHub.

I may be able to change this setup by checking out only the KnowledgeBase folder into the iOS vault. However, I don’t know how to do this with Obsidian Git plugin. Could probably do it with Working Copy but that adds another layer of complexity.

Steps

(From https://github.com/denolehov/obsidian-git/blob/master/docs/Getting%20Started.md)

The instructions assume you are using GitHub, but can be extrapolated to other providers.

  1. Make sure any outstanding changes on all devices are pushed and reconciled with the remote repo.
  2. Install Obsidian for Android or iOS.
  3. Create a new vault (or point Obsidian to an empty directory). Do NOT select Store in iCloud if you are on iOS. (This can be the same name or different to denote it is a clone of the GitHub repository. I named mine KnowledgeBaseiOS. The location of files stored locally in Obsidian is found at On My iPhone/Obsidian)
  4. If your repo is hosted on GitHub, authentication must be done with a personal access token. Detailed instruction for that process can be found here.
    • Minimal permissions required are
      • “Read access to metadata”
      • “Read and Write access to contents and commit status”
  5. In Obsidian settings, enable community plugins. Browse plugins to install Obsidian Git.
  6. Enable Obsidian Git (on the same screen)
  7. Go to Options for the Obsidian Git plugin (bottom of main settings page, under Community Plugins section)
  8. Under the “Authentication/Commit Author” section, fill in the username on your git server and your password/personal access token.
  9. Don’t touch any settings under “Advanced”
  10. Exit plugin settings, open command palette, choose “Obsidian Git: Clone existing remote repo”.
  11. Fill in repo URL in the text field and press the repo URL button below it. The repo URL is NOT the URL in the browser. You have to append .git. - `https://github.com//.git
    • E.g. https://github.com/denolehov/obsidian-git.git
  12. Follow instructions to determine the folder to place repo in and whether an .obsidian directory already exits.
  13. Clone should start. Popup notifications (if not disabled) will display the progress. Do not exit until a popup appears requesting that you “Restart Obsidian”.

Local Quartz Directory Change

I kept getting corruption in my .git folder which may be from iCloud/Git syncing issues. I moved my entire local GitHub folder to the user root on my laptop and desktop: /abrophy/GitHub/. I will only clone GitHub repositories and sync them locally on each device as needed.

Kerri’s Vault

Worked on getting Kerri’s blog setup on her own GitHub so she can make content on her own computer and account and push to GitHub. Still using my cloudflare to publish. Can’t get the publish: true file property plugin to work. Honors the draft plugin but not the publish one.

Graph View

Backlinks