コードを使用したケースフィードのカスタマイズ
jケースフィードとやりとりするカスタムコンソールコンポーネントの作成
| 使用可能なエディション: 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 (クローズ)] に設定します。
1swfobject.registerObject("clippy.codeblock-0", "9");
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17Sfdc.canvas.publisher.publish({name:"publisher.setActionInputValues",
18 payload:{actionName:"Case.Email",parentFields: {Status:{value:"Closed"}},
19 emailFields: {to:{value:"customer@company.com"},cc:{value:"customer2@company.com"},
20 bcc:{value:"supervisor@company.com"},
21subject:{value:"Your Issue Has Been Resolved"},
22 body:{value:"Thank you for working with our support department.
23 We've resolved your issue and have closed this ticket, but
24 please feel free to contact us at any time if you encounter this
25 problem again or need other assistance."}}}});このコードスニペットによって、投稿アクションの本文の現在のカーソル位置に語句「Hello World」が挿入されます。
1swfobject.registerObject("clippy.codeblock-1", "9");
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17Sfdc.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 クラスを示します。
1swfobject.registerObject("clippy.codeblock-2", "9");
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17public with sharing class KBController {
18 public List<FAQ__kav> articles {get; set;}
19
20 public KBController() {
21 articles = [select knowledgearticleid, id, title, content__c from FAQ__kav where
22 publishstatus = 'Online' and language='en_US' order by lastpublisheddate];
23 }
24}次のコードサンプルは、上記の使用事例でカスタムコンソールコンポーネントとして使用される Visualforce ページを示します。
1swfobject.registerObject("clippy.codeblock-3", "9");
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17<apex:page sidebar="false" controller="KBController">
18 <script type='text/javascript' src='/canvas/sdk/js/publisher.js'/>
19 <style>
20 .sampleTitle { background-color: #99A3AC;color:#FFFFFF;font-size:1.1em;
21 font-weight: bold;padding:3px 6px 3px 6px; }
22 .sampleHeader { }
23 .sampleArticleList { min-width: 250px; padding: 8px 0 5px 0;}
24 .sampleUl { padding: 0; margin: 0; list-style: none;}
25 .sampleLi { display: block; position: relative; margin: 0;}
26 .sampleRow { min-height: 16px; padding: 4px 10px;}
27 .emailBtn { margin: 1px 1px 1px 3px; padding: 3px 8px; color: #333;
28 border: 1px solid #b5b5b5; border-bottom-color: #7f7f7f; background: #e8e8e9;
29 font-weight: bold; font-size: .9em; -moz-border-radius: 3px;
30 -webkit-border-radius: 3px; order-radius: 3px; }
31 .emailBtn:active { background-position: right -60px; border-color: #585858;
32 border-bottom-color: #939393; }
33 .sampleArticle { padding-left: 4px; padding-bottom: 2px; font-weight: bold;
34 font-size: 1em; color: #222; }
35 .sampleLink { color: #015ba7; text-decoration: none; font-weight: bold;
36 font-size: .9em; }
37 </style>
38 <script>
39 function emailArticle(content) {
40 Sfdc.canvas.publisher.publish({name: 'publisher.selectAction',
41 payload: { actionName: 'Case.Email'}});
42 Sfdc.canvas.publisher.publish({name: 'publisher.setActionInputValues',
43 payload: {
44 actionName: 'Case.Email',
45 emailFields: { body: { value:content, format:'richtext', insert: true}}
46 }});
47 }
48 </script>
49 <div style="margin-left:-10px;margin-right:-10px;">
50 <div class="sampleTitle">Latest Articles</div>
51 <div class="sampleHeader" style=""></div>
52 <div class="sampleArticleList">
53 <apex:repeat value="{!articles}" var="article">
54 <ul class="sampleUl">
55 <li class="sampleLi">
56 <div class="sampleRow">
57 <div style="display:none;" id="content_{!article.id}">
58 <apex:outputText value="{!article.content__c}" escape="false"/>
59 </div>
60 <input type="button" title="Email" value="Email" class="emailBtn"
61 onclick="emailArticle(document.getElementById
62 ('content_{!article.id}').innerHTML);"/>
63 <span class="sampleArticle">
64 <a href="/{!article.knowledgearticleid}"
65 title="{!article.title}" class="sampleLink">
66 {!article.title}</a>
67 </span>
68 </div>
69 </li>
70 </ul>
71 </apex:repeat>
72 </div>
73 </div>
74</apex:page>