Salesforce Profile Tabs Cheatsheet
DOWNLOAD
First things first !
To download this implementation guide, click the download button below.
If you need more information about the implementation guide, you can read the Table of Contents below.
Customize Chatter Profile Pages
with Profile Tabs
Salesforce Spring
salesforcedocs
Last updated March
Copyright salesforcecom inc All rights reserved Salesforce is a registered trademark of salesforcecom inc
as are other names and marks Other marks appearing herein may be trademarks of their respective owners
CONTENTS
Customize Chatter Profile Pages with Profile Tabs
Let Admins Customize Chatter Profile Pages
What is a Subtab App
Managing Subtab Apps
Controlling Subtab App Visibility
What is a Profile Tab
What Should a Profile Tab Include
Options for Building a Profile Tab
CUSTOMIZE CHATTER PROFILE PAGES WITH PROFILE TABS
Deploy custom content in Chatter profile pages by using subtab apps and custom tabs
User information is organized in these default tabs
Feed tabDisplays your Chatter feed
Overview tabDisplays information about you such as your groups followers recent topics About Me section and your activity
in Communities
Administrators may configure the tabs on the profile page to include custom tabs or remove default tabs
Let Admins Customize Chatter Profile Pages
The Enable Customization of Chatter User Profile Pages user interface setting enables administrators to
customize the tabs on the Chatter user profile page This includes adding custom tabs or removing default tabs This feature is
automatically enabled in the Winter release If disabled users see the Feed and Overview tabs only
What is a Subtab App
An app is a group of tabs that work as a unit to provide application functionality Similarly a subtab app is a collection of tabs that
appears on the Chatter profile page A subtab app can include both default and custom tabs
What is a Profile Tab
A profile tab is a custom tab you create to display custom object data or other web content on the profile page
Customize Chatter Profile Pages with Profile Tabs
Let Admins Customize Chatter Profile Pages
Let Admins Customize Chatter Profile Pages
The Enable Customization of Chatter User Profile Pages user interface setting enables administrators to
customize the tabs on the Chatter user profile page This includes adding custom tabs or removing default tabs This feature is automatically
enabled in the Winter release If disabled users see the Feed and Overview tabs only
From Setup enter User Interface in the Quick Find box then select User Interface
Select Enable Customization of Chatter User Profile Pages
Click Save
What is a Subtab App
An app is a group of tabs that work as a unit to provide application functionality Similarly a subtab
app is a collection of tabs that appears on the Chatter profile page A subtab app can include both
default and custom tabs
Users can see different sets of tabs on the profile page depending on their context Subtab apps
are the various sets of tabs available on specific pages such as users profile pages
These default subtab apps determine which tabs display depending on the users context
Subtab App
Displayed to the user when viewing
Profile Others
Another user inside their internal organization
Profile Self
Their own profile inside their internal
organization
Profile in Communities Others
Another user while inside a community Its
shown only if Communities is enabled
Profile in Communities Self
Their own profile inside a community Its shown
only if Communities is enabled
EDITIONS
Available in both Salesforce
Classic not available in all
orgs and Lightning
Experience
Available in Contact
Manager Group
Professional Enterprise
Performance Unlimited
and Developer Editions
Note End users cant customize the display of subtab apps Administrators can hide tabs within subtab apps using the Tab
Hidden option in Tab Settings Users can see tabs set to Default Off and Default On
Managing Subtab Apps
You can view and customize the subtab apps on users profile pages
Controlling Subtab App Visibility
Once you have configured subtab apps you can specify which users can see specific tabs on the profile page
Customize Chatter Profile Pages with Profile Tabs
Managing Subtab Apps
Managing Subtab Apps
You can view and customize the subtab apps on users profile pages
From Setup enter Apps in the Quick Find box then select Apps to display your organizations
subtab apps
You can do the following
To view details for a subtab app click the name in the Subtab Apps section This displays its
properties such as which tabs are part of the app including any tabs that are not yet deployed
Click custom tabs in the Included Tabs list to view details
To change the properties of a subtab app click Edit to choose the tabs to include in the subtab
app change their display order and set the Default Landing Tab
Note Administrators can change permission sets or profile settings to limit users access
to each tab This allows administrators to make specific tabs available to some users but
not to others
EDITIONS
Available in Salesforce
Classic not available in all
orgs Lightning Experience
and the Salesforce mobile
app
Available in Contact
Manager Group
Professional Enterprise
Performance Unlimited
and Developer Editions
USER PERMISSIONS
To view apps
View Setup and
Configuration
To manage apps
Customize Application
Controlling Subtab App Visibility
Once you have configured subtab apps you can specify which users can see specific tabs on the
profile page
EDITIONS
To control the visibility of tabs within a subtab app
Available in Salesforce
Classic not available in all
orgs Lightning Experience
and the Salesforce mobile
app
From Setup enter Profiles in the Quick Find box then select Profiles
Do one of the following
Original profile user interfaceClick Edit next to the profile you want to modify and scroll
to the Tab Settings section
Enhanced profile user interfaceClick the profile you want to modify and click Object
Settings Click the object you want to modify and click Edit
Note Some profiles including Chatter External and Chatter Free users dont have the
permissions needed to view subtab apps
Available in Contact
Manager Group
Professional Enterprise
Performance Unlimited
and Developer Editions
USER PERMISSIONS
Change the tab settings
End users cant customize the display of subtab apps Administrators can hide tabs within subtab
apps using the Tab Hidden option in Tab Settings Users can see tabs set to Default
Off and Default On
Original profile user interface only To reset users tab customizations to the tab visibility settings
that you specify select Overwrite users personal tab customizations
Click Save
To view apps
View Setup and
Configuration
To manage apps
Customize Application
Customize Chatter Profile Pages with Profile Tabs
What is a Profile Tab
What is a Profile Tab
A profile tab is a custom tab you create to display custom object data or other web content on the profile page
The following types of custom tabs are available for the profile page
Custom web tabs display any external webbased application or web page
Visualforce tabs display data from a Visualforce page Visualforce tabs look and function just like standard tabs
Note Custom Object Tabs and Standard Object Tabs are not available as profile tabs
Profile tabs work just like other custom tabs Additionally they can effectively function outside the profile page However keep in mind
that you lose the ability to toggle tabs without reloading the parent page
By adding custom tabs on the profile page you can build and display different types of content including
Custom fields
Internal apps and content
Org charts
Wikis or blogs
Dashboards and other sales marketing or servicerelated information
External content from sites like LinkedIn or Twitter
What Should a Profile Tab Include
Consider who the viewer is and who is being viewed when creating profile tabs
Options for Building a Profile Tab
Profile tabs can be built with Web tabs Visualforce tabs and Visualforce tabs with a Canvas tag
What Should a Profile Tab Include
Consider who the viewer is and who is being viewed when creating profile tabs
When creating content for the profile page consider the following
Is the content specific to individual users
Content is displayed on individual profiles and should be focused on a single person providing interactions and calls to action related
to that person and their activity
Is it possible to contextualize the content based on the viewer
The app knows whether you are viewing your own profile or someone elses so your design should take that into account
Viewing my own profile Can I see or do more on my own profile than I can on someone elses
Viewing someone elses profile Can I see unique information or take action based on the relationship or history between myself
and the user Im viewing
Does the content help drive engagement
Consider ways to drive repeat visits to profiles to see new info or respond to calls to action
Your app can easily hyperlink to other peoples profiles or link directly to your profile app from another profile
Customize Chatter Profile Pages with Profile Tabs
Options for Building a Profile Tab
Options for Building a Profile Tab
Profile tabs can be built with Web tabs Visualforce tabs and Visualforce tabs with a Canvas tag
Use a Web tabChoose whether to send additional context parameters to the webpage as with any other web tab
Use a Visualforce tabOptionally extend the standard User controller to properly handle the Salesforce userId parameter This
isnt required if you simply want to display related data about the user from other objects
Use a Visualforce tab with a Canvas tagYou will also need to use a controller extension and pass the Salesforce userId parameter
along with any other relevant parameters into the Canvas app
Sample Visualforce Page and User Controller Extension
Extend the standard User controller and create a sample Visualforce page to get started on building custom Visualforce tabs
Profile Tab Size Limitations
Visualforce tabs on the profile page are limited to a width of pixels
Automatically Resize Profile Tabs
The following code example dynamically resizes the height of a profile tab This allows varying heights for a tab without the use of
an extra scroll bar on the side of the page
Profile Page Parameters
Parameters are namespaced to the vendors and tabs themselves to allow you to pass parameters to your pages through the profile
and link to your tabs from other locations
Sample Visualforce Page and User Controller Extension
Extend the standard User controller and create a sample Visualforce page to get started on building custom Visualforce tabs
User Controller Extension Example
To create your controller extension class from Setup enter Apex Classes in the Quick Find box then select Apex Classes
public with sharing class ProfileTabUserController
Purpose Custom Chatter profile page
private ApexPagesStandardController c
Getter methods you can call from your Visualforce page eg viewingMyProfile
public User subjectUser get set
public boolean viewingMyProfile get set Whether or not Im viewing my profile
public String viewerID get set UID string for the viewing user
public String subjectID get set UID string for the subject user being viewed
Constructor method for the controller
public ProfileTabUserControllerApexPagesStandardController stdController
c stdController
subjectID getTargetSFDCUID
If were operating inside a tab running inside of a profile
if subjectID null
Inject the sfdcuserId URL parameter value into the id param
Customize Chatter Profile Pages with Profile Tabs
Options for Building a Profile Tab
so the std User controller loads the right User record
ApexPagescurrentPagegetParametersputid subjectID
Load the User record for the user whose profile were viewing
thissubjectUser UserstdControllergetRecord
Id viewer IdvalueOfUserInfogetUserId
Id subject IdvalueOfsubjectID
viewingMyProfile viewer subject
viewerID UserInfogetUserId
Fetches URL parameter passed into a profile tab indicating which user is being
viewed
private String getTargetSFDCUID
return ApexPagescurrentPagegetParametersgetsfdcuserId
Overrides StandardController save method to force reload of current page afterwards
public PageReference save
csave
return ApexPagescurrentPage
Overrides StandardController cancel method to force page reload
public PageReference cancel
ccancel
return ApexPagescurrentPage
Visualforce Page Example
To create your page from Setup enter Visualforce Pages in the Quick Find box then select Visualforce Pages
Note Due to a known issue you cant save a Visualforce page from the Developer Console You must create the page from Setup
apexpage showHeaderfalse standardControllerUser
extensionsProfileTabUserController
apexoutputPanel
pYour name is UserFirstName UserLastName and
youre the viewer Your UID is viewerIDp
br
pYou are viewing the profile of username
whose UID is subjectIDp
br
pAre you viewing your own profile viewingMyProfilep
br
apexoutputPanel
Customize Chatter Profile Pages with Profile Tabs
Options for Building a Profile Tab
apexpage
User refers to the context users User record
user refers to the User record of the person whose profile is being viewed All fields are loaded with this record including
custom fields
Note Developers should update their profile apps to use the showHeaderfalse preference in the main Visualforce page
tag This will suppress page headers and footers If the profile app you develop calls another Visualforce page the target page
must also contain the showHeaderfalse preference so that Salesforce page headers do not suddenly appear Alternatively
if you dont manage the code for that target page you should pass the isdtpnv parameter headerless parameter into the
page when you invoke it to suppress headers and footers
Profile Tab Size Limitations
Visualforce tabs on the profile page are limited to a width of pixels
The profile subtab apps can be configured with Web tabs and Visualforce tabs including those embedding Canvas applications Profile
tabs function similarly to regular tabs however some Visualforce tabs wont work well on the profile page because profile tabs are limited
to a width of pixels Additionally tabs over pixels high include a vertical scrolling bar on the side of the tab content area
Automatically Resize Profile Tabs
The following code example dynamically resizes the height of a profile tab This allows varying heights for a tab without the use of an
extra scroll bar on the side of the page
To create your page from Setup enter Visualforce Pages in the Quick Find box then select Visualforce Pages
apexpage showHeaderfalse
change background so we can see the resizing
style typetextcssbody backgroundcoloryellowstyle
script typetextjavascript srccanvassdkjspublisherjs
textarea namejsconsole idjsconsole rows cols readOnlytruetextarea
script
function resize
consolelogSEND RESIZE FROM VF PAGE
Sfdccanvaspublisherresize width px height px
function updateDisplaymsg
consolelogGOT EVENT IN VF PAGE msg
var jsConsole documentgetElementByIdjsconsole
ifjsConsole
jsConsolevalue msg n
auto resize the text area so we dont lose it on screen shot
jsConsolerows jsConsolevaluematchnglength
SfdccanvasonReadyfunction
Optionally listen for the resize callback Gets called upon successful resize
and contains actual width and height as it may not be the requested based off
on
max values or final
Customize Chatter Profile Pages with Profile Tabs
Options for Building a Profile Tab
Sfdccanvaspublishersubscribe
name sfdcresize onData functione consoleloge
updateDisplaysfdcresize
consolelogVFpage rendered
script
p
input idrefresh typebutton valueResize onclickresize
Test page for VF resizing
apexpage
Profile Page Parameters
Parameters are namespaced to the vendors and tabs themselves to allow you to pass parameters to your pages through the profile and
link to your tabs from other locations
When your profile tab is loaded within the Chatter profile page a request parameter sfdcuserId is passed This parameter contains
the User ID of the person whose profile is being viewed This information is needed so that your app can load the appropriate content
Note The parameter isnt passed if your profile tab is a Web tab
Namespaces
The profile can host many different vendors and individual tabs so these parameters are namespaced to the vendors and tabs themselves
In order to support tab switching and changes to tab parameters without reloading this functionality has been extended to work with
the URL fragmentthe hash or portion of the URLas an alternate method of input
The namespace will differ depending on the tab type
If the tab is part of a managed package the tabName is prefixed by the developer namespace For example the tab ExampleTab
created by ExampleDeveloper would be called ExampleDeveloperExampleTab
Tabs created as part of unmanaged developer packages dont have a namespace In those cases the tabName is simply the tab
name specified during tab creation or the object ID for custom objects For example the tab ExampleTab created by
ExampleDeveloper would be called ExampleTab
Core Salesforce tabs carry the namespace sfdc For example the tab name for a core tab would be sfdcCoreTabName
In the following sections tabName refers to any of these cases depending on context If a developer namespace is set tabName
refers to the fully qualified name DeveloperNameTabName
Parameters
Tab Name ParametertabtabName
The currently viewed tab may be switched by altering the tab parameter in either the URL query string or the URL fragment By using
the fragment to set this parameter a tab switch may be effected without requiring a wholepage reloadand perhaps no load at
all if the switchedto tab has already been loaded For example
Current URLhttpssalesforcecomuicoreuserprofile
UserProfilePagetabDevExample
Customize Chatter Profile Pages with Profile Tabs
Options for Building a Profile Tab
From within the DevExample tab the developer changes the parent URL
tohttpssalesforcecomuicoreuserprofile
UserProfilePagetabDevExampletabDevOtherExample
Which is then rewritten by the Profile dynamically tohttpssalesforcecomuicoreuserprofile
UserProfilePagetabDevOtherExample
In this way the client tab was able to change the tab parameter without changing the parent URL The advantage is that a full page
reload is not required and crossdomain restrictions dont apply since changing the URL is allowed though not reading it
Arbitrary Tab ParameterstabtabNameparamvalue
Tabs may pass themselves or other tabs arbitrary parameters through the parent profile URL via either the query string or the URL
fragment treated as a query string For example
Current parent URLhttpssalesforcecomuicoreuserprofile
UserProfilePagetabDevExample
Current child URLhttpssalesforcecomapexExample
From within the child DevExample tab the developer changes the parent URL
tohttpssalesforcecomuicoreuserprofile
UserProfilePagetabDevExampletabdevExampleparamvalue
Which is then rewritten by the Profile dynamically tohttpssalesforcecomuicoreuserprofile
UserProfilePagetabDevExampletabdevExampleparamvalue
Which then reloads the child tab withhttpssalesforcecomapexExampleparamvalue
User ID ParametersfdcuserIdUserID
The profile will always pass sfdcuserIdUserId to all child tab pages excluding Web tabs which require configuration
