Notion・Obsidian・FlowUs などへの埋め込み
ウィジェット・動くアイコン・動く背景を Notion に追加する方法と、Obsidian、FlowUs、GitHub、自分の Web サイトでの使い方をまとめました。
使い方は 2 通りです。ウィジェットは Web ページなので「埋め込み」、動くアイコンと動く背景は画像なので「画像リンク」として使います。
ウィジェット:Web ページを埋め込む
エディター右上の「埋め込みリンクをコピー」をクリックしてから、次のように貼り付けます。
| アプリ | 方法 |
|---|---|
| Notion | /embed と入力してリンクを貼り付けます。リンクを貼り付けて「埋め込み」を選んでも OK。四隅をドラッグしてサイズを調整します |
| FlowUs | 埋め込みブロックを追加してリンクを貼り付けます |
| Obsidian | ノートに iframe を書きます:<iframe src="リンク" width="100%" height="300"></iframe>。閲覧モードで表示されます |
| 自分の Web サイト・ブログ | 同じように iframe で埋め込みます |
動くアイコン:ページアイコンに設定
- エディターで「埋め込みリンクをコピー」をクリックします。動くアイコンの場合は画像のリンクがコピーされます。
- Notion でページアイコンをクリックし、リンクからカスタム画像を追加して貼り付けます。
- あとはアイコンが自動で更新されます(例:毎日日付が変わる)。
動く背景:カバー画像に設定
- 同じようにリンクをコピーします。
- Notion で「カバーを変更」→「リンク」に貼り付けて確定します。
GitHub の README や WordPress で使う
動くアイコンと動く背景は、GitHub の README や WordPress でも使えます。エディターの「埋め込みリンクをコピー」の横にある矢印から「Markdown」(GitHub README)または「<img> での使い方」を選んでコピーしてください。
表示されないときは
- Notion で真っ白になる:貼り付けたあと「ブックマーク」ではなく「埋め込み」を選んだか確認し、ページを再読み込みしてください。
- 会社や学校のネットワークで開けない:埋め込みページをブロックするネットワークがあります。別のネットワークでお試しください。
- 設定を変えても反映されない:エディターの変更は自動保存されるので、Notion のページを再読み込みしてください。動くアイコン・動く背景は数分ほどキャッシュされることがあります。
- それでも解決しない場合は、ウィジェットのリンクとスクリーンショットを添えてメールでご連絡ください(アドレスはこのページの下にあります)。