Notionを使って記事の書式を整えましょう

Notionで記事の書式設定に使用できるブロックをご紹介します。サポートされているブロックとサポートされていないブロックをご確認ください。

2 分で読めます

Notiondesk で記事を効果的にフォーマットして、読者の読みやすさを向上させましょう。Notion ブロックを使用すると、コンテンツを簡単に構造化できます。サポートされているブロックと、それらを最適に活用する方法をご覧ください。

サポートされているブロック

視覚的に魅力的で分かりやすいヘルプ記事を作成するのに役立つ、さまざまなNotionブロックをサポートしています。以下に、サポートされているブロックとその活用方法を説明します。

基本ブロック

文章

Notiondeskを使用すると、あらゆる種類のテキストスタイルがサポートされます。たとえば、テキストを太字にしたり、単語を斜体にしたり、特定のフレーズに取り消し線を引いたりできます。基本的な text ブロックは、HTML の <p> タグに似ていると考えることができます。テキストの力は、視覚的な魅力を維持しながら情報を伝える能力にあります。

見出し

見出しはコンテンツをセクションごとに分けるのに役立ち、理解しやすく、読みやすくします。

H1見出し

これは最も大きな見出しであり、セクションタイトルに最適です。

H2見出し

小見出しは、小項目を示す場合や、トピックを細分化する場合などによく使用されます。

H3見出し

コンテンツをさらに細分化して、より具体的な分野に分けます。

画像

Notionページに画像をアップロードすると、ヘルプセンターにも反映されます。

Notionで記事を書こう！

引用

要点を強調したい、またはフィードバックを伝えたいですか？引用ブロックを使用してください。重要な情報を強調するのに最適です。

「記事内での引用文は、このように表示されます。」

トグル

トグルボタンは、よくある質問（FAQ）や、読者に情報過多にならない程度に補足情報を提供したいセクションに最適です。読者はトグルボタンをクリックすることで、その中のコンテンツを表示できます。

トグルの中身は？

トグルが開いている場合、ここに非表示コンテンツが表示されます。

叫ぶ

コールアウトを使って読者の注意を引きつけましょう。他のコンテンツから際立つため、重要なメモやヒントを伝えるのに最適です。

これは目立つ表現です。目立ちますよね？

区切り線

記事内の異なるセクションやトピックは、区切り線を使って区切ってください。そうすることで、コンテンツが整理され、読みやすくなります。

👆 これは区切り線です

リストブロック

リストは、手順、機能、重要なポイントなどを書き留めるなど、情報を整理するのに非常に役立ちます。

箇条書き

連続しないアイテムに最適です。

  • ポイントA
  • ポイントB
  • ポイントC

番号付きリスト

順序立てた情報や手順を示すのに最適です。

  1. ステップ1
  1. ステップ２
  1. ステップ３

高度なブロック

目次

Notionで目次ブロックを追加すると、記事内のすべての見出しへのリンクが自動的に作成されるため、読者は特定のセクションに簡単に移動できます。

この記事の目次はこちらです😉

  1. サポートされているブロック
  2. 基本ブロック
    1. 文章
    2. 見出し
  3. H1見出し
    1. H2見出し
      1. H3見出し
      2. 画像
      3. 引用
      4. トグル
      5. 叫ぶ
      6. 区切り線
    2. リストブロック
    3. 高度なブロック
      1. 目次
      2. ブックマーク
      3. 外部リンク
      4. 内部リンク
      5. チェックリスト
      6. 画像ギャラリー
      7. ビデオ
      8. オーディオ
      9. ファイルダウンロード
      10. インタラクティブなHTML
      11. PDF埋め込み
      12. タブ
      13. 列レイアウト
      14. テーブル
      15. 同期されたブロック
      16. コードブロック
      17. 数学の方程式
    4. サポートされていないブロック

ブックマーク

記事にブックマークを直接埋め込むことで、外部リソースやその他の重要なページにワンクリックでアクセスできるようになります。

Notiondesk - Notion でヘルプセンターを構築

Notion ドキュメントを強力なナレッジベースに変換します。カスタマイズ、SEO の最適化、多言語対応、顧客サポートの改善を数分で実現できます。

Notiondesk - Notionでヘルプセンターを作成する
https://notiondesk.so/
Notiondesk - Notionでヘルプセンターを作成する

外部リンク

読者を他のウェブサイトやオンラインリソースに誘導しましょう。それらを新しいタブで開くように設定すれば、記事を開いたままにして参照することができます。

外部リンクの例

内部リンク

ヘルプセンター内の他の記事へのリンクを掲載することで、ユーザーを誘導し、ナビゲーションを改善できます。

内部リンクを追加する方法

チェックリスト

手順書やToDoリストに最適です。

画像ギャラリー

複数の画像を構造化されたグリッド形式で表示します。商品画像、チュートリアル手順、その他あらゆる視覚的なシーケンスに最適です。

画像1

画像2

画像3

画像4

ビデオ

動画をアップロードしたり、YouTube、Loom、Vimeoから直接動画を埋め込んだりすることで、記事にマルチメディアコンテンツを追加して内容を充実させましょう。

YouTube - リック・アストリー（ネヴァー・ゴナ・ギヴ・ユー・アップ）

