サイトへのブランドとコンポーネントの追加
メモ
日本語で受講されている方へ
Challenge は日本語の Trailhead Playground で開始し、かっこ内の翻訳を参照しながら進めていってください。Challenge での評価は英語データを対象に行われるため、英語の値のみをコピーして貼り付けるようにしてください。日本語の組織で Challenge が不合格だった場合は、(1) この手順に従って [Locale (地域)] を [United States (米国)] に切り替え、(2) [Language (言語)] を [English (英語)] に切り替えてから、(3) [Check Challenge (Challenge を確認)] ボタンをクリックしてみることをお勧めします。
翻訳版 Trailhead を活用する方法の詳細は、自分の言語の Trailhead バッジを参照してください。
Category 1 Biking サイトは完成に近づいていますが、まだいくつかカスタマイズが必要です。
見出しの更新
- Category 1 Biking サイトを [Builder (ビルダー)] で開いた状態で、<<strong>>[Headline (見出し)]</<strong>> コンポーネントをクリックします。
<img alt="Headline component" class="image" src="images/kix.y4lwsl2111zs.png" width="672.0"/>
- 右側のメニューで見出しを以下のように更新します。
- Title (タイトル): <<code>>Category 1 Biking</<code>>
- Banner Text (バナーテキスト): <<code>>Welcome to the community!</<code>>
- <<strong>>[X]</<strong>> をクリックして、[Headline (見出し)] エディターを閉じます。
テーマの更新
[Theme (テーマ)] メニューでは、サイトの色や画像を調整できます。以前にダウンロードした <<a href="https://developer.salesforce.com/files/categorybiking.zip" rel="noreferrer noopener" target="_blank">>zip ファイル</<a href="https://developer.salesforce.com/files/categorybiking.zip" rel="noreferrer noopener" target="_blank">>の画像を再利用します。必ずファイルを解凍してください。
- <<strong>>[Theme (テーマ)]</<strong>> アイコンをクリックします。
<img alt="Theme icon." class="image" src="images/kix.16vpa1oni14u.png" width="129.0"/>
- <<strong>>[Colors (色)]</<strong>> をクリックしてメニューを展開します。
- 必要に応じて色を調整します。
- [Colors (色)] の横にある左向き矢印をクリックして、メニューを折りたたみます。
- <<strong>>[Images (画像)]</<strong>> をクリックしてメニューを展開します。
- [Header Image (ヘッダー画像)] で<<strong>>[画像をアップロード] アイコン</<strong>>をクリックします。
- <<strong>>[Upload Image (画像をアップロード)]</<strong>> をクリックして、先にダウンロードしたフォルダーから <<strong>>header.jpg</<strong>> を選択します。
- <<strong>>[X]</<strong>> をクリックし、テーマエディターを閉じます。
ナビゲーションメニューの更新
- 画面上部の<<strong>>灰色のバー</<strong>>をクリックすると、[Navigation Menu (ナビゲーションメニュー)] コンポーネントが表示されます。
<img alt="Navigation Menu component." class="image" src="images/kix.ys4oi1zbea7w.png" width="672.0"/>
- 右側のメニューの <<strong>>[Edit Navigation Menu (ナビゲーションメニューを編集)] </<strong>> をクリックします。
- <<strong>>[+ Add Menu (+ メニュー項目を追加)]</<strong>><<strong>></<strong>> をクリックします。
- 次の詳細を入力します。
- Name (名前): <<code>>Cases</<code>> (ケース)
- Type (種別): <<strong>>Salesforce Object</<strong>> (Salesforce オブジェクト)
- Object Type (オブジェクト種別): <<strong>>Case</<strong>> (ケース)
- Default List View (デフォルトのリストビュー): <<strong>>My Open Cases</<strong>> (私のオープンケース)
- <<strong>>[Save Menu (メニューを保存)]</<strong>> をクリックします。
- <<strong>>[X]</<strong>> をクリックして、[Navigation Menu (ナビゲーションメニュー)] を閉じます。
サイトの公開
- <<strong>>[Publish (公開)]</<strong>> をクリックします。
- [Publish Your Site (サイトを公開します)] 確認画面で <<strong>>[Publish (公開)]</<strong>>、<<strong>>[Got It (了解)]</<strong>> の順にクリックします。
サイトが公開されると、確認メールが届きます。メールのリンクをクリックしてサイトが稼働していることを確認します。
新規サイトの試行
新しいサイトを試してみましょう。確認メール内のリンクをクリックし、公開されたサイトを表示して試しましょう。メールが届かなかった場合は、[Digital Experiences] > [All Sites] > [Category 1 Biking] にある URL をクリックしてください。
チャットを開始する
- <<strong>>[Builder (ビルダー)]</<strong>> アイコン <img alt="" class="image" src="images/kix.bv625q4udndo.png" width="24.0"/> をクリックし、<<strong>>[Salesforce Setup (Salesforce 設定)]</<strong>> を選択します。
- <<strong>>アプリケーションランチャー</<strong>> <img alt="App Launcher" class="image" src="images/kix.d03w6vx52i6d.png" width="24.0"/> をクリックし、<<strong>>[Service Console (サービスコンソール)]</<strong>> を検索して選択します。
- サイドバーの <<strong>>[Omni-Channel (オムニチャネル)]</<strong>> (開いた円)をクリックします。
<img alt="Omni-Channel side bar in the Service Console." class="image" src="images/kix.jueuc3zf5qem.png" width="61.5"/>
- [Offline (オフライン)] の横にあるドロップダウンをクリックして、<<strong>>[Available Messaging (対応可能メッセージング)]</<strong>> を選択します。
- <<strong>>設定</<strong>><<strong>>歯車</<strong>> <img alt="Setup icon" class="image" src="images/kix.3ronegrpo7xi.png" width="24.52083333333343"/> をクリックして、<<strong>>[Setup (設定)]</<strong>> を選択します。(メモ: これにより新しいタブが開きます。後でサービスコンソールに戻りますので、[Service Console (サービスコンソール)] タブは開いたままにしておいてください。)
- [Setup (設定)] の [Quick Find (クイック検索)] で <<strong>>[All Sites (すべてのサイト)]</<strong>> を入力して選択します。
- [Category 1 Biking] の横にある URL リンクをクリックしてサイトを開きます。
実際に試してみる
- ページ右下の <<strong>>[Chat (チャット)]</<strong>> <img alt="" class="image" src="images/kix.wdcto95fihv6.png" width="24.0"/> ボタンをクリックします<<strong>>。</<strong>>
- サービスコンソールに戻ります。
- <<strong>>チェックマーク</<strong>>をクリックしてチャットを受け入れます。
<img alt="Accept an incoming chat via Omni-Channel." class="image" src="images/kix.na0y1kl3qx5f.png" width="403.5818014705883"/>
- <<strong>>[Messaging (メッセージング)] ブラウザータブ</<strong>>をクリックします。サイト側から挨拶を入力し、サービスコンソールに切り替えてコンソール側で確認します。
- チャットセッションが開始されました。エージェント側、続いてサイト側からチャットしてみます。サイト側のチャットウィンドウ左上の三点アイコンをクリックし、終了時には <<strong>>[End Conversation (会話を終了)]</<strong>> をクリックします。
質問する
- サイトから <<strong>>[Ask a Question (質問する)]</<strong>> をクリックします。
- [Post To (投稿先)] ドロップダウンから <<strong>>[New Products (新商品)]</<strong>> を選択します。
- [Question (質問)] セクションに、新商品に関する質問を入力します。たとえば、「<<code>>When will this year’s new bike be available to buy?</<code>>」(今年の新型自転車はいつから購入できますか?) などです。
- <<strong>>[Ask (質問する)]</<strong>> をクリックします。
次に、質問がどのように表示されるかを確認します。
- サイトで、ナビゲーションメニューの [Topics (トピック)] ドロップダウンから <<strong>>[New Products (新商品)]</<strong>> をクリックします。
- 新しい質問が一覧に表示されます。
- <<strong>>[Articles (記事)]</<strong>> をクリックして、関連するナレッジ記事を確認します。
- 記事をクリックして開きます。記事に高評価を与えます。
ケースを作成する
- サイトで <<strong>>[Home (ホーム)]</<strong>> をクリックします。
- ページ下部にある <<strong>>[Contact Support (カスタマーサポートへの連絡)]</<strong>> をクリックします。
- [Contact Name (取引先責任者名)] のテキストボックスをクリックし、<<strong>>[+</<strong>><<strong>> New Contact (新規取引先責任者)]</<strong>> を選択します。
- 自分自身を取引先責任者として作成します。
- [First Name (名)] と [Last Name (姓)] 項目に任意の情報を入力します。
- [Account Name (取引先名)] に <<strong>>Pyramid Construction Inc.</<strong>> と入力して選択します。
- <<strong>>[Save (保存)]</<strong>> をクリックします。
- 件名と説明を自由に入力します。
- <<strong>>[Submit (実行)]</<strong>> をクリックします。
- 次に、サイトのナビゲーションメニューで <<strong>>[Cases (ケース)]</<strong>> をクリックします。
- リストビューが <<strong>>[My Open Cases (私のオープンケース)]</<strong>> に設定されていることを確認し、先ほど送信したケースが追加されていることを確認します。
この新しいサイトは、トピック別に整理されたナレッジ記事、チャットボタン、質問するためのボタンなどを備え、ブランド設定がカスタマイズされています。Category 1 Biking のファンが、まったく新しい方法で同社やほかの顧客とエンゲージできるようになりました。
お疲れさまでした。またトレイルでお会いしましょう!