メインコンテンツにスキップ

記事のフォーマット

記事エディターでテキストスタイル、コールアウトブロック、リスト、表、マルチメディアなどを使用します。

対応者:Alek Toumert

Knowledge内の記事エディターから公開および内部記事をフォーマットし、顧客、チームメイト、AIが必要な情報を簡単にスキャン・抽出できるようにします。


テキストをフォーマットする

テキストをハイライトすると、テキストの書式設定オプションが表示されます。見出し、太字、斜体、インラインコード、リンク、またはテキストの配置を追加できます。


別の記事へのリンクを挿入する

別の記事にリンクしたいテキストをハイライトしてください:

リンクアイコンをクリックすると、記事検索ウィンドウが表示されます:

記事のタイトルやカスタムdomainが変更された場合、既存のリンクは自動的にリダイレクトされ、新しいURLに移動します。


エディターツールバー

記事エディターのツールバー

エディター下部のツールバーを使って以下の操作を行います:

画像を挿入する

デバイスから画像やGIFをアップロードするか、記事に直接貼り付けます。対応形式はPNG、JPEG、SVG、GIFです。画像をクリックするとリンク、代替テキスト、配置、テキストとのインライン化、サイズ変更ができます。

他のワークスペースから画像をコピー&ペーストするのは推奨しません。コピー元のワークスペースが非アクティブになると、記事に追加済みの画像も表示されなくなります。

altテキストに説明を入れると、画像が検索エンジンやスクリーンリーダーに対応します。

画像の周りにテキストを回り込ませることもできます。これにより、記事内の好きな場所に画像を配置しやすくなります。

画像やGIFのアップロード時の最大ファイルサイズは104MBです。

画像の最大幅は650ピクセルです。これは記事のテキストカラムの幅に合わせています。

注意:公開後に有効な画像やGIFが表示されない場合は、公開やキャッシュの問題が原因です。

これを修正するには、記事の公開を取り消して再度公開してください。画像がまだ表示されない場合は、ブラウザのハードリフレッシュやキャッシュクリアを試してください。それでも解決しない場合はサポートチームにお問い合わせください。

動画を埋め込む

YouTube、Vimeo、Wistia、Loom、JW Player、Microsoft Stream、Brightcove、Synthesia経由で動画を埋め込めます。また、Supademo、Clueso、Arcade、Supercut、Tella、Storylane経由でデモコンテンツ(モバイル、html、スクリーンショット、ショーケース形式を含む)も埋め込めます。

対応動画:

対応デモ:Supademo、Clueso、Arcade、Supercut、Tella、Storylane。

ツールバーの動画アイコンをクリックし、対応動画ホスティングサイトの動画URLを埋め込みポップアップに直接入力して動画を埋め込みます。

ヒント:記事本文にYouTube Shortsを埋め込むには、次のパターンでURLを挿入します:https://www.youtube.com/shorts/[VIDEO_ID]

表を作成する

ツールバーから表を追加した後、列や行の数を簡単に調整できます。各行や列の端の点にカーソルを合わせると、セルを追加(上、下、左、右)または削除できます。

注意:

  • 表は折りたたみセクションやコールアウト内には追加できません。

  • 表を削除すると、その表内のすべての内容も削除されます。

セルの背景色を変更するには、セルを選択して6つのプリセットカラーから選びます。背景色をリセットするには、セルを選択して白(カラ―リストの最後のオプション)を選びます。

ドラッグハンドルを使って表の列幅を調整します。

区切り線を挿入する

区切り線を追加してコンテンツをセクションに分けます。👇


ボタンを挿入する

ボタンを挿入し、カスタムボタンテキストとターゲットURLを追加します。ボタンをクリックするとテキストやリンクの編集、左寄せや中央寄せの配置ができます。

ボタンを削除するには、まずリンクを入力する必要があります。リンクがないと削除オプションは空のリンクフィールドにデフォルトされ、実際のボタンを削除できません。

