APIs & Integrations

MSpeers
Participant

Custom Card Integration - Where to begin

SOLVE

I need to create a custom integration where we pass certain pieces of data from our 3rd party application into HubSpot. This will have two layers of data, 1 layer will be a few properties at the Company level in HubSpot (maybe just custom properties on the Company object -- external_account_id, Number of Portals, Number of Active Portals, etc.).  Layer 2 is in a 1 to many relationship with the company, 1 company to many portals. These should be matching based on an external_account_id (also including a portal name, application_type, number of transactions, etc.) This does NOT need to be a public application, but I'm not sure if this type of integration is available via a private application in HubSpot. We need to push data periodically into HubSpot, but it will be for internal use. So it can be public if absolutely necessary, but does not need to be.  I've included a mockup using HubSpot custom objects and properties to give a visual of what I'm trying to accomplish via scheduled api calls.

 

The left side properties are at the company level, key being the account id. When in a particular company in HubSpot, I should see the portals associated with it (potentially many) in the main part of the dashboard in tabular format. They are associated via account id. Even in my mock setup, I have manually added data for 3 portals, but only 2 show up that I had to manually associate to the company. They do not automatically populate based on the account_id.  Any ideas on how to achieve this kind of "push integration" and AUTOMATICALLY associate them based on an account id would be greatly appreciated. portal_mockup.png

1 Accepted solution
sylvain_tirreau
Solution
Top Contributor

Custom Card Integration - Where to begin

SOLVE

If you have a Hub Enterprise account, I would do this (this is debatable).

I would create a private application and:
- I would create a custom object (let's use "portals", but change it to a more meaningful name if necessary) in which I would save all the properties I want (external_account_id, portal name, application_type, number of transactions, etc.); you would associate these objects with your companies (you would then have a one-company -> multiple "portals" relationship);

- I would create a UI extension (you have more possibilities on the frontend than with a CRM card): it's in beta, but it gets the job done, especially for a private application.

Of course, you can pass all the data you want and all the mechanisms you want through your private application: you can enrich the properties of your "portals" while making the Hubspot interface communicate with your third-party application.

For real-time data transfer: you can either create webhooks in your application (when an event you choose occurs in Hubspot, it queries one of your scripts), or create buttons in your UI extension to call your scripts, or call these scripts via a Hubspot workflow. You have a plethora of possibilities.

Extension UI -> https://developers.hubspot.com/docs/guides/crm/ui-extensions/overview

Custom objects -> https://knowledge.hubspot.com/object-settings/create-custom-objects

Custom code action -> https://developers.hubspot.com/docs/reference/api/automation/custom-code-actions

Custom workflow actions -> https://developers.hubspot.com/docs/reference/api/automation/custom-workflow-actions

 

View solution in original post

15 Replies 15
Nhal
Member

Custom Card Integration - Where to begin

SOLVE

Gotcha! Sounds like you're juggling internal data sync with a custom 1-to-many model inside HubSpot.
Totally doable. Quick q: do you already have a HubSpot Enterprise plan? That’ll unlock custom objects, which is key for the "Portals" layer.

If yes, here's your 2-minute quick win:

Go into HubSpot > Settings > Objects > Custom Objects and create one called portal (or whatever works).

Add custom properties like portal_name, application_type, num_transactions, etc.

Use the CRM associations API to link each portal object to a company via the shared external_account_id.

I once wired up a similar sync using a private app + cron job hitting the Custom Objects API. Worked great. Just make sure you map internal IDs to HubSpot’s internal IDs early on—saves headaches later.

Ping back once you hit the API part, happy to help with payloads or auth setup 👍

0 Upvotes
sylvain_tirreau
Top Contributor

Custom Card Integration - Where to begin

SOLVE

Hi,

 

So, without further details, I'd say you can definitely create a private application, no problem.

 

One question before I can answer you: do you even have an Enterprise hub?

MSpeers
Participant

Custom Card Integration - Where to begin

SOLVE

Thank you @sylvain_tirreau  for your reply. Yes, I believe our sales team has an enterprise account. I have a developer account.  As an alternative to my post above, would it be possible to build a private app (because this only mentions a public app, https://developers.hubspot.com/docs/guides/api/crm/extensions/crm-cards) and then create a CRM card to query data from the external application in real time instead of pushing data from our external application into HubSpot periodically?

sylvain_tirreau
Solution
Top Contributor

Custom Card Integration - Where to begin

SOLVE

If you have a Hub Enterprise account, I would do this (this is debatable).

I would create a private application and:
- I would create a custom object (let's use "portals", but change it to a more meaningful name if necessary) in which I would save all the properties I want (external_account_id, portal name, application_type, number of transactions, etc.); you would associate these objects with your companies (you would then have a one-company -> multiple "portals" relationship);

- I would create a UI extension (you have more possibilities on the frontend than with a CRM card): it's in beta, but it gets the job done, especially for a private application.

Of course, you can pass all the data you want and all the mechanisms you want through your private application: you can enrich the properties of your "portals" while making the Hubspot interface communicate with your third-party application.

For real-time data transfer: you can either create webhooks in your application (when an event you choose occurs in Hubspot, it queries one of your scripts), or create buttons in your UI extension to call your scripts, or call these scripts via a Hubspot workflow. You have a plethora of possibilities.

Extension UI -> https://developers.hubspot.com/docs/guides/crm/ui-extensions/overview

Custom objects -> https://knowledge.hubspot.com/object-settings/create-custom-objects

Custom code action -> https://developers.hubspot.com/docs/reference/api/automation/custom-code-actions

Custom workflow actions -> https://developers.hubspot.com/docs/reference/api/automation/custom-workflow-actions

 

MSpeers
Participant

Custom Card Integration - Where to begin

SOLVE

Thanks for the guidance. I have created a mock private app, and a UI extension using one of the starter templates.  This screenshot shows exactly what we need.  Is it possible to have the extension just call an endpoint in our 3rd party system to retrieve the data in real time so no data sync/transfer is needed?  So on navigating to a company record, the card calls our external endpoint passing the company id to fetch the data it needs... If possible, this is the best scenario, our data can remain outside HubSpot and be a single source of truth, always up to date/accurate.new-portal-mockup.png

sylvain_tirreau
Top Contributor

Custom Card Integration - Where to begin

SOLVE

Hi,

 

Your approach is classic when it comes to security and data management (don't duplicate data), and the good news is that you can do it with Hubspot, of course. Take a look at the documentation here.

 

You'll notice that you must use serverless functions to do it if your app remains private, and that you can use a mechanism on your servers (my preferred approach as a developer) only with a public application.

 

You should know that you can create a public application without putting it on the marketplace (so no one has the installation URL) and by implementing a throttling system that prevents it from being used by anything other than your servers (that allows you to sleep well ;)).

 

Best,

MSpeers
Participant

Custom Card Integration - Where to begin

SOLVE

So if I understand correctly, I must use a public application. We are not using a cloud provider so I don't think serverless functions are an option, is that correct?  Now, I created a public app locally, but I cannot upload it to HubSpot. It's telling me I don't have access to the beta.  I have followed the quickstart (no mention of which beta and how to add it). I've been in the Product Updates section and am blindly scrolling through available betas.   Any idea which one I need? I see a few related to UI Extensions but it already says everyone is a member of the beta.  Here's my error, image.png

sylvain_tirreau
Top Contributor

Custom Card Integration - Where to begin

SOLVE

About architecture:


You have three elements in a public application: 1) HubSpot's internal mechanics (permissions, domain rights, API access, etc.); 2) your own mechanics, which are run via scripts in Python, Node, PHP, etc.; these mechanics are located on your own server; 3) a third-party service (another API, data you have in a cloud, etc.).

1 and 2 are mandatory. 3 is optional.


In a private application, you only have points 1 and 3, with the serverless functions replacing your server.


So you first need to ask yourself the following questions:


1) Do I have a server where I can host my Node, Python, PHP, etc. scripts? If not, use a private application and serverless function.


2) Can I afford a slightly larger learning curve than with private applications? If not, use a private application.


