ヘルプ センターのページ レイアウトを編集する

この記事に記載されている高度なカスタマイズ機能は、Jira Service Management の Premium プランと Enterprise プランでのみご利用になれます。

ヘルプ センターのページのレイアウトを編集すると、ヘルプ コンテンツをカスタマーにどのように表示するかを制御できます。現在、すべてのヘルプ センターでホーム ページとランディング ページのレイアウトを編集できます。

ヘルプ センターのページ レイアウトを編集できるのは Jira 管理者だけです。

ヘルプ センターのホーム ページおよび各ランディング ページは、セクションと呼ばれる水平方向のブロックで構成されています。セクションを使用してページをビルドし、コンテンツを追加できます。

ページにリッチ コンテンツを追加する

ページに画像、テキスト、リンク、その他のリッチ コンテンツを追加するには、次の手順を実行します。

  1. ヘルプ センターのホーム ページ、または任意のランディング ページに移動します。

  2. ナビゲーションから [カスタマイズ] を選択し、ドロップダウンから [Edit page layout (ページ レイアウトを編集)] を選択します。

  3. ページのセクションの間にカーソルを置き、[リッチ コンテンツを追加] を選択します。

  4. 開いたエディターで、テキスト、画像、リンク、絵文字、テーブル、その他の要素を追加できます。

  5. コンテンツのカスタマイズが完了したら、[公開] を選択して変更を保存します。

ページに追加できるリッチ コンテンツの種類

エディターから直接、またはスラッシュ コマンドを使用して、リッチ コンテンツをページに追加できます。

レイアウト

レイアウトを使用してコンテンツを列やセクションにまとめると、情報を簡単に構造化して視覚的にわかりやすく提示できます。

エディターには 6 種類の列レイアウトが用意されています。レイアウトを追加するには、エディターからレイアウト アイコンを選択します。既定では、2 列レイアウトがホーム ページに追加されます。オプションは簡単に切り替えることができます。

列のレイアウトを変更しても、コンテンツは失われません。列が右側に追加され、列の少ないレイアウトに変更すると、コンテンツは左に移動します。

テキスト

テキストを追加して通常のテキストとして書式設定することも、最大 6 レベルの見出しを割り当てることもできます。また、斜体、太字、下線、テキストの色や配置などの書式を使用して、テキストを強調することもできます。 

箇条書きリストや番号付きリストも作成できます。

リンクは、コンテンツを通じてユーザーを案内し、関連ページを接続し、外部リソースを参照させるために不可欠です。リンクを追加するには、エディターから [リンク] アイコンを選択するか、/link と入力します。

サイト上のヘルプ センターのページ、ポータル、ヘルプ リソース、または外部 URL にリンクできます。

画像、動画、絵文字

画像、動画、または GIF を追加するには、画像アイコンを選択するか、/image と入力します。画像をコンピューターからエディターに直接ドラッグ アンド ドロップすることもできます。

画像や動画のサイズを変更するには、両側のハンドルをドラッグします。メディアは、マウスをどれだけドラッグしたかに比例して、拡大または縮小します。アップロードした画像や動画を選択すると、フローティング ツールバーが表示されます。このツールバーを使って、画像の位置合わせ、リンクの追加、代替テキストの追加を行うことができます。

画像にリンクを追加すると、画像がクリック可能な要素になり、ユーザーが関連するさまざまなページに移動するのに役立ちます。代替テキストは、スクリーン リーダーのユーザーがコンテンツにアクセスするのに役立ちます。

エディターで絵文字アイコンを選択します。または、/emoji と入力してこの要素をすばやく追加します。 

展開

折りたたみセクションを作成すると、そのセクションの情報を必要としているユーザーにより多くの情報を表示できます。これは、コンテンツを圧縮して全体的なユーザー エクスペリエンスを向上させる効果があるため、特に FAQ や多くの情報を含むセクションを作成するのに役立ちます。展開を追加するには、エディター ツールバーの [+] アイコンを選択して [展開] を選択します。または、/expand と入力してこの要素をすばやく追加します。 