リンクを入力すると、ボタンを選択して削除するか、ボタンの後ろにカーソルを置いてキーボードのバックスペースを押して削除できます。

注意:記事はカスタムJavaScriptやonclickハンドラーをサポートしていません。記事に追加されたボタンはスタイル付きリンクとして表示され、クリックしてもJavaScriptは実行されません。Messengerをボタンから開くには、Intercomがインストールされたアプリ内のページにリンクし、そこでJavaScript(例:Intercom('show'))でMessengerを起動してください。

コールアウトを挿入する

コールアウトブロックを追加し、色を選んで記事内の重要な情報を強調します。

コールアウトから抜けて記事本文の執筆を続けるには、コールアウトの外をクリックしてください。

コールアウトを削除するには、内容を削除してからキーボードのバックスペースキーをもう一度押します。

コードを挿入する

コードブロックを追加するには、エディター下部のツールバーを使うか、コードスニペットの前後に3つのバッククォート(```)を入力します。完成したコードブロックは次のようになります。

example code block
example code block

Classic MessengerとAndroid SDKでは、コードブロックは専用のスクロール可能なブロックで構文ハイライトと行番号付きで表示されます。顧客はワンクリックでコードをコピーしたり、全画面表示で長いスニペットを読みやすくできます。

インラインコードを追加するには、コードスニペットの前後にバッククォート(`)を入力します。次のように表示されます:

この行には例のインラインコードが含まれています。

コード挿入機能はコードブロックの表示専用です。このコードはアクティブではないため、要素、スタイル、スクリプト、タグはページに影響しません。

箇条書きまたは番号付きリストを作成する

番号付きリストを始めるには「1.」と入力し、スペースを入れてから入力を続けます。これがリストの最初の行になり、リターンキーで次の番号に進みます。番号付きリストは次のようになります。

  1. 最初の行

  2. 2行目

  3. 3行目

箇条書きを始めるには、ダッシュ(- )またはアスタリスク(*)を入力し、新しい行の先頭にスペースを入れて入力を続けます。記事はこの行を箇条書きの最初の行にします。箇条書きは次のようになります。

  • 最初のポイント

  • 2番目のポイント

  • 3番目のポイント

ネストされたリストは、リスト項目にカーソルを置いてタブキーを押すだけです。ネストされたリストは次のようになります。

  • 第一レベルのポイント

  • 別の第一レベルのポイント

    • ネストされたポイント

      • さらに深いネストされたポイント

リストを終了するにはリターンキーを2回押します。


折りたたみセクションを追加

折りたたみセクションは補助情報を隠し、顧客が関連情報に集中できるようにします。

折りたたみセクションにコンテンツを追加する

コンテンツを追加するには、ツールバーから折りたたみセクションを選択し、折りたたみセクション見出しの末尾でEnterを押して既存の情報を入力または貼り付けます。折りたたみセクション内の内容は少しインデントされ、見出しと揃います。

プロのヒント:折りたたみセクションから抜けるには下矢印キーを2回押します。

2024-05-29 13-50-45.gifのスクリーンキャプチャ

折りたたみセクションに含められるもの:

  • テキスト

  • 画像

  • 動画

  • ボタン

  • 区切り線

  • コールアウトブロック

  • コードブロック

  • リスト

  • ネストされた折りたたみセクション

ファイルを挿入する

デバイスから記事にファイルをアップロードして添付します(PDF、CSV、JPEG、PNG、MP4)。これらは記事の下部に添付ファイルとして表示されます。

ファイル添付の画像

注意:記事のHTMLでは、記事タイトルは<header>タグ(H1ではない)で作成されます。記事タイトルのHTML形式は編集できません。ただし、支援技術のために記事内でタイトル名のH1見出しを使用し、記事内のセクション区切りにはH2またはH3を使用できます。

こちらの回答で解決しましたか?