Tuesday, November 28, 2017

Customize Salesforce App Navigation Menu to have SObject item on Top

Salesforce mobile App, formerly known as Salesforce1, provides you with limited options regarding customization of the menu item. You can only add the following items:
  • Salesforce productivity items such as Dashboards, Reports, Tasks, ...
  • Smarch Search Items
  • Visualforce tabs
  • Lightning Page tabs
The rest of the menu depends on the tabs you are allowed to interact and view on your Salesforce. Most of them would be Standard and Custom objects. And according to what Application you have opened, the mobile app will have the same menu.

But sometimes we would like some of our Object menu to be on top in the main menu instead in the recent section. Also to be able to interact as if it was the standard view.
This can easily be done with a few lines of code and some configuration. For this example, we shall use the Opportunity object.

First, we need to create a Lightning Component. We shall name it "OpportunityMenu". Below are the code needed. Change the "scope" according to the SObject you want.

Now we need to add a new Lightning Component Tab.

Once the custom tab has been created, we can configure the Salesforce mobile Navigation menu and add the Opportunity menu.

Reload your Salesforce App and voila..

Standard Listview layout appears

Additional Resources:
({ navHome : function (component, event, helper) { var homeEvent = $A.get("e.force:navigateToObjectHome"); homeEvent.setParams({ "scope": "Opportunity" }); <aura:component implements="force:appHostable"> <aura:dependency resource="markup://force:navigateToSObject" type="EVENT"/> <aura:handler name="init" value="{!this}" action="{!c.navHome}"/> </aura:component>

Wednesday, November 22, 2017

Uploading multiple files with the Salesforce Lightning file upload Component (Winter 18)

Salesforce has recently released the lightning:fileUpload component which is basically a file uploader for uploading and attaching files to records.

The provides an easy and integrated way for users to upload multiple files. The file uploader includes drag-and-drop functionality and filtering by file types.

For now, it is available only in beta. It will prevent us from writing complex code and as such, does not come with limitations such as heap sizes, problems with assigning permissions to custom devs.

Here are some preview of the component: 
lightning:fileUpload component layout

You can deploy the component to your Salesforce by clicking on the button below:

And source code is available at: https://github.com/kevanmoothien/lightning-file-uploader

Unfortunately, it only uploads files and for those who still want to use attachment, here is one of my previous blog on how it can be achieved. 

Saturday, November 18, 2017

Rendering Visualforce pages with Lightning Experience Stylesheets

winter-18-logoWith the latest release (Winter 18) of Salesforce, a new feature has been added to help style a Visualforce page to Lightning Design with only a single attribute to add on the apex:page xml tag. It will only be viewable under Lightning Experience or on the Salesforce app (formerly known as Salesforce1). If viewed on Salesforce Classic, the styling won't work.

Add the attribute LightningStylesheet and Salesforce get the work done for you.

Here is a sample page I made to illustrate the changes in Salesforce Classic and Lightning Experience.

Salesforce Classic 

Lightning Experience
Salesforce Classic with Inputs

Lightning Experience with Inputs


  • This is a beta version of the feature. It is still under development by the Salesforce team. 
  • You can also use the apex:slds tag for creating custom component
  • It is only available in the Winter 18 api (41). You will have this error with older api version: "Unsupported attribute lightningstylesheets in <apex:page>"

Additional Resources: