Twitter’s Like button as Salesforce Lightning Component- pure CSS3 with Video

Building Lightning component checkbox to have Twitter’s Heart like animation without any image or JavaScript.

Twitter uses image sprite and JavaScript to produce Like button animation. We would be giving same effect to checkbox by using Lightning component. Combination of Checkbox, Label and Box property of CSS3 is used to give final result.

Lightning Component will contain only declaration of checkbox as shown below.

TwitterLove.cmp


<aura:component >
<input id="toggle-heart" type="checkbox" />
<label for="toggle-heart">❤</label>
</aura:component>

Note : In above source code, heart UTF icon is getting replaced by emoji code, so refer this screen to see exact code written for Lightning Component.

We have used Sassy CSS (SCSS) in this demo, as it would be little bit hard to write pure CSS with animation. Once SCSS is written, we can use this online tool to convert it to CSS. All these are explained and build live on my channel. Continue reading “Twitter’s Like button as Salesforce Lightning Component- pure CSS3 with Video”

Five important configuration in Service cloud console layout – Video

Video tutorial explaining basics of Service cloud console and configuring important features

Many times I struggle to remember how to configure some components in Service cloud because, there are many features which has been disabled. Many new feature needs some extra configuration to enable it. For example, like to enable Knowledge One, we need to disable traditional article component

This video explains some of basics of configuring Service cloud console in Salesforce.

Below are topics covered in this video :

  1. Setting up Highlight Panel
  2. Enabling Knowledge One component and auto search article on basis of Subject entered
  3. Disabling related list on left panel
  4. Adding service console component on left panel
  5. Enabling Interaction log

Continue reading “Five important configuration in Service cloud console layout – Video”

Lightning component code review using CLI – Video

Video tutorial explaining how we can use Lightning CLI to identify possible issues and enhancements needed for Lightning Component and enabling it for Locker Service

Lightning CLI is code linting tool, which can be used to validate source code of Lightning components (Javascript files only). This tool is made specially keeping Locker Service in mind where we can validate if Lightnign component is breaking any contract while trying to access DOM element out of its own scope.

Lightning CLI is based on open source project ESLint. Below video demonstrates how we can install Lightning CLI and use it for existing Lightning Components. You can subscribe to my youtube channel to get latest update on Salesforce related videos.

Use below command to install heroku CLI plugin, assuming you already have heroku installed :

 heroku plugins:install salesforce-lightning-cli

Get code review comments on screen as a text

heroku lightning:lint .

Get code review comment on screen as a JSON

heroku lightning:lint . -j

Export code review comments in a file

heroku lightning:lint . > CodeReview.txt
OR
heroku lightning:lint . -j > CodeReview.json

To export code review feedback generated by Salesforce Lightning CLI tool, refer this blog post.

Continue reading “Lightning component code review using CLI – Video”

Guide to setup Omni Channel in Salesforce with Video

Step by step guide to know about Omni Channel and how does it makes Call Centre Queue Manager’s life easier in Salesforce Service Cloud

We can route case or lead records to Queue on basis of assignment rules. Queue can also be set as an owner for custom object records. However, once record is assigned to queue, it needs manual intervention to assign it further to members in queue or queue member can assign to themselves. Queue members assigning to themselves, however may result into cherry picking. Some agents may resolve easier cases and some of them only gets time consuming or hard cases.

Omni-Channel offering from Service cloud is promising product and resolves this problem to some extend. It can automatically route records to agents in queue on basis of incoming case complexity and work load of agents.

Omni-Channel in Salesforce
Omni-Channel in Salesforce

In this post, we will walk through steps to set up Omni-Channel. Continue reading “Guide to setup Omni Channel in Salesforce with Video”

Delete Components using Ant Migration tool – Video

Author posted by Jitendra on Posted on under category Categories Salesforce and tagged as Tags , , with 1 Comment on Delete Components using Ant Migration tool – Video

This video tutorial shows that how we can delete components like Apex class, trigger from Salesforce using ANT migration tool.

I have posted multiple basic and advance articles about using ANT or ANT migration tool with Salesforce. Some of most visited articles are :

Going through multiple comments, I decided to create this 5 minute video tutorial to demonstrate, how we can use DestructiveChanges.xml in Ant migration tool to delete components.

As known already, we cannot simply delete components from Salesforce production using changeset. Apex classes, triggers etc cannot be deleted manually as well.

subscribe to Youtube channel, to get notifications about new Salesforce videos.

 

Responsive Datagrid component in Lightning – Basics

This blog post explains simple use case of Nested Lightning Component. It goes through example on how to interact and combine nested components to be used in parent Lightning component.

Please refer this post of latest version of responsive Datagrid Lightning Component.

This is a first blog post of a series, to develop advance lightning components and understand various features offered by Salesforce Lightning Platform. This post will explain why do we need nested components and how do they communicate.

At first, nested components looks like displaying something in child component and wrapped in parent component. However, to make most of nested components and designing efficient Lightning components, we should use nested component only to define set of rules. Unlike components in Visualforce, where we render some reusable output on page, Nested components in Lightning defines set of attributes to be used by parent component.

Hard to digest and imagine ? Please read on this post, you will understand concept soon. Continue reading “Responsive Datagrid component in Lightning – Basics”

Export Datasets in Salesforce Analytics Cloud – Video

Video tutorial showing steps to download existing Datasets from Salesforce Analytics Cloud

Once data is synced from various sources in Dataset, it is saved in proprietor format of Salesforce Wave Analytics Cloud and can be retrieved using Salesforce Analytics Query Language (SAQL). I came across free utility Analytics-Cloud-Dataset-Utils which is listed on my favorite Salesforce tools entry.

After downloading Analytics-Cloud-Dataset-Utils, simply execute jar file from console as shown in below video. New window will be opened in browser by executing that command.

Below video tutorial shows, how this tool can be used to extract Dataset from Salesforce Wave Analytics Cloud as a CSV file. Continue reading “Export Datasets in Salesforce Analytics Cloud – Video”

Salesforce Wave Analytics Cloud – Compare and Data Table (Video)

This is a third video in “Salesforce Wave Analytics Cloud” series to get familiar with platform.

This video demonstrates below functionality of Analytics cloud

  1. Logarithmic Scale
  2. Export lens as an image
  3. Focus
  4. Using Data table
  5. Benefit of Compare table

Continue reading “Salesforce Wave Analytics Cloud – Compare and Data Table (Video)”

Salesforce Wave Analytics Cloud – Stacked Bar Chart Hands On (Video)

This is second video in series to learn and get familiar with “Salesforce Wave Analytics Cloud”.

This is first video to directly get hands-on wave platform after covering some of basics.

It shows how to use “Stacked Bar Chart” in lenses. Continue reading “Salesforce Wave Analytics Cloud – Stacked Bar Chart Hands On (Video)”

Salesforce Analytics Cloud Basics – Video

Salesforce Analytics Cloud is new Business Intelligence tool from Salesforce on Wave platform.

Salesforce Wave Analytics Cloud
Salesforce Wave Analytics Cloud

How Wave Works

We can import millions of data into wave from external systems like Salesforce, SAP, BOOMI, CSV, Informatica etc.

How Salesforce Wave works
How Salesforce Wave works

Imported data in Wave is known as Dataset. Multiple lenses can be created on those Datasets which could be used to create dashboards. Continue reading “Salesforce Analytics Cloud Basics – Video”