Skip to main content

CRM Widget Installation

Follow this guide to install and verify the Core8 CRM widget in HubSpot and Salesforce. It covers the widget-specific setup steps, verification, and common issues.

This page assumes HubSpot or Salesforce is already connected to Core8. To connect your CRM first, use the HubSpot or Salesforce guides.

What you'll do

  • Install the Core8 commission widget inside your CRM so that commission context appears on deal/opportunity records.
  • Verify the widget is working on a known synced deal.
  • Troubleshoot common issues.

What you'll need

  • The CRM integration must already be connected in Core8.
  • The CRM user who opens the widget must map to a Core8 team member.
  • That Core8 user must also have Sales Team access, or the widget will not show commission data.
  • For Salesforce, you also need Salesforce admin access to App Manager, Visualforce Pages, and Lightning App Builder.
Under the hood
  • HubSpot: once HubSpot is connected, Core8 deploys the current CRM card automatically. There is no separate manual placement step inside HubSpot for the current flow.
  • Salesforce: Core8 exposes a Canvas endpoint, but Salesforce admins still have to place the widget on the Lightning page layout for each customer org.
  • Access checks: Core8 maps the CRM user to a Core8 team member before returning commission data. Missing user mapping or missing Sales Team access blocks the widget.

HubSpot widget installation

Core8 currently uses the HubSpot CRM Card flow. The card deploys automatically when HubSpot is connected to Core8.

  1. Start with a HubSpot portal that is already connected to Core8.
  2. Open a known synced deal record in HubSpot.
  3. Confirm you can see the Core8 commission card on the deal record.
  4. If the card is missing, use the troubleshooting section below to re-run deployment checks.

How to verify HubSpot on one known deal

  1. Pick a HubSpot deal that is already synced into Core8.
  2. Open the same deal in HubSpot.
  3. Confirm the Core8 card appears and shows commission values for the signed-in CRM user.
  4. If the card opens but values are blank, confirm that the CRM user maps to the correct Core8 team member and has Sales Team access in Users & Permissions.
  5. Spot-check the same deal in Core8 to confirm the deal exists and has commission activity.

Salesforce widget installation

Salesforce does not auto-place the widget on customer page layouts. Core8 exposes the Canvas app endpoint, but a Salesforce admin still has to enable the Canvas app and add it to the Lightning record page.

One-time Salesforce connected app setup

Note

This setup is performed from the Salesforce org where the Core8 Connected App was originally created (the developer org). It cannot be done from a customer org. If you do not have access to the developer org, contact Core8 support.

  1. In Salesforce, click the gear icon in the top right → Setup.
  2. Go to App Manager → Connected Apps.
  3. Find the Core8 Connected App, click the dropdown arrow → Edit.
  4. Scroll down to Canvas App Settings and enable it.
  5. Set Canvas App URL to {UI_URL}/salesforce-widget/canvas.
  6. Set Access Method to Signed Request (POST).
  7. Enable these locations:
    • Visualforce Page
    • Lightning Component
    • Layouts and Mobile Cards
  8. Click Save.

Customer admin setup

  1. Start with a Salesforce org that is already connected to Core8.

Step A: Create a Visualforce page (one-time)

Canvas apps are not directly available as a component in Lightning App Builder. To display the widget in Lightning Experience, you first create a Visualforce page that wraps the Canvas app.

  1. In Salesforce, go to Setup → type "Visualforce Pages" in Quick Find → click Visualforce Pages.
  2. Click New.
  3. Set the Label to Core8 Commission Widget.
  4. Replace the default markup with: 
    <apex:page>
    <apex:canvasApp applicationName="Core8" width="100%" height="500px"/>
</apex:page>
  5. Check "Available for Lightning Experience, Experience Builder, and the mobile app".
  6. Click Save.
Note

Replace Core8 in applicationName with the exact API name of the Core8 Connected App in your org. This page only needs to be created once. It can be reused on any Lightning record page.

Step B: Add the widget to the Opportunity page

  1. Open any Opportunity record in Salesforce.
  2. Click the gear icon in the top right → Edit Page.
  3. In Lightning App Builder, search for "Visualforce" in the left components panel.
  4. Drag the Visualforce component to the desired location on the page.
  5. In the right panel, select "Core8 Commission Widget" from the Visualforce Page Name dropdown.
  6. Click Save → click Activation → assign as Org Default → Save.
  7. Go back to the Opportunity record and confirm the widget loads.

How to verify Salesforce on one known opportunity

  1. Pick an opportunity that already exists in both Salesforce and Core8.
  2. Open that opportunity in Salesforce after the Lightning page is activated.
  3. Confirm the Core8 widget loads instead of showing an auth or access error.
  4. If the widget loads but shows an access error, confirm the Salesforce user maps to the correct Core8 team member and has Sales Team access in Users & Permissions.
  5. Spot-check the same deal in Core8 to confirm the record exists and commission data is available.

Troubleshooting (common issues)

  • HubSpot card did not appear even though the portal is already connected: reconnect HubSpot from Core8 to force another card deployment attempt, then re-check a known synced deal. If the Core8 app is running on local HTTP, HubSpot card creation is skipped because HubSpot requires HTTPS target URLs.
  • HubSpot card appears but the values are wrong or empty: confirm the deal is synced into Core8 and the signed-in HubSpot user maps to the correct Core8 team member.
  • Salesforce widget shows "Invalid signature": the SALESFORCE_CLIENT_SECRET on Core8 does not match the Consumer Secret of the Connected App in Salesforce. Confirm both values match.
  • Salesforce widget loads an authentication or signature error: confirm the Canvas App URL points to the correct Core8 UI_URL and the connected app is using the same client credentials Core8 expects.
  • Salesforce widget is not visible on the record page: confirm the Visualforce page was created with the correct applicationName, the Visualforce component was added to the Lightning record page, and the page was activated for the intended app/profile.
  • Salesforce widget shows user_approval_required: the Salesforce user has not been approved to use the Canvas app. In Salesforce, go to Setup → Connected Apps → Manage Connected Apps → Core8 → Manage Profiles and add the user's profile.
  • The user can open the widget but gets access denied: confirm the mapped Core8 user has Sales Team access.

External references