こんにちは、さとりんです。この度はブログにお越しくださりありがとうございます。
このページをご覧いただいているということは、あなたも既にRoam Researchを使い始めているということですね？使い始めたはいいものの、もっとデザインを好きなものに変更して、Roam Researchを楽しみたいと思っているのではないでしょうか？
私としては、Roam Researchのデフォルトテーマは好きなんですが、時々別のテーマで気分転換をしたいと思うことも多々あります。テーマを変えるだけで「新しいツール」を使い始めたような新鮮な感覚が蘇りますよね。
この記事では、Roam Researchを半年以上使い続けてきた私が、Roam Researchの簡単なテーマ変更方法をご紹介します。
- Chrome拡張機能を使ってサクッとテーマ変更する方法
- CSSコードを使って本格的にテーマ変更する方法
ぜひすぐにテーマ変更をしてフレッシュな気持ちでRoam Researchを楽しんでください！
Chrome拡張機能を使ってサクッとテーマ変更する方法
まず最初にChromeブラウザの拡張機能を使ったテーマ変更方法です。最近ではRoam Researchのデスクトップアプリがリリースされていますが、ブラウザベースでRoam Researchをお使いの方は、こちらの方法を使っていただくと本当に簡単にテーマを変更できますので、ぜひ実践してみてください。
roam themes拡張機能
まず最初にChrome拡張機能をダウンロードしてください。Chromeウェブストアに行き、サイドバーにある検索窓に「roam themes」と検索します。すると、「RoamThemes」という拡張機能が表示されますので「追加」してください。
追加されるとChromeのアプリ表示バーに以下のマークが表示されます。
RoamThemes
これで準備完了です。
あとは、このマークをクリックすると以下のようにプリインストールされているテーマを選べば、自動的にテーマを変更することができます。
RoamThemesテーマ選択
元に戻したいときは「Reset（リセット）」をクリックすればデフォルトに戻ります。
以上がChrome拡張機能を使ったテーマ変更方法です。注意点としては、冒頭でも書きましたが、あくまでChromeでRoam Researchを使う場合のみ有効となります。Chromeでテーマ変更してもアプリ側のテーマは変更されませんのでご注意ください。
CSSコードを使って本格的にテーマ変更する方法
次にアプリ版Roam Researchにも使えるテーマ変更方法です。ここは少し技術的な話も入りますが、それほど難しくありませんので安心してついてきてください。
- [[roam/css]]ページを作成する
- “/code”と打ち込み、”Code Block”を選択する
- コード種別を”javascript”から”css”に変更する
- 好きなテーマのコードをコピペする
という順番にやれば誰でもできます。
[[roam/css]]ページを作成する
まず最初にRoam Researchのデータベース内にcssページを作る必要があります。検索バーからroam/cssを選択するか、未作成の場合は、New pageとして作成してください。
“/code”と打ち込み、”Code Block”を選択する
codeblockの入力
roam/cssページを作成したら、コードブロックを作成していきます。”/code”を入力すると画像のようにいくつか選択肢が出てきますので、”Code Block”を選択します。
コード種別を”javascript”から”css”に変更する
cssを選択する
コードブロックが表示されたら、デフォルトでは”Javascript”が表示されているので、これを”css”に変更します。
好きなテーマのコードをコピペする
ここまで完成したらあとは簡単です。
上記のgithubのページから好きなテーマのCSSをコピペして貼り付けるだけです。
まとめ
いかがでしたでしょうか？
Roam Researchはツールとして非常に便利ですが、少し技術的なスキルを覚えれば、幅が広がる非常に可能性を感じるツールです。ぜひcssを使いこなしてテーマを自由に変えるようにしてみてください。
コメント