日付

灰色の背景で日付を目立たせます。既定の日付形式は「MM, DD, YYYY」です。日付を追加するには、エディター ツールバーの [+] アイコンを選択し、[日付] を選択するか // と入力して、日付ピッカーを起動します。

区切り線

水平線を使用して、テキストのセクションを分割します。区切り線を追加するには、エディター ツールバーの [+] アイコンを選択して [区切り線] を選択します。または、/divider と入力してこの要素をすばやく追加します。

パネル

情報、メモ、エラー、成功、警告などのアイデアを一貫して伝えるために、プリセットのパネル タイプを選択して情報を強調します。情報パネルを追加するには、エディター ツールバーの情報アイコンを選択します。または、/panel と入力してこの要素をすばやく追加します。 

引用

左の余白に縦線を追加してフォントの色を調整することで、引用を強調します。引用を追加するには、エディター ツールバーの [+] アイコンを選択して [引用] を選択します。または、/quote と入力してこの要素をすばやく追加します。

ステータス

ページ上で目立つようにテキストをハイライトして、その意味に合った背景色を選択します。ステータスを追加するには、エディター ツールバーの [+] アイコンを選択して [ステータス] を選択します。または、/status と入力してこの要素をすばやく追加します。

ページに固有のバナーを追加する

既定では、すべてのページはヘルプ センター用に設定したホーム ページのバナーを継承します。ただし、この設定をオフにして、ホーム ページやランディング ページに固有のページ バナーを追加できます。

ページに固有のバナーを設定するには、以下の手順を実行します。

  1. ヘルプ センターのホーム ページ、または任意のランディング ページに移動します。

  2. 上部のナビゲーションから [カスタマイズ] を選択し、ドロップダウンから [Edit page layout (ページ レイアウトを編集)] を選択します。

  3. バナー セクションを選択します。サイド パネルにカスタマイズのオプションが表示されます。

  4. [Apply help center banner settings (ヘルプ センターのバナー設定を適用)] トグルをオフにします。

  5. バナーの背景色とテキストの色をカスタマイズします。

  6. [公開] を選択して、行った変更を保存します。

ページのセクションを非表示にする/ソートする

ホームページのセクションを非表示にする/並べ替えるには、次の手順を実行します。

  1. ヘルプ センターのホーム ページ、または任意のランディング ページに移動します。

  2. 上部のナビゲーションから [カスタマイズ] を選択し、ドロップダウンから [Edit page layout (ページ レイアウトを編集)] を選択します。

  3. ヘルプ センターの任意のセクションにカーソルを合わせると、右上に [非表示] ボタンが表示されます。

  4. 非表示のセクションを表示するには、そのセクションにカーソルを合わせ、右上の [表示] を選択します。

  5. セクションを並べ替えるには、そのセクションにカーソルを合わせ、希望の位置にドラッグ アンド ドロップします。

  6. [公開] を選択して、行った変更を保存します。

ページのセクションをカスタマイズする

セクションの背景やセクション名のテキストの色をカスタマイズすることで、ページの特定のセクションに注意を引き付けることができます。

ページのセクションをカスタマイズするには、次の手順を実行します。

  1. ヘルプ センターのホーム ページ、または任意のランディング ページに移動します。

  2. 上部のナビゲーションから [カスタマイズ] を選択し、ドロップダウンから [Edit page layout (ページ レイアウトを編集)] を選択します。

  3. カスタマイズするセクションを選択します。サイド パネルにカスタマイズのオプションが表示されます。

  4. セクションの背景については、背景なし、無地の背景、または画像を選択できます。

    1. アップロードできる画像のサイズは最大 10 MB です。

  5. トピック、ポータル、最近使用したリクエスト フォームを含むセクションでは、タイトルのテキストの色を変更することもできます。

ホーム ページで非表示になっているセクションの背景や色を管理することはできません。

 

さらにヘルプが必要ですか?

アトラシアン コミュニティをご利用ください。