P. 1
Case Feed Dev Guide

Case Feed Dev Guide

|Views: 135|Likes:
Published by camicami2
Salesforce Case Feed Developer Guide
Salesforce Case Feed Developer Guide

More info:

Published by: camicami2 on May 29, 2013
Copyright:Attribution Non-commercial

Availability:

Read on Scribd mobile: iPhone, iPad and Android.
download as PDF, TXT or read online from Scribd
See more
See less

09/14/2013

pdf

text

original

Salesforce.

com: Winter ’13

Customizing Case Feed with Visualforce

Last updated: November 30 2012
© Copyright 2000–2012 salesforce.com, inc. All rights reserved. Salesforce.com is a registered trademark of salesforce.com, inc., as are other

names and marks. Other marks appearing herein may be trademarks of their respective owners.

...........21 Chapter 7: Creating Custom Publishers...............................................................................................................10 Chapter 3: Customizing the Portal Publisher...................................................................Table of Contents Table of Contents Introduction..............................................................................................................13 Chapter 4: Customizing the Log a Call Publisher...........15 Chapter 5: Customizing the Articles Tool...............................................................................................................3 Chapter 1: Customizing the Layout and Appearance of Case Feed..............................................................................................................................5 Chapter 2: Customizing the Email Publisher.............................18 Chapter 6: Replicating a Standard Case Feed Page................................................................23 Chapter 8: Learning More...............................................................25 i ...............................................................................................................................

Table of Contents ii .

The feed displays important case events in chronological order. Requirements Before customizing Case Feed in the Service Cloud console. it’s not possible to assign that page only to certain users while allowing other users to see the standard Case Feed page. when you create a custom Case Feed page using Visualforce.. You’re familiar with developing with Visualforce. Check out the Visualforce Developer’s Guide for a comprehensive overview. Case Feed includes publishers and a Chatter feed. Your organization has at least one Service Cloud console app. Unlimited. managing. with the support:CaseFeed component. For more information. and feed tracking on cases are enabled in your organization. make sure: • • • Case Feed. See Replicating a Standard Case Feed Page on page 21 for more information. Customization Overview There are five Case Feed Visualforce components: Component Name apex:emailPublisher Description Displays and controls the appearance and functionality of the Case Feed Email publisher. The standard Case Feed page is designed for organizations that want to take advantage of feed-based case management quickly and with minimal configuration. You can modify the Case Feed page in a few ways. Chatter. including specifying which publishers and tools are available to users. 3 . and communicate with customers..Introduction Available in: Enterprise. and then create a custom page to assign to a different set of users. Use It To. see “Creating a Service Cloud Console App” in the online help. and Developer Editions Case Feed gives support agents a more streamlined way of creating. With the Case Feed Visualforce components. you can create a fully customized page within the Service Cloud console. It includes several use cases and examples to help you create a unique Case Feed page. and viewing cases. change the status of cases. assign that page to certain users. This guide is for developers who are responsible for customizing Case Feed according to their company’s needs. so it’s easy to see the progress of each case. However. The publishers let agents create case notes. Refer to Implementing Case Feed for detailed information. • Create an Email publisher and place it anywhere on a Service Cloud console page. log calls. you can create a page that replicates the standard Case Feed page. Assigning Custom Pages to Users Generally. Organizations with more complex or unusual case management needs might find that they need to customize the Case Feed page more heavily.

Change the appearance of the publisher by specifying its dimensions and the fields it includes. 4 . Change the appearance of the publisher by specifying its dimensions and the fields it includes. • support:portalPublisher Displays and controls the appearance and • • functionality of the Case Feed Portal publisher. the chatter:feed component has two attributes related to Case Feed: feedItemType. • apex:logCallPublisher Displays and controls the appearance and functionality of the Case Feed Log a Call publisher. which lets you display the Chatter publisher on a page. including all standard publishers. and showPublisher. Create a Portal publisher and place it anywhere on a Service Cloud console page. such as specifying a default Subject for each outgoing email. The following chapters offer detailed information on each of these components and customization options. • • support:caseArticles Displays and controls the appearance and functionality of the Articles tool for cases. and buttons. which lets you specify how feed items are filtered. links.Introduction Component Name Description Use It To. • • • support:CaseFeed Replicates the standard Case Feed page. Customize certain aspects of the tool’s functionality. Change the appearance of the tool by specifying its dimensions. Create an Articles tool for cases and place it anywhere on a Service Cloud console page. Customize certain aspects of the publisher’s functionality.. Create a Log a Call publisher and place it anywhere on a Service Cloud console page. such as how it searches for articles. In addition. Finally. Create a version of the standard Case Feed page that you can assign to certain users so that you can also create a custom page and assign it to other users.. you can also create Visualforce pages to user as custom publishers in Case Feed. • Change the appearance of the publisher by specifying its dimensions and the fields it includes.

