テンプレートについてはすでに説明しました。変数を使って日付やタイトルを自動入力し、新しいノートを作成するときにワンクリックでフォーマットを適用する方法です。では、さらに一歩進めてみましょう。
ノートを取るだけでは不十分です。毎日Twitterを閲覧し、WeChatの記事を読み、Redditをスクロールしています。良いものを見つけたとき、どうやって保存しますか？スクリーンショット？画像になってしまい、検索できません。コピー＆ペースト？フォーマットがめちゃくちゃで、タイトルやリンクを手動で追加しなければなりません。ブラウザのブックマークに入れる？それはブックマークの永遠の眠りにつく場所です。入れたものは二度と出てこず、見返すこともありません。
この章ではその問題を解決します。Webコンテンツを素早くきれいにObsidianに保存する方法です。使用するツールはObsidian公式のブラウザ拡張機能、Web Clipperです。
Web Clipperを使う理由
Web Clipperを使う前、私はWeb記事の保存に関しておおよそ3つの段階を経ました。
第一段階：スクリーンショット。ワンクリックでノートに放り込む。問題点：スクリーンショットは検索不可。3ヶ月後には何をキャプチャしたのかさっぱりわからず、見つけることすらできません。
第二段階：コピー＆ペースト。テキストをObsidianにコピーし、タイトルとソースリンクを手動で追加。問題点：フォーマットがほとんど崩れる。見出しが本文になり、太字が消え、コードブロックがプレーンテキストになる。毎回整理に数分かかります。
第三段階：ブックマーク。ブラウザで星をクリックするだけ、最も簡単。代償：そのリンクを二度と開くことはありません。
Web Clipperの考え方：ワンクリック保存、きれいなフォーマット、自動メタデータ、直接Obsidianへ。 タイトル、元のリンク、保存日時がすべて自動入力。コンテンツはMarkdown形式、画像も保持。AIインタープリターを使えば、クリップ中にAIに要約させることもできます。
インストール
Web Clipperはブラウザ拡張機能です。現在、Chrome、Edge、Firefox、Safariに対応しています（一部機能は異なる場合があります）。
重要：WeChat記事はブラウザで開いてから使用してください。WeChatクライアント内では直接使用できません。 WeChatクライアントは独立した環境であり、ブラウザ拡張機能はアクセスできません。リンクをコピーしてChromeやEdgeで開いてからクリップしてください。
インストール手順
ステップ1： ChromeユーザーはChrome Webストアを開き、「Obsidian Web Clipper」を検索し、公式拡張機能（アイコンはObsidianと同じ、宝石模様）を見つけて「Chromeに追加」をクリックします。
ステップ2： Edgeユーザーも同様にEdgeアドオンストアを開き、「Obsidian Web Clipper」を検索してインストールします。EdgeではChrome Webストア版も使用可能です。どちらでも構いません。
ステップ3： インストール後、拡張機能のアイコンが右上のツールバーに表示されます。表示されない場合は、ツールバー右端のパズルピースアイコン（拡張機能）をクリックし、Obsidian Web Clipperを見つけてツールバーにピン留めします。
インストールは以上です。
基本設定
ツールバーの拡張機能アイコンをクリックしてクリップパネルを開きます。右下に小さな歯車アイコンがあります。それが設定の入り口です。設定に入って基本を構成します。
Obsidian Vaultに接続する
設定の最初はVaultに接続することです。「Vaults」セクションで「Add vault」をクリックし、Vault名を入力します。Obsidianの左下に表示されているVault名です。例えば、私のVaultは「Obsidian Vault」なので、それを入力します。
注意：初回接続時、Obsidianが許可ウィンドウをポップアップ表示し、Web Clipperのアクセスを許可するか尋ねます。「許可」を選択してください。これは通常のセキュリティプロンプトです。
デフォルト保存フォルダを設定する
Vaultを接続したら、デフォルトの保存場所（Default location） を設定します。
専用の受信箱フォルダ（例：00-Inbox や Inbox）を作成し、クリップしたコンテンツをそこに保存することをおすすめします。Vaultのルートに直接放り込まないでください。 時間が経つとルートが散らかり、整理済みのノートと未処理のWebアーカイブの区別がつかなくなります。
インターフェース概要
設定後、拡張機能を開くたびに3つの主要エリアが表示されます。
- 上部：プロパティエリア – 現在のページのタイトル、URL、著者（利用可能な場合）を自動認識
- 中央：コンテンツプレビューエリア – 本文がMarkdownに変換されて表示
- 下部：アクションエリア – 保存先のVaultとフォルダを選択し、テンプレートを選んで「Clip」をクリックして保存
AIインタープリター
これはWeb Clipperで最も設定に時間をかける価値のある機能です。
概要
AIインタープリターを使うと、テンプレートに指示を書き、クリップ時に「Add to Obsidian」ボタンをクリックすると、AIが指定されたコンテンツを処理します。例えば、全文要約、キーワード抽出、翻訳など。できることはプロンプトの書き方次第です。
この機能にはAPIキーが必要です。すでにOpenAI、DeepSeek、AnthropicのAPIキーをお持ちの場合はそのまま使用できます。持っていない場合は、各プラットフォームで登録してください。
設定
設定に移動し、「Interpreter」タブを見つけます。
ステップ1： モデルソースを選択し、対応するAPIキーを入力します。OpenAI、Anthropic（Claude）、Ollama（ローカルモデル）などに対応しています。私はDeepSeekを使っています。記事の要約に最適だと感じています。
ステップ2： 「Enable Interpreter」をオンにします。
その後、テンプレートにプロンプト変数を記述すると、クリップ時に拡張機能ウィンドウにインタープリターエリアが表示され、クリックして実行できます。
カスタムテンプレートの作成
Web Clipperにはデフォルトのテンプレートが付属しています。使えなくはないですが、あまり良くありません。数分かけて自分用のテンプレートを作成すれば、クリップのたびにずっと快適になります。
テンプレートをカスタマイズする理由
コンテンツの種類によって必要な情報は異なります。
- 技術記事：タイトル、リンク、AI要約、本文が欲しい
- WeChat記事：タイトル、著者、公開日、AI要約が欲しい
- 商品ページ：タイトル、価格、リンク、全文は不要
1つのテンプレートですべてのシナリオをカバーできません。コンテンツの種類に応じていくつかのテンプレートを作成し、クリップ時に適切なものを選択すると非常に便利です。
テンプレート設定にアクセス
Web Clipperの設定で、左側の「New Template」をクリックして新規作成します。私は面倒なので1つだけ使っています。
テンプレートに名前を付けます（例：「記事収集」）。その後、内容を記述します。
テンプレート変数
Web Clipperは2種類の変数をサポートしています。
ページ変数 – 現在のWebページから自動抽出：
| 変数 | 説明 |
|---|---|
{{title}} |
ページタイトル |
{{url}} |
現在のページのURL |
{{author}} |
記事の著者（認識された場合） |
{{date}} |
今日の日付 |
{{content}} |
本文コンテンツ（Markdown形式） |
インタープリター変数 – プロパティやコンテンツでAIを呼び出す：
インタープリターの構文はシンプルです。AIに与えたい指示を二重引用符で囲み、二重波括弧で包みます。次のようにします。
{{"Summarize the full article without using an H1 heading"}}
内側のテキストがAIへの指示です。外側の {{" "}} 形式は変更しないでください。Web Clipperはこの構文を認識し、クリップ時にAIを呼び出して処理します。
プロパティとコンテンツの両方で使用できます。 プロパティフィールドをAIに自動入力させたい場合は、プロパティ値にこの形式を記述します。コンテンツにAI要約を挿入したい場合も同様に記述します。
完全なテンプレート例
私が使用しているテンプレートは次のとおりです。
テンプレートプロパティ：
URL: {{url}}
Saved: {{date}}
テンプレートコンテンツ：
# Summary
一点、著者の行で {{author|split:", "|wikilink|join}} を使用しており、単純な {{author}} ではありません。これは変数＋フィルターの組み合わせです。まず著者フィールドをカンマで分割し（複数の著者が認識される記事もあります）、各名前をObsidianのウィキリンク形式 [[著者名]] に変換し、最後に結合します。こうすることで、クリップ後に著者名をクリックすると対応するノートにジャンプできます。この方法を使わなくても、{{author}} でプレーンテキストを出力しても問題ありません。好みに応じて選択してください。
コンテンツエリアには、空行を2行だけ残しています。トピックカテゴリ/リンクは手動で関連情報を追加するため、# 要約は見出しのプレースホルダーです。インタープリターを有効にしている場合は、その下に {{"記事全体をH1見出しを使わずに要約してください"}} を追加してAIに自動入力させることができます。有効にしていない場合は、クリップ後に手動で数文を書き込むこともできます。
実践：記事をクリップする
すべての設定が完了したので、実際に使ってみましょう。
気に入ったWeChat記事を見つけて保存したいとします。
ステップ1：リンクをコピーしてブラウザで開く。 WeChat記事内で右上のメニューをタップし、「デフォルトのブラウザで開く」を選択します。
ステップ2：Web Clipperアイコンをクリックする。 右上のツールバーにある宝石アイコンをクリックしてクリップパネルを開きます。
ステップ3：プロパティを確認する。 パネルが自動的に記事のタイトルとURLを認識します。著者フィールドが認識されない場合は手動で入力します。日付は今日の日付なので変更不要です。
ステップ4：テンプレートを選択する。 作成した「記事収集」テンプレートを選択します。AIインタープリターを有効にしている場合は、回転するアニメーションが表示されます。AIが要約を生成しているので、完了するまで待ちます。
ステップ5：「Add to Obsidian」をクリックする。 1秒後、Obsidianを開き、受信箱フォルダに移動すると記事が保存されています。タイトル、リンク、日付、AI要約がすべて揃い、コンテンツはきれいなMarkdownです。
まとめ
今日学んだこと：
- Web ClipperはObsidian公式のブラウザ拡張機能であり、WebページをワンクリックでObsidianノートとして保存でき、フォーマットがきれいでメタデータも自動入力されます。
- WeChat記事はブラウザで開いてからクリップする必要があります。 WeChatクライアント内では使用できません。
- AIインタープリターにはAPIキーが必要です。 設定すれば、クリップ中に自動で要約や情報抽出を行えます。
- カスタムテンプレート＝プロパティ変数＋AIプロンプト。 コンテンツの種類に応じてテンプレートを使い分けると、クリップがより効率的になります。
重要なポイント：
- 専用の受信箱フォルダを作成しましょう。 クリップしたコンテンツをVaultのルートに直接放り込まないでください。
- まずはデフォルトテンプレートでワークフローを動かし、その後でカスタマイズに時間をかけましょう。 テンプレートはいつでも変更できます。まずは使い始めることが大切です。
- AI要約はあくまでオプションであり、必須ではありません。 APIキーがなくても通常通りクリップできます。AI処理のステップがないだけです。