Adding the Inspire Planner Portable Gantt (Gantt LWC) to a Lightning Page

Inspire Planner's portable Gantt Lightning Web Component (Gantt LWC) allows you to add the Project Schedule (Gantt) to a Lighting record page for any object.

For example, you may have a Project associated with a specific Opportunity. You can choose to add the portable Gantt LWC to your Opportunity Lightning record page so that you are able to see the Project Schedule directly on the Opportunity record. The portable Gantt Lightning Web Component can be added to the Record Detail or you can also choose to add it to a Tab. Below is an example of having the portable Gantt displayed on the Record Detail page.

This help article will show you how to add the portable Gantt Lightning Web Component (Gantt LWC) to a Lightning record page for any object in Salesforce.

Please note the following:

• This feature only supports a single Project view. This means that you can only view one (1) Project in the Portable Gantt based on what is populated in the Project look-up field on the related Object.
   
• Even though you can add the portable Gantt LWC to any Lightning record page, the Salesforce user needs to have an Inspire Planner license to be able to see the portable Gantt on the page.
   
• The Portable Gantt LWC is not currently supported in Digital Experience.
   
• The Portable Gantt LWC will only display the project Gantt if the project itself is also in Gantt LWC. If the Gantt version in the project is set to Visualforce, then it will not display in the portable Gantt LWC. If some projects are in Gantt Visualforce and some are in Gantt LWC, then we recommend adding both portable components to the Lightning page and setting component visibility based on the Gantt version specified in the Project. 
   
• The steps outlined in this help article must be completed by a Salesforce System Administrator as it requires access to Salesforce Setup.

Create a Look-up to the Project

The first step is to create a look-up between the object and the Inspire Planner Project.

For the purpose of this help article, we are going to go over how to add the portable Gantt LWC to an Opportunity Lightning record page but the same steps apply when adding the portable Gantt LWC to any other object in Salesforce.

1. Go to the Salesforce object where you would like to add the portable Gantt LWC. In the example below, we are going to add the portable Gantt LWC to the Opportunity Lighting record page.
   
   
    
2. Click on Fields & Relationships. Then click on New.
   
   
    
3. Select Lookup Relationship as the data type and click on Next.
   
   
    
4. Select "Project" in Related To and click on Next.
   
   
    
5. You will need to populate the following:
   
   Field Label - set this to "Inspire Project"
   
   Salesforce will auto-populate Field Name as "Inspire_Project" when you tab out of Field Label. Please do not change the value. It should be left as "Inspire_Project".
   
   Then click on Next.
   
   
    
6. Set it to Visible for all user profiles and click on Next.
   
   
    
7. Select the page layout(s) you would like to add the field to and click on Next.
   
   
    
8. Select the Project Page Layout(s) you would like to add the Opportunity Related List to and click on Save.
   
   

Add Portal Gantt Lightning Web Component to the Lightning Record Page

After you've created the Inspire Project look-up field on the object, you will then need to add the portable Gantt Lightning Web Component to your Lightning record page.

Please Note:
The Portable Gantt LWC will only display the project Gantt if the project itself is also in Gantt LWC. If the Gantt version in the project is set to Visualforce, then it will not display in the portable Gantt LWC. You will need to add the Portable Gantt Visualforce to the Lightning record page instead (please see Adding the Inspire Planner Portable Gantt Visualforce to a Lightning record page). If some projects are in Gantt Visualforce and some are in Gantt LWC, then we recommend adding both portable components to the Lightning page and setting component visibility based on the Gantt version specific in the Project.

1. Go to Lightning Record Pages for the Salesforce Object. In the example below, we are adding the portable Gantt LWC to the Opportunity Lightning record page but the same steps apply when you are adding it to any other Salesforce Object.
   
   
    
2. Next, click on the Lightning Record page you are using. The image below is just an example. If you do not have a Lightning Record page yet, you will need to create one first.
   
   
    
3. Click on Edit.
   
   
    
4. Under the section for Custom - Managed, drag Inspire - Project Gantt LWC Portable to your desired area on the Lightning Record Page.
   
   
    
5. We also recommend setting the Component visibility to the following:
   
   User --> Inspire Planner User Equal TRUE
   Record --> Inspire Project --> Project Name Not Equal to a blank value
   Record --> Inspire Project --> Gantt Version Equal LWC
   
   and set "Show component when" to "all filters are true".
   
   By setting the above component visibility, if the Gantt Version in the Project is set to "LWC", then it displays the Portable Gantt Lightning Web Component (LWC) on the page. 
   
   If there is no value in the Inspire Project lookup field, it will simply display a message on screen that the Project does not exist.
   
   
    
6. Click on Save when finished. If you have not yet activated the Lighting record page, you will also need to activate it.

How the Portable Gantt LWC displays on the record

Once the above configurations are complete, when you populate the Inspire Project lookup on the record, it then displays the Project Gantt Lightning Web Component.

Once the Inspire Project look-up field is populated with a Project, then the Project Gantt (Schedule) displays on the record. In the example below, we added the Portable Gantt LWC in its own Tab on the Opportunity Lightning Record page but it can be added to the Record Detail page as well.

Example of the portable Gantt LWC in its own Tab:

Example of the portable Gantt LWC in the Record Detail: