カラーピッカーやフォントの選択ツールといったシンプルなWYSIWYGのデザインツールを使用して、ヘルプセンターの外観と操作性を変更することができます。たとえば、会社のブランドガイドラインに従って、ヘルプセンターのロゴやカラー、Webフォントを変更できます。ブランド設定オプションは、Guideの設定パネルにあります。
この記事では、以下のトピックについて説明します。
設定パネルのオプションを使ってブランド設定を変更することができますが、それだけでなく、標準のCopenhagenテーマを使っていくつかの共通の要素を簡単に表示または非表示にすることも可能です。「標準のCopenhagenテーマの各種要素の表示/非表示」を参照してください。テーマのコードを直接編集して(Suite Teamでは利用できません)、ヘルプセンターの要素をカスタマイズできます(「テーマとテンプレートを使用したヘルプセンターのカスタマイズ」を参照)。
ヘルプセンターの色を変更する
- ブランドカラー
- ブランドのテキストの色
- テキストの色
- リンクの色
- 背景色
ヘルプセンターの色を変更するには
- Guideで、サイドバーにあるデザインをカスタマイズアイコン()をクリックします。
- 変更したいテーマで「カスタマイズ」をクリックします。「テーマ」ページが開きます。
- 設定パネルで、「色」をクリックします。
- 任意の要素の横にあるカラーボックスをクリックし、カラーセレクタを使用して色を選択するか、カラー番号を手動で入力します。
プレビューウィンドウで、カラーが更新されます。
カラーボックスの外をクリックすると、選択した色が保存されます。
- 色を変更したい他の要素について、上記の手順を繰り返します。
- 色の変更を完了したら、「公開」をクリックします。
変更がテーマに反映されます。
- 「戻る」をクリックして「テーマ」ページに戻ります。
ヘルプセンターのフォントを変更する
デフォルトで、ヘッダーとテキストのフォントをそれぞれ変更できます。組み込みフォントのリストが提供されます。
ヘルプセンターのフォントを変更するには
- Guideで、サイドバーにあるデザインをカスタマイズアイコン()をクリックします。
- 変更したいテーマで「カスタマイズ」をクリックします。「テーマ」ページが開きます。
- 設定パネルで、「フォント」をクリックします。
- ヘッダーのフォントを変更するには、「ヘッダーフォント」の下のドロップダウンメニューをクリックしてヘッダーに別のフォントを選択します。
プレビューウィンドウで、フォントが変更されます。
- テキストのフォントを変更するには、「テキストのフォント」の下のドロップダウンメニューをクリックしてテキストに別のフォントを選択します。
プレビューウィンドウで、フォントが変更されます。
- フォントの変更を完了したら、「公開」をクリックします。
変更がテーマに反映されます。
- 「戻る」をクリックして「テーマ」ページに戻ります。
ヘルプセンターのロゴとファビコンを変更する
ヘルプセンターのロゴとファビコンに変更することができます。ロゴは、ヘルプセンターのヘッダーに表示されます。ファビコンは、ブラウザのタブまたはブラウザのアドレスバーのURLの横に表示される小さい画像です。検索エンジンの中には、検索結果リストのページの横にファビコンを表示するものもあります。
ここで使用する独自の画像やその他のブランドアセットをアップロードする方法については、「ヘルプセンターのテーマに独自のアセットを使用する方法」を参照してください。
ヘルプセンターテーマのロゴとファビコンを変更するには
- Guideで、サイドバーにあるデザインをカスタマイズアイコン()をクリックします。
- 変更したいテーマで「カスタマイズ」をクリックします。「テーマ」ページが開きます。
- 設定パネルの「ブランド」をクリックします。
- ロゴを変更する場合は、「ロゴ」の下で「置換」をクリックして新しいロゴ画像の場所に移動して、画像を選択します。
推奨の画像サイズは200×50ピクセルです。Copenhagenテーマの場合、推奨の高さは最大37ピクセルです。
画像の幅または高さが推奨サイズを超えている場合、縦横比を維持しつつ画像が縮小されます。画像の背景は透明か、ヘッダーの背景色と同じである必要があります。
- ファビコンを変更する場合は、「ファビコン」の下で「置換」をクリックして新しいロゴ画像の場所に移動して、画像を選択します。
最良の結果を得るためには、ファビコンが正方形であることが必要です。画像は、表示サイズに合うように拡大縮小されます。
- ロゴまたはファビコンをデフォルトの画像に戻すには、「元に戻す」をクリックします。
- ロゴまたはファビコンの変更を完了したら、「公開」をクリックします。
変更がテーマに反映されます。
- 「戻る」をクリックして「テーマ」ページに戻ります。
テーマの画像を変更する
標準のCopenhagenテーマには、変更可能な画像が3つあります。
- ホームページのトップイメージ。ホームページの上部に表示されます。
- コミュニティのトップイメージ。コミュニティトピックページの上部に表示されます。
- コミュニティバナー。ホームページのコミュニティセクションに表示されます。
テーマの画像を変更するには
- Guideで、サイドバーにあるデザインをカスタマイズアイコン()をクリックします。
- 設定パネルの「画像」をクリックします。
- 設定パネルのいずれかの画像の下で、「置換」をクリックして、新しい画像の場所に移動して、画像を選択します。
- ホームページの画像とコミュニティの画像については、推奨サイズは1600×300ピクセルです。
読み込みにあまり時間をかけたくない場合は、幅1600ピクセル未満の画像を使用できますが、画像が引き伸ばされないように、少なくとも、300ピクセル以上の高さを確保してください。画像が推奨サイズを超えると、最大高さが300ピクセルになるように、縦横比を一定に保ちながら縮小されます。
- コミュニティ画像については、引き伸ばされないように、高さを300ピクセル未満にする必要があります。
設定パネルに、画像が表示されます。この画像を使いたくない場合は、「元に戻す」をクリックしてデフォルトの画像に戻ります。
- ホームページの画像とコミュニティの画像については、推奨サイズは1600×300ピクセルです。
- ほかの画像を変更する場合、それぞれについて上記の手順を繰り返します。
- 画像の変更を完了したら、「公開」をクリックします。
変更がテーマに反映されます。
- 「戻る」をクリックして「テーマ」ページに戻ります。