リソースセンターをスタイル設定するには、まず作成し、その中にモジュールを含める必要があります。手順については、「リソースセンターを設定する」を参照してください。
この記事では、リソースセンターのホームビューの内容とリソースセンターコンテナのスタイル設定を変更する方法について説明します。個々のモジュールの編集については、「リソースセンターの概要」を参照してください。
1. ビジュアルデザインスタジオでリソースセンターを開きます
リソースセンターはビジュアルデザインスタジオでカスタマイズします。指示に従って、ビジュアルデザインスタジオでリソースセンターを開きます。完了したら、保存してビジュアルデザインスタジオを終了します。ビジュアルデザインスタジオの詳細については、「ビジュアルデザインスタジオを使用する」を参照してください。
- Pendoの左側のメニューで［ガイド（Guides）］>［リソースセンター（Resource Center）］に移動します。
- ［リソースセンター］ページのテーブルから対象のリソースセンターを見つけて開きます。
- リソースセンターの［設定（Settings）］ページの［ドラフト（Draft）］タブから、［自分のアプリで管理（Manage in my app）］を選択します。
-
［コンテンツ（Content）］と［スタイル設定（Styling）］の2つのタブがある［ホームビューを編集（Edit Home View）］ウィンドウが開きます。必要に応じて、リソースセンターのコンテンツとスタイル設定を編集します。
ステップ2. コンテンツを編集する
［ホームビューを編集（Edit Home View）］ウィンドウの［コンテンツ（Content）］タブで、必要に応じて以下を編集します。
- リソースセンターのタイトル。これはリソースセンターの公開名で、訪問者はリソースセンターのホームページの上部で確認できます。この公開名は、［ガイド（Guides）］>［リソースセンター（Resource Center）］で表示されるリソースセンターの内部名とは異なり、Pendoの内部ユーザーにのみ表示されます。
- 閉じるボタン、リソースセンターダイアログボックス（メニュー）、戻るボタン、モジュールタイトルのARIAラベル。
- モジュールのタイトルとサブタイトル。
注：内部名はアプリケーションで公開されるリソースセンターの名前ではありません。内部名を変更するには、［リソースセンター］ページのテーブルから目的のリソースセンターを見つけて開き、リソースセンターの名前にカーソルを合わせて、新しい名前を入力します。
ステップ3. スタイル設定を編集する
［ホームビューを編集］ウィンドウの［スタイル設定（Styling）］タブから、必要に応じて以下を編集します。
コンテナ
［スタイル設定］タブの［コンテナ（Container）］セクションから、以下を編集できます。
- ヘッダーを含む、リソースセンターのすべての画面の背景色。
- リソースセンターの寸法（幅と高さ）。これは、リソースセンターメニューの全体のサイズに適用されます。
- キャレット（›）の色。
- リソースセンターのホームビューの間隔（パディング）。左右のパディングは個別に編集します。
ヘッダー
［スタイル設定］タブの［ヘッダー（Header）］セクションから、以下を編集できます。
- リソースセンターの上部と下部の境界線。
- トグルを使用して、上部と下部の境界線を追加または削除します。
- 上部と下部の境界線の色と太さをそれぞれ選択します。
- リソースセンタータイトルの以下のフォントプロパティ。
- 揃え（左、中央、または右）
- フォントファミリー
- 太さ
- サイズ
- 色（Color）
- テキスト変換（大文字化）
- 文字間隔
- リソースセンターの右上の閉じるボタン。
- トグルを使って閉じるボタンを追加または削除します。
- 閉じるボタンのデフォルトの色とカーソルを合わせた時の色を選択します。
- 閉じるボタンのスペーシング（パディングとマージン）を編集します。上下、左右のパディングとマージンは個別に編集します。
モジュールセクション
［スタイル設定］タブの［モジュール（Module）］セクションから、以下を編集できます。
- リソースセンターのホームビューにあるモジュールのタイトルとサブタイトルの以下のフォントプロパティ。
- フォントファミリー
- 太さ
- サイズ
- 色（Color）
- テキスト変換（大文字化）
- 文字間隔
- リソースセンターのホームビューにあるモジュール間のセクション区切りの色と太さ。
- リソースセンターのホームビューのモジュール間隔（パディング）。上部と下部のパディングは個別に編集します。
アラートバッジ
アラートバッジは、リソースセンターのメインバッジアイコンと重なる円の中の数字で、訪問者への通知がある各モジュールの行の末尾に表示されます。
［スタイル設定］タブの［アラートバッジ（Alert Badge）］セクションから、以下を編集できます。
- アラートバッジの背景色。
- アラートバッジ内の数字の以下のフォントプロパティ。
- フォントファミリー
- 太さ
- 色（Color）
アラートバッジの場所（バッジアイコンの左上、右上、左下、または右下）を変更したい場合は、代わりに「リソースセンターの有効化」を参照してください。