Then to have access to the beta, you must go to your *developer* account(1), in the settings at the top right, then you click on "Product updates" in the left side menu, you preselect "In beta", and you search for "Build App Cards Powered by UI Extensions with CRM Dev Tools", and there you register for the beta.

____
1. Be careful: you upload your project/application to your developer account, then you install the application on your production site (but do it on your test site at first - you create a test portal in your developer account, in the left menu "test account").

MSpeers
Participant

Custom Card Integration - Where to begin

SOLVE

When I search for exactly that phrase in the "In beta" section it finds no results. If I just search for App Cards, it finds "Build app cards (UI Extensions) for help desk ticket sidebars" but that is not it and it says it's a public beta that everyone is enrolled in already.  I'm completely stuck. Perhaps the messaging is wrong?

0 Upvotes
sylvain_tirreau
Top Contributor

Custom Card Integration - Where to begin

SOLVE

Are you doing this search in your developer portal (https://app.hubspot.com/signup-hubspot/developers) and not in the portal in which you will need to display the data you are talking about?

Also check that you are super admin.

MSpeers
Participant

Custom Card Integration - Where to begin

SOLVE

Hi, yes I did the search from my developer portal.

sylvain_tirreau
Top Contributor

Custom Card Integration - Where to begin

SOLVE

Hi,

 

Here is what I see in my developer account:

WhatsApp Image 2025-05-22 at 10.54.04.jpeg

 

And what I see with my test account:

WhatsApp Image 2025-05-22 at 10.55.06.jpeg

Does this help you?

MSpeers
Participant

Custom Card Integration - Where to begin

SOLVE

I see the same and it says everyone is part of the public beta but I still get the error that I don't have access to the beta when trying to upload the project.

0 Upvotes
sylvain_tirreau
Top Contributor

Custom Card Integration - Where to begin

SOLVE

Double-check that you're actually trying to upload your project to your dev portal. This is the step: https://developers.hubspot.com/docs/guides/crm/setup#connect-your-hubspot-account.

Double-check this entire step, especially the box that begins with "Your account's personal access key must include the following minimum scopes to avoid errors during local development:".

0 Upvotes
BérangèreL
Community Manager
Community Manager

Custom Card Integration - Where to begin

SOLVE

Hi @MSpeers, I hope that you are well!

Thanks for reaching out to the HubSpot Community and for the helpful screenshot!

To start with, I'd like to share these articles that might be of interest:

- Create cards to display data on records
- Add and manage app cards (BETA)

Also, I'd love to put you in touch with our Top Experts: Hi @sylvain_tirreau, @zach_threadint and @Anton do you have suggestions to help @MSpeers, please?

Have a wonderful day and thanks so much in advance for your help!
Bérangère


HubSpot’s AI-powered customer agent resolves up to 50% of customer queries instantly, with some customers reaching up to 90% resolution rates.
Learn More.


Saviez vous que la Communauté est disponible en français?
Rejoignez les discussions francophones en changeant votre langue dans les paramètres! !