コードを使用したケースフィードのカスタマイズ
jケースフィードとやりとりするカスタムコンソールコンポーネントの作成
| 使用可能なエディション: Salesforce Classic |
| 使用可能なエディション: Enterprise Edition、Performance Edition、Unlimited Edition、および Developer Edition |
カスタムコンソールコンポーネントを使用すると、Salesforce コンソールの機能を拡張でき、ケースフィードパブリッシャーに追加したアクションとやりとりするコンポーネントを作成できます。たとえば、事前に作成されたカスタマイズ済みのテキストを生成するコンポーネントを開発し、そのテキストをケースフィードのポータルアクションで新しい投稿に追加し、投稿をポータルに送信する操作を、ワンクリックですべて行うことができます。
これらのイベントは、パブリッシャー JavaScript API で Sfdc.canvas.publisher オブジェクトの publish メソッドを使用して公開できるため、コンソールコンポーネントがケースフィードのクイックアクションとやりとりできるようになります。
publisher.selectAction
コードサンプル
次のコードスニペットは、メールアクションを選択し、そこにフォーカスを移動します。
Sfdc.canvas.publisher.publish({name:"publisher.selectAction",payload:{actionName:"Case.Email"}});
publisher.setActionInputValues
コードサンプル
次のコードスニペットは、メールメッセージの項目に定義済みの値を入力し、関連ケースの状況を [Closed (クローズ)] に設定します。
1Sfdc.canvas.publisher.publish({name:"publisher.setActionInputValues",
2 payload:{actionName:"Case.Email",parentFields: {Status:{value:"Closed"}},
3 emailFields: {to:{value:"customer@company.com"},cc:{value:"customer2@company.com"},
4 bcc:{value:"supervisor@company.com"},
5subject:{value:"Your Issue Has Been Resolved"},
6 body:{value:"Thank you for working with our support department.
7 We've resolved your issue and have closed this ticket, but
8 please feel free to contact us at any time if you encounter this
9 problem again or need other assistance."}}}});このコードスニペットによって、投稿アクションの本文の現在のカーソル位置に語句「Hello World」が挿入されます。
1Sfdc.canvas.publisher.publish({name:"publisher.setActionInputValues", payload:{actionName:"FeedItem.TextPost", targetFields:{body:{value:"Hello World", insertType:"cursor"}}}});invokeAction
コードサンプル
次のコードスニペットは、メールアクションで送信機能をトリガし、メールメッセージの送信と関連フィード項目の生成を行います。
Sfdc.canvas.publisher.publish({name:"publisher.invokeAction",payload:{actionName:"Case.Email"}});
customActionMessage
| 説明 | ペイロードの値 | 使用可能なバージョン |
|---|---|---|
| カスタムイベントをカスタムアクションに渡します。Visualforce ベースのカスタムアクションでのみサポートされます。 |
actionName — イベントを渡す先となる Visualforce カスタムアクション。 message – カスタムアクションに渡すイベント。 |
API バージョン 29.0 以降で使用できます。 |
コードサンプル
次のコードスニペットは、Hello world イベントをアクション my_custom_action に渡します。
Sfdc.canvas.publisher.publish({name:"publisher.customActionMessage", payload:{actionName:"my_custom_action", message:"Hello world"}});次のコードスニペットは、my_custom_action で Hello world イベントをリスンするために使用されます。
Sfdc.canvas.publisher.subscribe([{name : "publisher.customActionMessage", onData : function(e) {alert(e.message);}}]);使用事例
Universal Cable では、全米で数 100 万人もの電話/ケーブル顧客にサービスを提供し、さまざまな規模のコールセンターに 4000 人のサポートエージェントを有しています。Universal では、Salesforce ナレッジに含まれる会社の大量の記事にエージェントが簡単にアクセスでき、サポートコストを抑えるためにメールを通して顧客と記事を共有したいと考えています。
- 最近公開されたものから順に、ナレッジ記事のリストを表示する。
- エージェントは、タイトルをクリックして記事を参照できる。
- エージェントは、コンソールコンポーネントで [メール] ボタンをクリックすることで、記事の完全な書式設定済みテキストをケースフィードのメールアクションでメッセージに追加できる。
コードサンプル
次のコードスニペットは、以下の Visualforce ページで使用されるカスタムコントローラを含む Apex クラスを示します。
1public with sharing class KBController {
2 public List<FAQ__kav> articles {get; set;}
3
4 public KBController() {
5 articles = [select knowledgearticleid, id, title, content__c from FAQ__kav where
6 publishstatus = 'Online' and language='en_US' order by lastpublisheddate];
7 }
8}次のコードサンプルは、上記の使用事例でカスタムコンソールコンポーネントとして使用される Visualforce ページを示します。
1<apex:page sidebar="false" controller="KBController">
2 <script type='text/javascript' src='/canvas/sdk/js/publisher.js'/>
3 <style>
4 .sampleTitle { background-color: #99A3AC;color:#FFFFFF;font-size:1.1em;
5 font-weight: bold;padding:3px 6px 3px 6px; }
6 .sampleHeader { }
7 .sampleArticleList { min-width: 250px; padding: 8px 0 5px 0;}
8 .sampleUl { padding: 0; margin: 0; list-style: none;}
9 .sampleLi { display: block; position: relative; margin: 0;}
10 .sampleRow { min-height: 16px; padding: 4px 10px;}
11 .emailBtn { margin: 1px 1px 1px 3px; padding: 3px 8px; color: #333;
12 border: 1px solid #b5b5b5; border-bottom-color: #7f7f7f; background: #e8e8e9;
13 font-weight: bold; font-size: .9em; -moz-border-radius: 3px;
14 -webkit-border-radius: 3px; order-radius: 3px; }
15 .emailBtn:active { background-position: right -60px; border-color: #585858;
16 border-bottom-color: #939393; }
17 .sampleArticle { padding-left: 4px; padding-bottom: 2px; font-weight: bold;
18 font-size: 1em; color: #222; }
19 .sampleLink { color: #015ba7; text-decoration: none; font-weight: bold;
20 font-size: .9em; }
21 </style>
22 <script>
23 function emailArticle(content) {
24 Sfdc.canvas.publisher.publish({name: 'publisher.selectAction',
25 payload: { actionName: 'Case.Email'}});
26 Sfdc.canvas.publisher.publish({name: 'publisher.setActionInputValues',
27 payload: {
28 actionName: 'Case.Email',
29 emailFields: { body: { value:content, format:'richtext', insert: true}}
30 }});
31 }
32 </script>
33 <div style="margin-left:-10px;margin-right:-10px;">
34 <div class="sampleTitle">Latest Articles</div>
35 <div class="sampleHeader" style=""></div>
36 <div class="sampleArticleList">
37 <apex:repeat value="{!articles}" var="article">
38 <ul class="sampleUl">
39 <li class="sampleLi">
40 <div class="sampleRow">
41 <div style="display:none;" id="content_{!article.id}">
42 <apex:outputText value="{!article.content__c}" escape="false"/>
43 </div>
44 <input type="button" title="Email" value="Email" class="emailBtn"
45 onclick="emailArticle(document.getElementById
46 ('content_{!article.id}').innerHTML);"/>
47 <span class="sampleArticle">
48 <a href="/{!article.knowledgearticleid}"
49 title="{!article.title}" class="sampleLink">
50 {!article.title}</a>
51 </span>
52 </div>
53 </li>
54 </ul>
55 </apex:repeat>
56 </div>
57 </div>
58</apex:page>