Embed Vainu’s company card into Salesforce CRM with Vainu View iframe solution

Vainu View: 360 company info view on prospects and customers - in your own Salesforce!

Vainu View solution

  • makes Vainu’s company profile data available to everyone in your CRM and shows detailed company information on a daily basis, i.e., salespeople, people working in customer service as well as account managers and people working in customer success. 
  • makes it easy to prepare customer meetings! 

  • NOTE! If you're looking for a simpler way of implementing Vainu View to Salesforce using Visualforce Pages, use these instructions instead! 

Here's tutorial video and written instructions based on the video:


Required user permissions in Salesforce and Salesforce editions for Vainu View

To enable Vainu View to your Salesforce you will need access to the Salesforce Developer Console in order to add iFrame components. You can check which Salesforce Editions include access to the Developer Console and what user permissions are required through the following link 👇



❗️If adding the iFrame doesn't work in the production environment in Salesforce, please try the Sandbox environment! In some cases, the production won't allow the changes

Start with these steps:

  1. First, open any company card from Salesforce. Then, from the menu select Edit and see which field you store company business id in - generally it's the Account Number field
  2. Open the Setup menu and select Edit Object. Select Fields & Relationships and see what is the Field Name for the Field Label (AccountNumber). Save the Field Name for later use.
  3. Go back to the same view you were before and open Developer Console from the Setup menu and from the same window select Edit Page.
  4. Bring Developer Console to front and add a new Lightning Component from File -> Add -> New Lightning Component.
  5. Give the component a name, tick Lightning Record Page active and Submit.
  6. Add new Apex Class component, give it the same name as the name for New Lightning Component. Between brackets, input text quoted below and confirm that the text in AccountNumber is the same as the Field Name in step 2. Remember to save.
public class VainuCompanyView {
public static Account getBusinessID(String accid) {
Account bid = [Select AccountNumber FROM Account Where Id =: accid limit 1];
return bid;

7. Open VainuCompanyView.cmp and from the right side open Controller and replace My action text with the quoted text below. Make sure Field Name is the same as in step 2 and save.

doInit : function(component, event, helper) {

var action = component.get("c.getBusinessID");
"accid": component.get("v.recordId")
action.setCallback(this, function(a) {
component.set("v.bid", "https://app.vainu.io/embedded/"+a.getReturnValue().AccountNumber+"?showAll")

8. Open Component from the right side and paste the quoted text below in the Console. Make sure the controller name is the same as the name of the Lightning Record Page component in step 5. Edit Height and width to match your need and save.

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes" access="global" controller="VainuCompanyView">
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<aura:attribute name="bid" type="String" />
<iframe src="{!v.bid}"

9. Close the Developer Console and refresh the Lightning component list on the left. You can drag and drop the component to your preferred field.

10. Save it and now you should have working Vainu View view on the company card. 🌟


If you added these changes in Sandbox environment remember to deploy it to production by following these instructions from Salesforce HelpCenter: Deploy changesets from sandbox to production 🔁


Should you need more information on our Vainu View solution, chat with us or email at support@vainu.io and we're happy to help you out! 😊