you can also use the chatter:feed component to customize Case Feed. In addition to the four case-specific Visualforce components detailed in this guide. Contact. a comma-separated list of IDs.0 global global reRender Object 25.0 25.0 25. Acme used these steps to create a customized Case Feed page: 5 . An identifier that allows the component to be referenced by other components on the page. including which publishers and tools are shown and where they’re located on the page. or a merge field expression for a list or collection of IDs.0 20. laptops. The Javascript function to call after a post or comment is added to the feed A Boolean value that specifies whether the additional fields defined in the publisher layout should be displayed.Chapter 1 Customizing the Layout and Appearance of Case Feed Creating a customized Case Feed page with Visualforce lets you control the overall layout and appearance. You can also include other standard and custom console components to enhance the functionality of the page. and tablets. This value can be a single ID. and the company wanted to customize the Case Feed page to standardize its look and feel across different devices. They also wanted to make it easier for agents to track case activities using filters. The ID of one or more components that are redrawn when the result of the action method returns to the client.0 showPublisher Boolean 25. See the Type field on the FeedItem object listing in the API Object Reference Guide for accepted values.Id The feed item type on which the Entity or UserProfileFeed is filtered. The table below lists its attributes.0 Access Entity ID of the record for which to display the feed. Yes for example.0 Use Case Acme Entertainment creates online games used by more than a million people on multiple platforms. chatter:feed Attributes Attribute Name entityId feedItemType Attribute Type Description id String Required? API Version 25. Displays the Chatter publisher. id onComplete rendered String String Boolean 20. Acme’s 1500 support agents use desktop computers.

"><span class="menuItem">Log Call</span></a></li> <li style="float:left"><a id="custom_portal_tab" href="javascript:void(0). the default filter is Call Logs. they made the width percentage-based so the publishers expand and contract as the size of the page changes. In apex:emailPublisher."><span class="menuItem">Email Customer</span></a></li> <li style="float:left"><a id="custom_log_call_tab" href="javascript:void(0). and Case Details tabs: <apex:page standardController="Case"> <!-. the default filter is Emails. They repositioned the feed filter and auto-selected default filters depending on case origin: • • • If the case origin is email.Email publisher --> <div id="custom_email_pub_vf"> <apex:emailPublisher entityId="{!case. apex:logCallPublisher.selectMenuItem('custom_portal_tab')." onclick="getDemoSidebarMenu().. the default filter is Portal Answers. Log a Call. Code Sample This code sample shows a Visualforce page with custom Email. overflow: hidden"> <li style="float:left"><a id="custom_email_tab" class="selected" href="javascript:void(0).Customizing the Layout and Appearance of Case Feed 1. They changed the orientation of the publisher tabs from their standard left-side vertical arrangement to a horizontal arrangement at the top of the page. and support:portalPublisher.selectMenuItem('custom_log_call_tab'). Using the chatter:feed component.selectMenuItem('custom_detail_tab').Repositions publisher tabs to a horizontal arrangement on top of the page --> <ul class="demoNav" style="list-style: none.id}" width="80%" 6 . Portal."><span class="menuItem">Portal Answer</span></a></li> <li style="float:left"><a id="custom_detail_tab" href="javascript:void(0). If the case origin is Web. 4. 3. they positioned the feed in the sidebar so the publishers and other Case Feed tools are always in the center of the page."><span class="menuItem">Case Details</span></a></li> </ul> <!-." onclick="getDemoSidebarMenu(). If the case origin is phone." onclick="getDemoSidebarMenu()." onclick="getDemoSidebarMenu(). making their appearance more consistent across different screen sizes. 2.selectMenuItem('custom_email_tab').

