ar.falsy.cat/note/info-tech/publish-obsidian-by-quartz/index.html

71 lines
18 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html><html lang=en><head><meta charset=utf-8><meta name=description content="概要
Quartzで
ObsidianのVaultを公開する
「セカンドブレインデジタルガーデン」という御大層な言葉は
Quartzの紹介文からの引用
"><meta property="og:title" content="ObsidianとQuartzによるセカンドブレインデジタルガーデンの構築"><meta property="og:description" content="概要
Quartzで
ObsidianのVaultを公開する
「セカンドブレインデジタルガーデン」という御大層な言葉は
Quartzの紹介文からの引用
"><meta property="og:type" content="website"><meta property="og:image" content="https://ar.falsy.cat/icon.png"><meta property="og:url" content="https://ar.falsy.cat/note/info-tech/publish-obsidian-by-quartz/"><meta property="og:width" content="200"><meta property="og:height" content="200"><meta name=twitter:card content="summary"><meta name=twitter:title content="ObsidianとQuartzによるセカンドブレインデジタルガーデンの構築"><meta name=twitter:description content="概要
Quartzで
ObsidianのVaultを公開する
「セカンドブレインデジタルガーデン」という御大層な言葉は
Quartzの紹介文からの引用
"><meta name=twitter:image content="https://ar.falsy.cat/icon.png"><title>ObsidianとQuartzによるセカンドブレインデジタルガーデンの構築</title><meta name=viewport content="width=device-width,initial-scale=1"><link rel="shortcut icon" type=image/png href=https://ar.falsy.cat//icon.png><link href=https://ar.falsy.cat/styles.80333fa2099c0bee674efa435fde378c.min.css rel=stylesheet><link href=https://ar.falsy.cat/styles/_light_syntax.86a48a52faebeaaf42158b72922b1c90.min.css rel=stylesheet id=theme-link><script src=https://ar.falsy.cat/js/darkmode.557cde7fcc3511a3d7ca8545ecd46d77.min.js></script>
<script src=https://ar.falsy.cat/js/util.00639692264b21bc3ee219733d38a8be.min.js></script>
<link rel=preload href=https://cdn.jsdelivr.net/npm/katex@0.15.1/dist/katex.min.css as=style onload='this.onload=null,this.rel="stylesheet"' integrity=sha384-R4558gYOUz8mP9YWpZJjofhk+zx0AS11p36HnD2ZKj/6JR5z27gSSULCNHIRReVs crossorigin=anonymous><script defer src=https://cdn.jsdelivr.net/npm/katex@0.15.1/dist/katex.min.js integrity=sha384-z1fJDqw8ZApjGO3/unPWUPsIymfsJmyrDVWC8Tv/a1HeOtGmkwNd/7xUS0Xcnvsx crossorigin=anonymous></script>
<script defer src=https://cdn.jsdelivr.net/npm/katex@0.15.1/dist/contrib/auto-render.min.js integrity=sha384-+XBljXPPiv+OzfbB3cVmLHf4hdUFHlWNZN5spNQ7rmHTXpd7WvJum6fIACpNNfIR crossorigin=anonymous></script>
<script defer src=https://cdn.jsdelivr.net/npm/katex@0.16.2/dist/contrib/copy-tex.min.js integrity=sha384-ww/583aHhxWkz5DEVn6OKtNiIaLi2iBRNZXfJRiY1Ai7tnJ9UXpEsyvOITVpTl4A crossorigin=anonymous></script>
<script src=https://cdn.jsdelivr.net/npm/@floating-ui/core@1.2.1></script>
<script src=https://cdn.jsdelivr.net/npm/@floating-ui/dom@1.2.1></script>
<script defer src=https://ar.falsy.cat/js/popover.0094f98610bd792200f053b9a02426a4.min.js></script>
<script defer src=https://ar.falsy.cat/js/code-title.ce4a43f09239a9efb48fee342e8ef2df.min.js></script>
<script defer src=https://ar.falsy.cat/js/clipboard.2913da76d3cb21c5deaa4bae7da38c9f.min.js></script>
<script defer src=https://ar.falsy.cat/js/callouts.7723cac461d613d118ee8bb8216b9838.min.js></script>
<script>const SEARCH_ENABLED=!1,LATEX_ENABLED=!0,PRODUCTION=!0,BASE_URL="https://ar.falsy.cat/",fetchData=Promise.all([fetch("https://ar.falsy.cat/indices/linkIndex.b5280e8bbb1751fc9b140e6147b1b336.min.json").then(e=>e.json()).then(e=>({index:e.index,links:e.links})),fetch("https://ar.falsy.cat/indices/contentIndex.72208f60ee8ca7d66f7114a63c31e084.min.json").then(e=>e.json())]).then(([{index:e,links:t},n])=>({index:e,links:t,content:n})),render=()=>{const e=new URL(BASE_URL),t=e.pathname,n=window.location.pathname,s=t==n;addCopyButtons(),addTitleToCodeBlocks(),addCollapsibleCallouts(),initPopover("https://ar.falsy.cat",!0);const o=document.getElementById("footer");if(o){const e=document.getElementById("graph-container");if(!e)return requestAnimationFrame(render);e.textContent="";const t=s&&!0;drawGraph("https://ar.falsy.cat",t,[{"/moc":"#4388cc"}],t?{centerForce:1,depth:-1,enableDrag:!0,enableLegend:!1,enableZoom:!0,fontSize:.5,linkDistance:1,opacityScale:3,repelForce:1,scale:1.4}:{centerForce:1,depth:1,enableDrag:!0,enableLegend:!1,enableZoom:!0,fontSize:.6,linkDistance:1,opacityScale:3,repelForce:2,scale:1.2})}var i=document.getElementsByClassName("mermaid");i.length>0&&import("https://unpkg.com/mermaid@9/dist/mermaid.esm.min.mjs").then(e=>{e.default.init()});function a(n){const e=n.target,t=e.className.split(" "),s=t.includes("broken"),o=t.includes("internal-link");plausible("Link Click",{props:{href:e.href,broken:s,internal:o,graph:!1}})}const r=document.querySelectorAll("a");for(link of r)link.className.includes("root-title")&&link.addEventListener("click",a,{once:!0})},init=(e=document)=>{addCopyButtons(),addTitleToCodeBlocks(),renderMathInElement(e.body,{delimiters:[{left:"$$",right:"$$",display:!0},{left:"$",right:"$",display:!1}],macros:{'':"'"},throwOnError:!1})}</script><script type=module>
import { attachSPARouting } from "https:\/\/ar.falsy.cat\/js\/router.d6fe6bd821db9ea97f9aeefae814d8e7.min.js"
attachSPARouting(init, render)
</script><script defer data-domain=ar.falsy.cat src=https://plausible.io/js/script.js></script>
<script>window.plausible=window.plausible||function(){(window.plausible.q=window.plausible.q||[]).push(arguments)}</script></head><body><div id=search-container><div id=search-space><input autocomplete=off id=search-bar name=search type=text aria-label=Search placeholder="Search for something..."><div id=results-container></div></div></div><script src=https://cdn.jsdelivr.net/npm/flexsearch@0.7.21/dist/flexsearch.bundle.js integrity="sha256-i3A0NZGkhsKjVMzFxv3ksk0DZh3aXqu0l49Bbh0MdjE=" crossorigin=anonymous defer></script>
<script defer src=https://ar.falsy.cat/js/full-text-search.e6e2e0c213187ca0c703d6e2c7a77fcd.min.js></script><div class=singlePage><header><h1 id=page-title><a class=root-title href=https://ar.falsy.cat/>ar.falsy.cat</a></h1><div class=spacer></div><div id=search-icon><p>Search</p><svg tabindex="0" aria-labelledby="title desc" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19.9 19.7"><title id="title">Search Icon</title><desc id="desc">Icon to open search</desc><g class="search-path" fill="none"><path stroke-linecap="square" d="M18.5 18.3l-5.4-5.4"/><circle cx="8" cy="8" r="7"/></g></svg></div><div class=darkmode><input class=toggle id=darkmode-toggle type=checkbox tabindex=-1>
<label id=toggle-label-light for=darkmode-toggle tabindex=-1><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="dayIcon" viewBox="0 0 35 35" style="enable-background:new 0 0 35 35"><title>Light Mode</title><path d="M6 17.5C6 16.672 5.328 16 4.5 16h-3C.672 16 0 16.672.0 17.5S.672 19 1.5 19h3C5.328 19 6 18.328 6 17.5zM7.5 26c-.414.0-.789.168-1.061.439l-2 2C4.168 28.711 4 29.086 4 29.5 4 30.328 4.671 31 5.5 31c.414.0.789-.168 1.06-.44l2-2C8.832 28.289 9 27.914 9 27.5 9 26.672 8.329 26 7.5 26zm10-20C18.329 6 19 5.328 19 4.5v-3C19 .672 18.329.0 17.5.0S16 .672 16 1.5v3C16 5.328 16.671 6 17.5 6zm10 3c.414.0.789-.168 1.06-.439l2-2C30.832 6.289 31 5.914 31 5.5 31 4.672 30.329 4 29.5 4c-.414.0-.789.168-1.061.44l-2 2C26.168 6.711 26 7.086 26 7.5 26 8.328 26.671 9 27.5 9zM6.439 8.561C6.711 8.832 7.086 9 7.5 9 8.328 9 9 8.328 9 7.5c0-.414-.168-.789-.439-1.061l-2-2C6.289 4.168 5.914 4 5.5 4 4.672 4 4 4.672 4 5.5c0 .414.168.789.439 1.06l2 2.001zM33.5 16h-3c-.828.0-1.5.672-1.5 1.5s.672 1.5 1.5 1.5h3c.828.0 1.5-.672 1.5-1.5S34.328 16 33.5 16zM28.561 26.439C28.289 26.168 27.914 26 27.5 26c-.828.0-1.5.672-1.5 1.5.0.414.168.789.439 1.06l2 2C28.711 30.832 29.086 31 29.5 31c.828.0 1.5-.672 1.5-1.5.0-.414-.168-.789-.439-1.061l-2-2zM17.5 29c-.829.0-1.5.672-1.5 1.5v3c0 .828.671 1.5 1.5 1.5s1.5-.672 1.5-1.5v-3C19 29.672 18.329 29 17.5 29zm0-22C11.71 7 7 11.71 7 17.5S11.71 28 17.5 28 28 23.29 28 17.5 23.29 7 17.5 7zm0 18c-4.136.0-7.5-3.364-7.5-7.5s3.364-7.5 7.5-7.5 7.5 3.364 7.5 7.5S21.636 25 17.5 25z"/></svg></label><label id=toggle-label-dark for=darkmode-toggle tabindex=-1><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="nightIcon" viewBox="0 0 100 100" style="enable-background='new 0 0 100 100'"><title>Dark Mode</title><path d="M96.76 66.458c-.853-.852-2.15-1.064-3.23-.534-6.063 2.991-12.858 4.571-19.655 4.571C62.022 70.495 50.88 65.88 42.5 57.5 29.043 44.043 25.658 23.536 34.076 6.47c.532-1.08.318-2.379-.534-3.23-.851-.852-2.15-1.064-3.23-.534-4.918 2.427-9.375 5.619-13.246 9.491-9.447 9.447-14.65 22.008-14.65 35.369.0 13.36 5.203 25.921 14.65 35.368s22.008 14.65 35.368 14.65c13.361.0 25.921-5.203 35.369-14.65 3.872-3.871 7.064-8.328 9.491-13.246C97.826 68.608 97.611 67.309 96.76 66.458z"/></svg></label></div></header><article><h1>ObsidianとQuartzによるセカンドブレインデジタルガーデンの構築</h1><p class=meta>Last updated
Jun 21, 2023</p><ul class=tags><li><a href=https://ar.falsy.cat/tags/note/>Note</a></li><li><a href=https://ar.falsy.cat/tags/info-tech/>Info tech</a></li><li><a href=https://ar.falsy.cat/tags/web/>Web</a></li><li><a href=https://ar.falsy.cat/tags/tool/>Tool</a></li><li><a href=https://ar.falsy.cat/tags/howto/>Howto</a></li></ul><aside class=mainTOC><details><summary>Table of Contents</summary><nav id=TableOfContents><ol><li><a href=#概要>概要</a></li><li><a href=#初期設定>初期設定</a></li><li><a href=#記事の執筆>記事の執筆</a></li><li><a href=#ローカルプレビュー>ローカルプレビュー</a></li><li><a href=#カスタマイズ>カスタマイズ</a><ol><li><a href=#recent-notesの表示数を変更する>Recent Notesの表示数を変更する</a></li><li><a href=#トップページにグローバルグラフを表示する>トップページにグローバルグラフを表示する</a></li><li><a href=#記事にrelated-notesを表示する>記事にRelated Notesを表示する</a></li></ol></li><li><a href=#所感>所感</a></li></ol></nav></details></aside><a href=#概要><h2 id=概要><span class=hanchor arialabel=Anchor># </span>概要</h2></a><ul><li><a href=https://github.com/jackyzha0/quartz rel=noopener>Quartz</a>
<a href=/note/info-tech/obsidian/ rel=noopener class=internal-link data-src=/note/info-tech/obsidian/>Obsidian</a>のVaultを公開する</li><li><em>セカンドブレインデジタルガーデン</em>」という御大層な言葉は
<a href=https://github.com/jackyzha0/quartz rel=noopener>Quartz</a>の紹介文からの引用</li></ul><a href=#初期設定><h2 id=初期設定><span class=hanchor arialabel=Anchor># </span>初期設定</h2></a><ol><li><a href=https://github.com/jackyzha0/quartz rel=noopener>Quartz</a>をforkする</li><li>GitHub Actionsを有効化</li><li>repoの設定で<code>workflow permission</code><code>read and write permissions</code>へ変更<ul><li>これしないとdeployに失敗する</li></ul></li><li>repoをローカルにclone</li><li><code>data/config.yaml</code>をいい感じに編集<ul><li><code>author</code>など</li></ul></li><li><code>config.toml</code>をいい感じに編集<ul><li><code>baseURL</code>など</li></ul></li><li>pushする</li><li>deployが終わったらGitHub Pagesのドメイン設定をする</li></ol><a href=#記事の執筆><h2 id=記事の執筆><span class=hanchor arialabel=Anchor># </span>記事の執筆</h2></a><ol><li>ローカルrepoの<code>content/</code>ディレクトリをVaultとしてObisidianで開く<ul><li><code>content/templates/</code>は弄ってはいけない</li></ul></li><li>記事を書く</li><li>pushする</li></ol><a href=#ローカルプレビュー><h2 id=ローカルプレビュー><span class=hanchor arialabel=Anchor># </span>ローカルプレビュー</h2></a><ul><li>dockerがあればリポジトリrootで<code>make docker</code>すれば<code>localhost:1313</code>にアクセスできる</li><li><code>Makefile</code><code>docker</code>ターゲットのコマンドを下のように置き換えることで次の問題が解決できる<ul><li>Ctrl+Cでサーバーが終了しない</li><li><code>make docker</code>する度にゴミコンテナが残る</li></ul></li></ul><div class=highlight><div class=chroma><table class=lntable><tr><td class=lntd><pre tabindex=0 class=chroma><code><span class=lnt>1
</span></code></pre></td><td class=lntd><pre tabindex=0 class=chroma><code class=language-bash data-lang=bash><span class=line><span class=cl>docker run -it --init --name quartz-preview --volume<span class=o>=</span><span class=k>$(</span>shell <span class=nb>pwd</span><span class=k>)</span>:/quartz -p 1313:1313 ghcr.io/jackyzha0/quartz:hugo<span class=p>;</span> docker rm quartz-preview
</span></span></code></pre></td></tr></table></div></div><a href=#カスタマイズ><h2 id=カスタマイズ><span class=hanchor arialabel=Anchor># </span>カスタマイズ</h2></a><a href=#recent-notesの表示数を変更する><h3 id=recent-notesの表示数を変更する><span class=hanchor arialabel=Anchor># </span>Recent Notesの表示数を変更する</h3></a><ol><li><code>layouts/partials/recent.html</code><code>first 3 $notes</code>を変更する</li></ol><a href=#トップページにグローバルグラフを表示する><h3 id=トップページにグローバルグラフを表示する><span class=hanchor arialabel=Anchor># </span>トップページにグローバルグラフを表示する</h3></a><ol><li><code>data/graphConfig.yaml</code><code>enableGlobalGraph</code><code>true</code>にする</li></ol><a href=#記事にrelated-notesを表示する><h3 id=記事にrelated-notesを表示する><span class=hanchor arialabel=Anchor># </span>記事にRelated Notesを表示する</h3></a><ol><li><code>layouts/partials/recent.html</code>を作成</li><li><code>layouts/_default/single.html</code>の好きな位置に<code>{{partial "related.html" .}}</code>を挿入</li><li><code>i18n/en.toml</code><code>related_notes</code>の翻訳を追加</li></ol><p>layouts/partials/recent.html</p><div class=highlight><div class=chroma><table class=lntable><tr><td class=lntd><pre tabindex=0 class=chroma><code><span class=lnt>1
</span><span class=lnt>2
</span><span class=lnt>3
</span><span class=lnt>4
</span><span class=lnt>5
</span></code></pre></td><td class=lntd><pre tabindex=0 class=chroma><code class=language-html data-lang=html><span class=line><span class=cl><span class=p>&lt;</span><span class=nt>div</span> <span class=na>class</span><span class=o>=</span><span class=s>&#34;content-list&#34;</span><span class=p>&gt;</span>
</span></span><span class=line><span class=cl> <span class=p>&lt;</span><span class=nt>h2</span><span class=p>&gt;</span>{{ i18n &#34;related_notes&#34; }}<span class=p>&lt;/</span><span class=nt>h2</span><span class=p>&gt;</span>
</span></span><span class=line><span class=cl> {{$notes := .Site.RegularPages.Related .}}
</span></span><span class=line><span class=cl> {{partial &#34;page-list.html&#34; (first 3 $notes)}}
</span></span><span class=line><span class=cl><span class=p>&lt;/</span><span class=nt>div</span><span class=p>&gt;</span>
</span></span></code></pre></td></tr></table></div></div><a href=#所感><h2 id=所感><span class=hanchor arialabel=Anchor># </span>所感</h2></a><ul><li>扱いやすい
<a href=/note/info-tech/obsidian/ rel=noopener class=internal-link data-src=/note/info-tech/obsidian/>Obsidian</a>で執筆して,
<a href=https://github.com/jackyzha0/quartz rel=noopener>Quartz</a>でいい感じに公開ができた</li><li>執筆のためにリポジトリをcloneしなければならないため記事数が増えた時の複数PCの同期コストが問題になりそう<ul><li>ブランチ分けてPullRequest活用すれば解決する<ul><li>記事書くたびにPR作るのはクソめんどくさそう</li></ul></li></ul></li></ul><div class=content-list><h2>Related Notes</h2><ul class=section-ul><li class=section-li><div class=section><p class=meta>Jun 21, 2023</p><div class=desc><h3><a href=https://ar.falsy.cat/note/info-tech/install-archlinux/ class=internal-link data-src=/note/info-tech/install-archlinux/>ArchLinuxのインストール</a></h3></div><div class=spacer></div><ul class=tags><li><a href=https://ar.falsy.cat/tags/note/>Note</a></li><li><a href=https://ar.falsy.cat/tags/info-tech/>Info-Tech</a></li><li><a href=https://ar.falsy.cat/tags/linux/>Linux</a></li><li><a href=https://ar.falsy.cat/tags/howto/>Howto</a></li></ul></div></li><li class=section-li><div class=section><p class=meta>Jun 21, 2023</p><div class=desc><h3><a href=https://ar.falsy.cat/note/info-tech/c-cpp-sanitizer/ class=internal-link data-src=/note/info-tech/c-cpp-sanitizer/>C/C++のsanitizerの使い方</a></h3></div><div class=spacer></div><ul class=tags><li><a href=https://ar.falsy.cat/tags/note/>Note</a></li><li><a href=https://ar.falsy.cat/tags/info-tech/>Info-Tech</a></li><li><a href=https://ar.falsy.cat/tags/development/>Development</a></li><li><a href=https://ar.falsy.cat/tags/programming-language/>Programming-Language</a></li><li><a href=https://ar.falsy.cat/tags/howto/>Howto</a></li></ul></div></li><li class=section-li><div class=section><p class=meta>Jun 21, 2023</p><div class=desc><h3><a href=https://ar.falsy.cat/note/info-tech/obsidian/ class=internal-link data-src=/note/info-tech/obsidian/>Obsidianについて</a></h3></div><div class=spacer></div><ul class=tags><li><a href=https://ar.falsy.cat/tags/note/>Note</a></li><li><a href=https://ar.falsy.cat/tags/info-tech/>Info-Tech</a></li><li><a href=https://ar.falsy.cat/tags/tool/>Tool</a></li></ul></div></li></ul></div></article><hr><div class=page-end id=footer><div class=backlinks-container><h3>Backlinks</h3><ul class=backlinks><li>No backlinks found</li></ul></div><div><script src=https://cdn.jsdelivr.net/npm/d3@6.7.0/dist/d3.min.js integrity="sha256-+7jaYCp29O1JusNWHaYtgUn6EhuP0VaFuswhNV06MyI=" crossorigin=anonymous></script><h3>Interactive Graph</h3><div id=graph-container></div><style>:root{--g-node:var(--secondary);--g-node-active:var(--primary);--g-node-inactive:var(--visited);--g-link:var(--outlinegray);--g-link-active:#5a7282}</style><script src=https://ar.falsy.cat/js/graph.6579af7b10c818dbd2ca038702db0224.js></script></div></div><div id=contact_buttons><footer><p>Made by falsycat using <a href=https://github.com/jackyzha0/quartz>Quartz</a>, © 2023</p><ul><li><a href=https://ar.falsy.cat/>Home</a></li><li><a href=https://falsy.cat/>Portfolio</a></li><li><a href=https://falsy.cat/admin>Fediverse</a></li><li><a href=https://github.com/falsycat>GitHub</a></li><li><a href=https://youtube.com/@falsycat>YouTube</a></li></ul></footer></div></div></body></html>