サイトへのブランドとコンポーネントの追加

メモ

日本語で受講されている方へ
このバッジの Trailhead ハンズオン Challenge は英語で受講していただく必要があります。英語の意味についてはかっこ内の翻訳をご参照ください。必ず英語の値をコピーして貼り付けてから、Trailhead Playground の言語を [English] に、ロケールを [United States] に切り替えてください。こちらの指示に従ってください。

翻訳版の Trailhead を活用する方法については、自分の言語の Trailhead バッジをご覧ください。

Category 1 Biking サイトが出来あがりつつあります。このステップでは、カスタムブランド設定を追加し、コンポーネントを更新して、サイトに最後の仕上げをします。まず、ブランド設定をサイトに追加し、ナビゲーションメニューを更新します。

見出しの更新

セレクター をクリックして [Builder (ビルダー)] を選択します。
[Headline (見出し)] コンポーネントをクリックします。
見出しを次のように更新します。
- Title (タイトル): Category 1 Biking
- Banner Text (バナーテキスト): Welcome to the community!
[X] をクリックして、[Headline (見出し)] エディターを閉じます。

テーマの更新

次に、テーマメニューを使用してサイトの色と画像を選択します。この zip ファイルをダウンロードして、このプロジェクトに使用できる画像にアクセスします。必ずファイルを解凍してください。

[Theme (テーマ)] アイコンを選択します。
[Colors (色)] をクリックしてメニューを展開します。
必要に応じて色を調整します。
[Colors (色)] の横にある左向き矢印をクリックして、メニューを折りたたみます。
[Images (画像)] をクリックしてメニューを展開します。
[Header Image (ヘッダー画像)] で画像をアップロードアイコンをクリックします。
[Upload Image (画像をアップロード)] をクリックして、先にダウンロードしたフォルダーから header.jpg を選択します。
[X] をクリックし、テーマエディターを閉じます。

画面上部の灰色のバーをクリックすると、[Navigation Menu (ナビゲーションメニュー)] コンポーネントが表示されます。
右側のメニューの [Edit Navigation Menu (ナビゲーションメニューを編集)] をクリックします。
[+ Add Menu (+ メニュー項目を追加)] をクリックします。
次の詳細を入力します。
- [Name (名前)] を Cases (ケース) に更新します。
- Type (種別): Salesforce Object (Salesforce オブジェクト)
- Object Type (オブジェクト種別): Case (ケース)
- Default List View (デフォルトのリストビュー): My Open Cases (私のオープンケース)
[Save Menu (メニューを保存)] をクリックします。
[X] をクリックして、[Navigation Menu (ナビゲーションメニュー)] を閉じます。

チャット Snap-in と記事コンポーネントの追加

[Components (コンポーネント)] アイコンを選択します。
コンポーネント検索バーに Embedded Service Chat (組み込みサービスチャット) と入力します。
[Embedded Service Chat (組み込みサービスチャット)] を選択し、[Ask a Question (質問する)] コンポーネントの右側のサイドバーにドラッグします。
[Can’t Access Resources (リソースにアクセスできません)] ポップアップウィンドウが表示されます。[Content Security Policy (コンテンツセキュリティポリシー)] は後で調整します。[OK] をクリックします。
ポップアップが表示されない場合はブラウザーを確認してください。Mozilla Firefox を使用している場合は、Google Chrome に切り替えてみてください。
[X] をクリックして、[Embedded Service Chat (組み込みサービスチャット)] ダイアログボックスを閉じます。
コンポーネントアイコンをクリックして、もう一度メニューを開きます。
コンポーネント検索バーに「Trending Articles by Topic 」 (トピック別トレンド記事) と入力します。
[Trending Articles by Topic (トピック別トレンド記事)] を選択し、[Embedded Service Chat (組み込みサービスチャット)] コンポーネントの下のサイドバーにドラッグします。
[X] をクリックして、[Trending Articles by Topic (トピック別トレンド記事)] エディターを閉じます。

コンテンツセキュリティポリシーの調整

コンテンツセキュリティポリシー (CSP) は、ページに読み込み可能なコンテンツのソースを管理するための Web ルールを定義する Web 標準です。CSP ルールはすべてページレベルで機能し、すべてのコンポーネントとライブラリに適用されます。このサイトで Chat Agent の実行が許可されるように CSP を調整します。

[Settings(設定)] アイコンを選択します。
[Security & Privacy (セキュリティとプライバシー)] を選択します。
[Strict CSP (厳格な CSP)] ドロップダウンをクリックし、[Relaxed CSP: Access to Inline Scripts and Allowed Hosts (緩和された CSP: インラインスクリプトと許可されたホストへのアクセスを許可)] を選択します。
[Allow (許可)] をクリックします。
[Can’t Access Resources (リソースにアクセスできません)] ポップアップウィンドウが再び表示されます。リストされた URL の https から .com までをコピーします。この URL を [Trusted Sites for Scripts (スクリプト用の信頼済みサイト)] に追加します。
URL をコピーした後に [OK] をクリックします。
[+Add Trusted Site (信頼済みサイトを追加)] をクリックします。
[URL] テキストボックスにコピーした URL を貼り付けます。
[Name (名前)] テキストボックスに Chat (チャット) と入力します。
[Active (有効) ] がオンになっていることを確認します。
[Add Site (サイトを追加)] をクリックします。
[X] をクリックして、[Settings (設定)] ウィンドウを閉じます。

サイトの公開

[Publish (公開)] をクリックします。
[Publish Your Site (サイトを公開します)] 確認画面で [Publish (公開)]、[Got It (了解)] の順にクリックします。

サイトが公開されると、確認メールで通知されます。メールのリンクをクリックしてサイトが稼働していることを確認します。