Embedding in Salesforce

  • Availability
    • Plan: All
  • Roles and Permissions
    • Admins only


For this to work you will need:

  • ProdPad Admin account 
  • Salesforce Admin account 
  • An active custom domain in Salesforce

Create a published roadmap or portal

Begin by creating a published roadmap or customer feedback portal. Once you're ready, grab the embed code from the available slide out.

Create a new VisualForce Page 

In Salesforce, go to the Setup page. On the QuickFind type "Visualforce" and select Visualforce Page.

Click on "New" on the table.

Give your new page a label, name and description.

Make sure you select the option to make it available in Lightning.

Creating a new VisualForce Page

On the Visualforce Markup section, remove the content placeholders <!-- Begin Default Content REMOVE THIS -->and. Between theh1tags give your new page a title.

Just below, drop the embed code we've provided you. It should look something like this:

Embed the code you were provided with

If you're comfortable with HTML, feel free to add any added text or content above or below the embed code.  You can preview the page by clicking on the "preview" button below.

Top Tip

Once you've saved, go back to the Visualforce Pages table and under "Security" enable it for everyone that should have access to view the component.

Create a new Lightning App

Back in the Setup search, look for "Lightning App Builder."

You have two options - you can either modify an existing Dashboard or create a new one.

For this example, I have decided to modify the existing Home page, in order to add my roadmap as part of the existing tab.

Edit the template

To make way for the roadmap, begin by changing the template from "Standard Home Page" to "Header and Three Regions" on the right-hand pane.

Creating a new Lightning App

Then move the Quarterly Performance report to the new middle component section.

Move the Quarterly Performance report

Embed Visualforce Component

Now that the template is ready, it's time to embed your component!

Select "Add Component" on the empty space available on your template and select Visualforce component from the available list.

On the right hand menu you should now see the roadmap Visualforce page you created. Feel free to adjust the height to fit the roadmap accordingly (suggested 1000 pixels if embedding a roadmap, 500 if embedding a general portal form, although the component will be scrollable!)

If you refresh your home tab, you should now see your embed code.

Refresh your home tab to see your embed code

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us