this." /> </div> <!-. if (index == tabId) { tabEl.Contact.0/integration.Portal publisher --> <div id="custom_portal_vf" style="display:none"> <support:portalPublisher entityId="{!case.getElementById(index). "custom_detail_tab" : "custom_detail_vf"}.FirstName}. "custom_log_call_tab" : "custom_log_call_vf".id}" width="80%" logCallBodyHeight="10em" reRender="demoFeed" onSubmitSuccess="refreshFeed().Include library for using service desk console API --> <apex:includeScript value="/support/console/25.js"/> <!-.Customizing the Layout and Appearance of Case Feed emailBodyHeight="10em" showAdditionalFields="false" enableQuickText="true" toAddresses="{!case.className = "".email}" toVisibility="readOnly" fromAddresses="support@cirrus. vfEl.display = "none".Case detail page --> <div id="custom_detail_vf" style="display:none"> <apex:detail inlineEdit="true" relatedList="true" rerender="demoFeed" /> </div> <!-.id}" width="80%" answerBodyHeight="10em" reRender="demoFeed" answerBody="Dear {!Case." /> </div> <!-.className = "selected". } var demoSidebarMenu. vfEl.Log call publisher --> <div id="custom_log_call_vf" style="display:none"> <apex:logCallPublisher entityId="{!case. } } }.Javascript for switching publishers --> <script type="text/javascript"> function DemoSidebarMenu() { var menus = {"custom_email_tab" : "custom_email_pub_vf". "custom_portal_tab" : "custom_portal_vf".display = "block".\n\nSupport" onSubmitSuccess="refreshFeed().contact. } return demoSidebarMenu. var vfEl = document.\n\nHere is the solution to your case.com" onSubmitSuccess="refreshFeed().selectMenuItem = function(tabId) { for (var index in menus) { var tabEl = document. var getDemoSidebarMenu = function() { if (!demoSidebarMenu) { demoSidebarMenu = new DemoSidebarMenu(). }.\n\nBest regards.style." /> </div> <!-. } else { tabEl.style. 7 .getElementById(menus[index]).

equals('All')) { curFilter = null. } } This sample shows a Visualforce page with custom feed filters and Chatter feed for cases.RefreshFeedEvent'.console. null.options[selectedIndex]. } } public PageReference refreshFeed() { return null.equals('Phone')) { curFilter = 'CallLogPost'.Customizing the Layout and Appearance of Case Feed </script> <!-.samplePublisherVFPage.StandardController stdController) { this. } else { curFilter = c. public MyCaseExtension(ApexPages.mycase. null).Javascript for firing event to refresh feed in the sidebar --> <script type="text/javascript"> function refreshFeed() { sforce.Feed filter --> <div> <span>Feed Filters:</span> <select onchange="changeFilter(this.value).origin. public class MyCaseExtension { private final Case mycase.fireEvent('Cirrus. private String curFilter.equals('Email')) { curFilter = 'EmailMessageEvent'. <apex:page standardController="Case" extensions="MyCaseExtension"> <!-. } } public String getCurFilter() { return curFilter. } public void setCurFilter(String c) { if (c. // initialize feed filter based on case origin if (this.origin.origin.mycase." id="custom_filterSelect"> <option value="All" id="custom_all_option">All</option> <option value="EmailMessageEvent" id="custom_email_option">Emails</option> <option value="CaseCommentPost" id="custom_web_option">Portal Answers</option> <option value="CallLogPost" id="custom_phone_option">Call Logs</option> </select> </div> <apex:form > 8 .mycase = (Case)stdController. } else if (this. You can use this page in the sidebar of a Service Cloud console. } else if (this.mycase.getRecord().equals('Web')) { curFilter = 'CaseCommentPost'. } </script> </apex:page> The following sample shows an Apex class containing a controller extension to be used with the Visualforce page above.

addEventListener('Cirrus.actionFunction for refreshing feed when the feed filter is updated --> <apex:actionFunction action="{!refreshFeed}" name="changeFilter" reRender="custom_demoFeed" immediate="true" > <apex:param name="firstParam" assignTo="{!curFilter}" value="" /> </apex:actionFunction> <!-. if (!caseOrigin) { caseOrigin = "all".toLowerCase().Javascript for adding event listener for refreshing feed --> <script type="text/javascript"> var listener = function (result) { updateFeed().Javascript for initializing select option based on case origin --> <script type="text/javascript"> window. }. } } </script> </apex:page> 9 .RefreshFeedEvent'.RefreshFeedEvent' event type sforce.samplePublisherVFPage.origin}".0/integration.id}" showPublisher="false" feedItemType="{!curFilter}" id="custom_demoFeed" /> <!-. } else { caseOrigin = caseOrigin. </script> <!-.actionFunction for refreshing feed when there is an event fired for updating the feed --> <apex:actionFunction action="{!refreshFeed}" name="updateFeed" reRender="custom_demoFeed" immediate="true" /> </apex:form> <!-. if (selectElem) { selectElem.getElementById('custom_' + caseOrigin + '_option').console.Include library for using service desk console API --> <apex:includeScript value="/support/console/25.Customizing the Layout and Appearance of Case Feed <!-.samplePublisherVFPage. listener). } var selectElem = document.selected = true. // add a listener for the 'Cirrus.js"/> <!-.Chatter feed --> <chatter:feed entityId="{!case.onload = function() { var caseOrigin = "{!case.

A Boolean value that specifies whether the header is expandable or fixed.0 entityId id Yes 25. you can: • • • • • Customize the dimensions of the Email publisher.0 25.0 10 . The default text value of the email body. A Boolean value that specifies whether the Quick Text autocomplete functionality is available in the publisher.0 25.0 25. or 'textAndHTML'. Define onSubmit functionality. or 'hidden'. Support email templates and attachments in the publisher. Define defaults and visibility for fields. Define the visibility and label of the send button. The visibility of the BCC field can be 'editable'. Required? API Access Version 25.0 expandableHeader fromAddresses fromVisibility Boolean String String 25.0 25. In the current version only Case record ids are supported. Entity ID of the record for which to display the Email publisher. The visibility of the CC field can be 'editable'.0 25.Chapter 2 Customizing the Email Publisher The Email publisher in Case Feed lets support agents connect with customers via email. apex:emailPublisher Attributes Attribute Name autoCollapseBody bccVisibility ccVisibility emailBody emailBodyFormat emailBodyHeight enableQuickText Attribute Type Description Boolean String String String String String Boolean A Boolean value that specifies whether the email body will collapse to a small height when it is empty.0 25.0 25. The height of the email body in em. A restricted set of from addresses. 'editableWithLookup'. 'readOnly'. With the apex:emailPublisher component. 'readOnly'. 'HTML'. or 'hidden'.0 25. 'editableWithLookup'. The visibility of the From field can be 'selectable' or 'hidden'. The format of the email body can be 'text'.

'readOnly'. The default value of the To field. The visibility of the To field can be 'editable'. The JavaScript invoked if the email is successfully sent.0 25. A Boolean value that specifies whether the send button should be displayed. The name of a function that can be called from JavaScript to send the email.0 Global Global reRender Object 25. Cirrus used the apex:emailPublisher component to create an Email publisher that: 11 .0 sendButtonName String 25. The ID of one or more components that are redrawn when the email is successfully sent.0 25. The JavaScript invoked if the email is not successfully sent. A Boolean value that specifies whether the template selector should be displayed.0 25.0 25. 'editableWithLookup'. The name of the send button in the Email publisher. The visibility of the Subject field can be 'editable'. This value can be a single ID. or a merge field expression for a list or collection of IDs. A Boolean value that specifies whether the component is rendered on the page.Customizing the Email Publisher Attribute Name id onSubmitFailure onSubmitSuccess rendered Attribute Type Description String String String Boolean An identifier that allows the component to be referenced by other components on the page.0 25.0 25.0 25. this value defaults to true. Required? API Access Version 25. The title displayed in the email publisher header.0 25. 'readOnly'.0 subjectVisibility String submitFunctionName String title toAddresses toVisibility width String String String String Use Case Cirrus Computers. wanted to customize the Email publisher to increase standardization in outgoing messages and to limit the fields agents could edit. A Boolean value that specifies whether the attachment selector should be displayed.0 25. The width of the publisher in pixels (px) or percentage (%). If not specified. or 'hidden'.0 25. or 'hidden'. a multinational hardware company with technical support agents in ten support centers throughout the world.0 25.0 25.0 25.0 showAdditionalFields Boolean showAttachments showSendButton showTemplates subject Boolean Boolean Boolean String 25. a comma-separated list of IDs. A Boolean value that specifies whether the additional fields defined in the publisher layout should be displayed. The default value of the Subject.

contact. ensuring consistency and increasing agents’ efficiency when writing email messages. Pre-populates those fields. Code Sample <apex:page standardController="Case" > <apex:emailPublisher entityId="{!case. 2.email}" emailBody=""/> </apex:page> 12 . Has read-only To and Subject fields.Customizing the Email Publisher 1.id}" fromVisibility="selectable" subjectVisibility="readOnly" subject="Your Cirrus support request" toVisibility="readOnly" toAddresses="{!case.

This value can be a single ID. The height of the answer body in ems (em).0 13 . id onSubmitFailure onSubmitSuccess rendered String String String Boolean 25.0 answerBodyHeight String autoCollapseBody Boolean entityId id Entity ID of the record for which to display the Yes Portal publisher.0 25. If not specified. The JavaScript invoked if the answer failed to be published to the portal.0 25. With the support:portalPublisher component. The ID of one or more components that are redrawn when the answer is successfully published.Chapter 3 Customizing the Portal Publisher The Portal publisher makes it easy for support agents to compose and post messages to customers on portals. A Boolean value that specifies whether the answer body is collapsed to a small height when it is empty. Define onSubmit functionality.0 Global Global reRender Object 25.0 25. Define the visibility and label of the submit button.0 25. The JavaScript invoked if the answer was successfully published to the portal. Required? API Access Version 25.0 showSendEmailOption Boolean 25. support:portalPublisher Attributes Attribute Name answerBody Attribute Type String Description The default text value of the answer body. you can: • • • • Customize the dimensions of the Portal publisher. this value defaults to true. In the current version.0 25. only Case record ids are supported. a comma-separated list of IDs.0 25. A Boolean value that specifies whether the component is rendered on the page. Define a default value for the portal message text. or a merge field expression for a list or collection of IDs. A Boolean value that specifies whether the option to send email notification should be displayed. An identifier that allows the component to be referenced by other components on the page.

Wellness wanted to customize the Portal publisher to reduce the amount of standard text. The name of the submit button in the portal publisher. and thanks for your question.0 25.Customizing the Portal Publisher Attribute Name Attribute Type Description A Boolean value that specifies whether the submit button should be displayed. Code Sample <apex:page standardController="Case"> <support:portalPublisher entityId="{!case. Required? API Access Version 25.id}" width="800px" answerBody="Hello {!Case. such as greetings and closings.\n\nPlease let me know if there's anything else I can do to help.”).”) and a standard closing (“Please let me know if there’s anything else I can do to help.0 showSubmitButton Boolean submitButtonName String submitFunctionName String title width String String Use Case The Wellness Group is a healthcare company with 300 support agents in three tiers of support.0 25. The name of a function that can be called from JavaScript to publish the answer.Contact.FirstName}. agents had to type when replying to customers. which would help increase agents’ efficiency and improve the standardization of portal communications.0 25. The width of the publisher in pixels (px) or percentage (%). and thanks for your question. The title displayed in the portal publisher header. Lets agents edit the pre-populated text if needed.0 25."> </support:portalPublisher> </apex:page> 14 . Wellness used the support:portalPublisher component to create a Portal publisher that: • • Pre-populates the message body with a standard opening (“Hello {name}.

only Case record ids are supported.0 15 .0 Global logCallBodyHeight String onSubmitFailure onSubmitSuccess rendered String String Boolean Global reRender Object 25. Define onSubmit functionality. With the apex:logCallPublisher. Required? API Version 25. In the current version. The initial text value of the Log a Call body when the publisher is rendered. Specify which fields are displayed in the publisher. This value can be a single ID. 25. this value defaults to true.0 25.0 25. An identifier that allows the component to be referenced by other components on the page. The height of the Log a Call body in em. or a merge field expression for a list or collection of IDs.0 25. apex:logCallPublisher Attributes Attribute Name autoCollapseBody Attribute Type Boolean Description A Boolean value that specifies whether the Log a Call body is collapsed to a small height when it is empty.Chapter 4 Customizing the Log a Call Publisher The Log a Call publisher lets support agents record notes and information about customer calls. Define the visibility and label of the submit button.0 id logCallBody String String 25.0 25. a comma-separated list of IDs. If not specified. you can: • • • • Customize the appearance and dimensions of the Log a Call publisher. The ID of one or more components that are redrawn when the call is successfully logged. A Boolean value that specifies whether the component is rendered on the page.0 Access entityId id Entity ID of the record for which to display the Yes Log a Call publisher. The JavaScript invoked if the call is successfully logged.0 25. The JavaScript invoked if the call is not successfully logged.

The width of the publisher in pixels (px) or percentage (%).0 25. A Boolean value that specifies whether the submit button should be displayed.0 submitFunctionName String title width String String Use Case Universal Cable serves millions of phone and cable customers throughout the United States.Customizing the Log a Call Publisher Attribute Name Attribute Type Description A Boolean value that specifies whether the additional fields defined in the publisher layout should be displayed. giving them a quick and easy way of taking notes about incoming calls.0 25.0 25. The name of a function that can be called from JavaScript to publish the call log. Universal Cable wanted to customize the Log a Call publisher so it was open and available to agents at all times. Is open and available by default each time a support agent opens a case. The name of the submit button in the Log a Call publisher. replacing the standard interaction log. Required? API Version 25.id}" width="100%" title="Log a Call" autoCollapseBody="false" 16 .0 25.0 Access showAdditionalFields Boolean showSubmitButton submitButtonName Boolean String 25. Code Sample <apex:page standardController="Case"> <apex:logCallPublisher entityId="{!case. The title displayed in the Log a Call publisher header. Universal used the apex:logCallPublisher component to create a Log a Call Publisher that: • • Appears in the footer of the page. with 4000 support agents in call centers of varying sizes around the country. even when they were working with another publisher.

Uncheck Interaction Log. Select the layout you’re using from the Page Layouts for Case Feed Users list. click Layout Properties. 10. 8. follow these steps to use the Log a Call publisher you create as a replacement for the standard interaction log: 1. In the page layout editor. Click Save. 4. 6. and then select Edit detail view. 17 . use the lookup to select the page you created as the component to use for the bottom sidebar. 7. Click Your Name > Setup > Customize > Cases > Page Layouts. Specify the height of the publisher.Customizing the Log a Call Publisher showAdditionalFields="false" submitButtonName="Save Log" /> </apex:page> After you create a Visualforce page with this code. 2. 3. In the Subtab Components section. Click OK. Click the Custom Console Components link at the top of the page. Click Save. 5. 9.

see whether articles are attached to a case. Data categories to be used to filter the search. Required? API Version 25.Chapter 5 Customizing the Articles Tool The Articles tool lets support agents browse Salesforce Knowledge articles. A Boolean value that specifies whether articles can be attached to emails. Multiple category filters can be specified separated by commas but only one per category group. If no keywords are specified. including which article types and keywords are used by default and whether advanced search is available. With the support:caseArticles component.0 defaultKeywords String 25. 'mostViewed'.0 18 .0 Access attachToEmailEnabled Boolean bodyHeight 25.0 25. separated by commas. or 'lastPublished'. The format of this value should be: 'CatgeoryGroup1:Category1' where CategoryGroup1 and Category1 are the names of a Category Group and a Category respectively. and share relevant articles with customers. Multiple article types can be defined.0 defaultSearchType String 25. Case ID of the record for which to display the case articles. Define how the tool’s search function works. you can: • • • Customize the appearance and dimensions of the Articles tool. Specify whether agents can attach articles to emails. the Case subject is used as a default. Specifies the default query of the article search form when it is first displayed.0 25. The keywords to be used when the defaultSearchType attribute is 'keyword'. support:caseArticles Attributes Attribute Name articleTypes Attribute Type String Description Article types to be used to filter the search.0 String caseId categories id String Yes 25. The value can be 'keyword'. The height of the body in pixels (px) or 'auto' to automatically adjust to the height of the currently displayed list of articles.

0 String String String Use Case Cirrus Computers wanted to customize the Case Feed articles tool so agents could more easily find articles to help resolve customers’ issues. The JavaScript invoked after an article search has completed.0 25. or a merge field expression for a list or collection of IDs. or both. Cirrus used the support:caseArticles component to create an articles tool that: 1. this value defaults to true. 19 . The width of the keyword search field in pixels (px). Uses search-as-you-type functionality to show suggested articles quickly.0 25.0 25.0 25. an article search form. The name of a function that can be called from JavaScript to search for articles if the widget is currently in search mode. or 'none'. a comma-separated list of IDs. Required? API Version 25. Appears in the right sidebar of the page and is open by default on all case pages. The title displayed in the component's header. Specifies whether the component displays articles currently attached to the case. The width of the component in pixels (px) or percentage (%). or 'searchAndAttached'. A Boolean value that specifies whether the advanced search link should be displayed. The display name of the search button. 'attachedAndSearch'.0 Global Boolean reRender Object 25. 'search'. A Boolean value that specifies whether the component is rendered on the page. The value can be 'attached'.0 25.0 25.Customizing the Articles Tool Attribute Name id language logSearch mode Attribute Type String String Boolean String Description An identifier that allows the component to be referenced by other components on the page.0 searchButtonName String searchFieldWidth String searchFunctionName String 25. 'collapsed'.0 25. Lets agents attach articles to messages they write with the Email publisher. 3. If not specified.0 25. 'fixed'.0 Access Global onSearchComplete String rendered 25. The ID of one or more components that are redrawn when the result of the action method returns to the client. 2. The style of the title bar can be 'expanded'. This value can be a single ID.0 25. The language used for filtering the search if multilingual Salesforce Knowledge is enabled. A Boolean value that specifies whether keyword searches should be logged.0 showAdvancedSearch Boolean title titlebarStyle width 25.

padding:3px 6px 3px 6px.margin-right:-10px.color:#FFFFFF."> <div style="background-color: #99A3AC.">Articles</div> <support:caseArticles caseId="{!case.id}" bodyHeight="auto" titlebarStyle="none" searchButtonName="Search" searchFieldWidth="200px" defaultSearchType="lastPublished" /> </div> </apex:page> 20 . Code Sample <apex:page standardController="Case"> <div style="margin-left:-10px.Customizing the Articles Tool 4.1em.font-size:1. Displays the most recently published articles when no articles are attached to a case.font-weight: bold.

and Case Note publishers Case activity feed Feed filters Highlights panel Case following icon Case followers list Layout. The company wanted a simplified Case Feed page that would be easy for its field agents to use. A Boolean value that specifies whether the component is rendered on the page. National used the support:CaseFeed component to recreate the standard Case Feed page for its call center agents working on desktops. and created a custom page for its field agents working on mobile devices. and help links support:CaseFeed Attributes Attribute Name caseId id rendered Attribute Type id String Boolean Description ID of the case record to display in Case Feed. National’s support operations includes both call center agents who work primarily on desktop computers and field agents who work mainly on mobile devices. 21 .0 26. this value defaults to true. An identifier that allows the component to be referenced by other components in the page.0 global global Use Case National Foods is a food service company supplying restaurants and corporate cafeterias throughout the United States. and also wanted to give its call center agents access to the full Case Feed functionality. Log a Call. If not specified.0 26. Portal. Required? API Access Version Yes 26.Chapter 6 Replicating a Standard Case Feed Page The support:CaseFeed component includes all of the elements of the standard Case Feed page: • • • • • • • Email. print.

public CasePageSelectorExtension(ApexPages. detail.Support.OutputPanel getCasePage() { Component.caseId = caseId.Apex.Id. String caseId.getUserRoleId() == roles[0].Detail detail = new Component.Apex.Detail(). panel.subject = caseId.isEmpty() && UserInfo. } else { Component.getRecord().id.Apex. caseFeed.StandardController controller) { List<UserRole> roles = [SELECT Id FROM UserRole WHERE Name = 'FieldAgent']. } public Component.childComponents. panel. public class CasePageSelectorExtension { boolean isFieldAgent.CaseFeed caseFeed = new Component.CaseFeed().Replicating a Standard Case Feed Page Figure 1: Standard Case Feed page created with support:CaseFeed Code Sample <apex:page standardController="Case" extensions="CasePageSelectorExtension" showHeader="true" sidebar="false"> <apex:dynamicComponent componentValue="{!casePage}"/> </apex:page> The following sample shows an Apex class containing a controller extension to be used with the Visualforce page above.childComponents. } } 22 .OutputPanel panel = new Component.Apex. caseId = controller. isFieldAgent = !roles.add(detail).add(caseFeed). if (isFieldAgent) { Component.Apex.OutputPanel().Support. } return panel.

true). Use Case Viaggio Italiano is a boutique travel agency specializing in tours of Italy.0/interaction. Viaggio Italiano used Visualforce to create a page that includes the ability to post a case comment."/> <apex:outputPanel id="out" > 23 . and itineraries. Code Sample <apex:page standardcontroller="Case" extensions="CaseCommentExtension" showHeader="false"> <apex:includeScript value="/support/api/26. on time. You can use any Visualforce page that uses the standard case controller as a custom publisher. The company tracks multiple details for each client. ground transportation specifics.interaction.refreshObject('{!case. including flights. The company wanted a way to bypass this limit. false.id}'. Viaggio Italiano’s agents needed the ability to create long case comments but were limited to 1000 characters for standard case notes. true.Creates a case comment and on complete notifies the Case Feed page that a related list and the feed have been updated --> <apex:actionFunction action="{!addComment}" name="addComment" rerender="out" oncomplete="sforce. Here are some examples of custom publishers: • • • A Case Comment publisher that lets agents write comments on cases longer than the standard 1000 characters for case notes. An Entitlements publisher that shows the service level agreement (SLA) status—such as past due.Chapter 7 Creating Custom Publishers You can create Visualforce pages that can be used as custom publishers in Case Feed.entityFeed. which can be up to 4000 characters long. The company then added the page as a custom publisher by editing the Case Feed page layout.js"/> <div> <apex:form > <!-. A Task publisher that lets agents create tasks related to a case. dietary preferences. or time to milestone—on a case and lets agents mark milestones as complete.

give profiles access to the page: 1.StandardController controller) { caseRec = (Case)controller. Click Security next to the name of the page you created. public with sharing class CaseCommentExtension { private final Case caseRec. 6. return null. 24 . public CaseComment comment {get.parentid = caseRec. 4. 2. Click Your Name > Setup > Customize > Cases > Page Layouts.id.} public CaseCommentExtension(ApexPages. Choose the page you want to add. } } Additional Steps After creating a Visualforce page. comment. comment = new CaseComment(). 4. set. 2. 5. 7. In Custom Publishers." /> </apex:outputPanel> </apex:form><br /> <button type="button" onclick="addComment(). Choose the profiles you want to be able to access the page.commentbody}" style="width:98%.." style="position:fixed. Then include the page as a custom publisher: 1. right:2px. font-size:13px. comment = new CaseComment(). comment. First. Click Save. Click Save. we recommend a height of 200 pixels. In Page Layouts for Case Feed Users. Click Your Name > Setup > Develop > Pages.getRecord(). click + Add a Visualforce page. click next to a layout and choose Edit feed view.parentid = caseRec. height:160px. In Select Publishers. 3. move the custom publisher from Available to Selected. } public PageReference addComment() { insert comment. For the best appearance.Creating Custom Publishers <apex:inputField value="{!comment. 3. padding: 5px 10px. bottom:0px." id="cpbutton" >Post Case Comment </button> </div> </apex:page> The following sample shows an Apex class containing a controller extension to be used with the Visualforce page above. make it available to users.id. Specify the height of the publisher.

Chapter 8 Learning More Use these resources to learn more about Case Feed and Visualforce: • • • Implementing Case Feed Getting to Know Case Feed Visualforce Developer’s Guide 25 .

You're Reading a Free Preview

Download
scribd
/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->