アップロードされた動画 - Notiondesk 統合

オーディオ

オーディオブロックは、さまざまなオーディオコンテンツを埋め込み、ファイルアップロードやSpotify、YouTubeなどの外部ソースを使用して記事を充実させます。

音声ファイル

これは音声ファイルのキャプションです

Spotify

YouTube

ファイルダウンロード

記事にリソース、テンプレート、または追加の参考資料を直接添付できます。これらは以下のように添付ファイルとして表示されます。

インタラクティブなHTML

HTMLモジュールを使用すると、インタラクティブな例を追加できます。ユーザーは記事内でモジュールを使用したり、より大きなモーダルウィンドウで開いたりできます。

PDF埋め込み

記事コンテンツにPDFファイルを追加すると、ユーザーはヘルプセンター内でPDFファイルを閲覧できます。ユーザーはドキュメントのプレビューをスクロールしたり、拡大表示したり、元のファイルをダウンロードしたりできます。

communication-plan.pdf 5.1 kB PDFを開く

タブ

タブを使用すると、ユーザーはページを離れることなく、関連する手順を切り替えることができます。

プラン

コミュニケーションを計画する

各アップデートの配信対象者、配信タイミング、配信チャネルを選択してください。

共有

最新情報を共有する

適切なチャネルにメッセージを投稿し、後で簡単に見つけられるようにしてください（ピン留め、リンク、またはハブへの追加など）。

レビュー

何がうまくいったかを振り返る

チームメンバーが抱える疑問点を確認し、次回のアップデートを改善しましょう。

列レイアウト

コンテンツを複数列形式で整理しましょう。これは、情報を並べて比較したり、情報を並行して表示したりする場合特に便利です。

1列目

これは

1つ

2列目

二

テーブル

表はデータを整理し、分かりやすく提示するのに役立ちます。また、さまざまな書式設定オプションと組み合わせることで、より見やすくすることも可能です。

要素説明例
大胆な強調のために太字にしていますこれは大胆だ
斜体ニュアンスを表現するために斜めのテキストを使用これはイタリック体です
取り消し線取り消し線が引かれたテキストこれは打たれた
Codeコード用の等幅フォントThis is code
リンクハイパーリンクされたテキストここをクリック
色付きテキスト特定の色のテキストこれはオレンジ色です

同期されたブロック

複数のページ間でコンテンツを同期することで、一貫性を確保できます。1箇所で更新すれば、その変更はブロックが埋め込まれているすべての場所に反映されます。

同期ブロック

このコンテンツは別のページと同期されています。

コードブロック

コードスニペットや技術コマンドは、明確な形式で提示してください。これは、開発者や技術ガイドにとって特に役立ちます。

JavaScriptの例：

Markdownの例：

数学の方程式

これにより、数式を記事にシームレスに組み込むことができ、チュートリアル、技術文書、または数学的な精度が求められるあらゆるコンテンツに最適です。

ブロック方程式の例：

\int_0^\infty e^{-x^2} \, dx = \frac{\sqrt{\pi}}{2}

インライン数式の例：

円の面積の公式はC = πr² です。

サポートされていないブロック

Notiondesk は包括的なドキュメント作成を容易にするために多数の Notion ブロックをサポートしていますが、現在サポートされていないブロックがいくつかあります。以下にそのリストを示します。

function sayHello() {
    console.log("Hello, world!");
}

# Table of Contents
* [Introduction](#introduction)
* [Features](#features)
* [Installation](#installation)

## Introduction
Welcome to Notiondesk's documentation.

> Note: This is a markdown example.

## Features
- Dynamic updating
- Rich formatting support

## Installation
Follow our [guide](https://notiondesk.so) to get started.

  • 埋め込み機能（Twitter、Googleドライブ、Airtable、Googleマップ）

必要なブロックがサポートされていない場合は、ご連絡ください。Notiondesk は継続的にアップデートしており、皆様からのフィードバックをお待ちしております。

<!doctype html><html lang=\"en\"><meta charset=\"utf-8\"><style>body{font:16px system-ui;padding:24px;color:#172033}h2{margin-top:0}label{display:block;margin:20px 0 6px}input,button{font:inherit;padding:10px;max-width:100%;box-sizing:border-box}button{display:block;margin-top:20px;background:#182b55;color:white;border:0;border-radius:6px}output{display:block;margin-top:20px;font-weight:600}</style><h2>コミュニケーションカレンダー</h2><p>チームのコミュニケーションリズムを計画しましょう。</p><label for=\"weeks\">計画する週数</label><input id=\"weeks\" type=\"number\" value=\"4\" min=\"1\" max=\"52\"><label for=\"messages\">1週間あたりのメッセージ数</label><input id=\"messages\" type=\"number\" value=\"2\" min=\"1\" max=\"20\"><button id=\"calculate\">計算</button><output id=\"result\" aria-live=\"polite\"></output><script>document.getElementById('calculate').onclick=function(){document.getElementById('result').textContent=Number(document.getElementById('weeks').value)*Number(document.getElementById('messages').value)+' メッセージ予定数'}</script></html>

関連する記事

このページは役に立ちましたか？