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

記事のフォーマット

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

対応者: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、Zight、Zoom Clipsから動画を埋め込めます。また、Supademo、Clueso、Arcade、Supercut、Tella、Storylane、Navatticを使ってデモコンテンツ(モバイル、html、スクリーンショット、ショーケース形式を含む)も埋め込めます。

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

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

注意:Zoomの埋め込みはZoom Clipsのみ対応で、自社のZoomアドレス上のClipsも含みます。クリップ所有者はZoomの埋め込み許可設定をオンにする必要があります。Navattic、Zight、Zoom Clipsの埋め込みはHelp CenterとMessenger内の記事で再生されます。チャット、投稿、ニュース、チェックリストではリンクは受け付けますが動画は再生されません。

表を作成する

カスタマイズ可能な表を作成します。初期設定は3x3で、記事エディターから列数や行数を簡単に調整できます。

列を追加または削除する

列を追加するには、任意の列の上部の点にカーソルを合わせて列メニューを表示します。そこから以下が可能です:

  • 左に列を追加する

  • 右に列を追加する

  • 列を削除する

行を追加または削除する

行を追加するには、任意の行の左の点にカーソルを合わせて行メニューを表示します。そこから以下が可能です:

  • 上に行を追加する

  • 下に行を追加する

  • 行を削除する

注意:

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

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

セルの背景色を変更するには、セルを選択して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回押します。


​

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

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

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

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

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

Screen Capture on 2024-05-29 at 13-50-45.gif

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

  • テキスト

  • 画像

  • 動画

  • ボタン

  • 区切り線

  • コールアウトブロック

  • コードブロック

  • リスト

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

ファイルを挿入する

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

ファイル添付の画像

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

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