Loading...

In today’s fast-paced business landscape, productivity hinges on streamlined workflows and intuitive interfaces. While Salesforce offers robust activity tracking capabilities, sometimes the standard components fall short of specific organizational needs. 

That’s where a Custom Activity Component comes in—designed to tailor your activity management experience, boost user efficiency, and provide deeper insights into customer interactions.

In this blog, we’ll walk you through the key steps to create the Custom Activity Component:

How to Create the Custom Activity Timeline Component

Step 1: Create the Lightning Web Component (LWC)

  • Open Visual Studio Code.
  • Open the Command Palette by Ctrl+Shift+P for Windows
  • Select SFDX: Create Lightning Web Component
  • Create ActivityTimeline and ActivityTimelineItem as the component name.
  • Press Enter to accept the default directory.

Note: I have attached the zip file, which has the code. Please extract it and add the LWC and Apex Code.

  • Copy and paste the code into the LWC component.
    • HTML in ActivityTimeline.html and ActivityTimelineItem.html.
    • Javascript file code in ‘ActivityTimeline.js’ and ‘ActivityTimelineItem.js.

Step 2: Create the Apex Class

  • Create an Apex Class:
    • Create the Apex Classes and enter the code from the zip file.
  • Save the Apex Class.

Step 3: Deploy both the LWC and Apex classes to your Salesforce org.

Step 4: Add the Component to the Account Page Layout

  • Navigate to the Account Page Layout:
    • From Setup, enter Object Manager in the Quick Find box and select Account.
    • Select the record and edit the layout.
  • Add the Custom Component:

Drag and drop the ActivityTimeline component onto the page layout.

Save the Layout.

Test the functionality

To test the component, create a few activity logs with different owners or subjects. Use the filters to display or hide marketing activities to determine if they are functioning correctly.

Watch the Demo

https://www.youtube.com/watch?v=Pkaz4q9UV94

Concluding Words

A Custom Activity Component not only enhances visibility into your team’s interactions but also empowers users with a more tailored and efficient Salesforce experience. By following the steps outlined above, you can create a dynamic, filterable activity timeline that aligns with your business needs.

We hope the tutorial was helpful to you!

For more proven techniques and best practices to thrive & stay ahead in the market, check out our informative Salesforce tutorials.


Related Articles

Sticky notes aren’t just for your desk anymore! In this tutorial, we’ll create a Lightning Web Component (LWC) in Salesforce that allows you to pin notes on your app page or record page. With a clean, interactive UI, these digital sticky notes ensure you never forget important tasks or details. What Will You Learn? By […]

Read More
How to Create Dynamic, Animated Charts in Salesforce LWC using Chart.js

Bring Salesforce data to life with dynamic charts inside Lightning pages! While Salesforce dashboards are powerful, sometimes business users want visual insights without leaving their current page. That’s where Chart.js with Lightning Web Components (LWC) becomes a game-changer. In this step-by-step guide, you’ll learn how to: Upload Chart.js as a static resource in Salesforce. Build […]

Read More
How to Encrypt and Decrypt Data in Salesforce Using Apex Crypto Class

Data security is more important than ever. Whether you’re storing customer information, sensitive business data, or private communication, ensuring that your data stays safe is critical. Salesforce provides built-in tools to help with this, and one of the most powerful yet easy-to-use approaches is encryption and decryption using the Apex Crypto class. In this blog, […]

Read More
Benefits & Step-by-Step Setup Guide for Salesforce Code Analyzer

When building on the Salesforce platform, code quality and security are non-negotiable, especially before submitting your app for a Salesforce Security Review. Catching bugs and vulnerabilities early not only saves time but also ensures compliance with Salesforce’s best practices. That’s where the Salesforce Code Analyzer comes in. This open-source tool scans your Apex classes, triggers, […]

Read More
A Step-by-Step Guide to Integrate Zoho CRM with Salesforce (Without Coding)

Managing data across multiple CRMs can be a real challenge for businesses that want a single source of truth. If your teams use Zoho CRM but want to move or sync all records seamlessly into Salesforce, you don’t need to write a single line of code. Thanks to MultiSync Made Easy, the integration process is […]

Read More
How to Integrate Salesforce with Copilot

Integrating Salesforce with Copilot is becoming an essential step for organizations aiming to streamline workflows, automate client data management, and unlock the power of AI-driven CRM. By connecting these two platforms, businesses can centralize customer information, reduce manual tasks, and accelerate growth. This guide walks you through the Salesforce–Copilot integration process with clear steps, Apex […]

Read More