All Collections
Connect
Native CRM Integrations
How to Integrate Connect as an iFrame
How to Integrate Connect as an iFrame

A step-by-step guide on how to integrate Dealfront Connect into your daily used systems as an iFrame.

M
Written by Maria Alice Roche
Updated over a week ago

This article gives you a step-by-step guide on how to integrate Dealfront Connect into your daily used systems as an iFrame. Connect can be integrated as an iFrame in many different ways, such as into websites, web applications, and numerous software products like CRM or ERP systems.

About Connect:

Dealfront Connect helps you to get deep insights into your target accounts. Stay up-to-date with detailed information, empowering you to reach out to the right accounts at the right time. Stay ahead of your competitors by using the Dealfront Connect database of 30M+ companies, 89M+ contacts, 500+ attributes, including most current information from commercial registries, company websites, news, and social media.

Requirements:

  • The integration environment uses Google Chrome, Firefox, Safari, Opera, or Internet Explorer (ver. 9 or later) as its internal browser.

  • Javascript is allowed to run.

  • An area of 800 x 600 pixels is required for the iFrame embedding.

Please note: If your CRM does not allow iFrame integration, Zapier can be used to make data sync possible.

Let’s take a look at the steps necessary to integrate Dealfront Connect.

STEP 1: Simple Example of an Integration

Include the following HTML code where you want the iFrame to appear:

<iframe src="https://app.dealfront.com/cn/#/company/1MOJpMdYml" width="800" height="600" frameborder="0"></iframe>

You should now see Dealfront Connect as an iFrame embedded in the location you placed it. Since you didn’t define other parameters, the Dealfront Connect start page is the one that’s displayed by default. You’ll be prompted to enter your password if you’re not already logged into the platform.

STEP 2: Configuration and Parameters

Additional information/parameters will be available in the context of a system integration, such as a CRM system, when the customer record is accessed. In this case, you should see the current record displayed in the iFrame.

To ensure that Connect can determine/display the correct company, further parameters can be defined in the iFrame:

  • companyName*

  • url*

  • streetName

  • streetNumber

  • zip

  • location

  • ustId

  • hrId

  • hrLocation

  • phone

  • fax

*You must add at least one of the following parameters: “companyName” or “url” so a comparison can be made.

All other parameters are optional. However, you should add as many parameters as possible for higher accuracy. If Connect finds more than one result for a data set, it will be presented as a list so you can select the correct company.

<iframe src="https://app.dealfront.com/cn?companyName=Dealfront+Germany+GmbH&url=www.dealfront.com" width="800" height="600" frameborder="0">

STEP 3: Adjusting How the iFrame is Displayed

The display of Dealfront Connect can be customized. All parameters accept the values [true | false]. All “Show” parameters have the default value “true”.

STEP 3.1: Compact Mode

Connect allows for another view apart from the default view. You can define a narrower header to reduce the window size. You can display this by entering the parameter “compactmode” which you can see within the Connect+Salesforce integration. The “compactmode” property limits the height to a maximum of 400 pixels for smooth implementation.

<iframe src="https://app.dealfront.com/cn?companyName=Dealfront+Germany+GmbH&url=www.dealfront.com&compactmode=true" width="800" height="600" frameborder="0">

You should now see Dealfront Connect displayed at the appropriate location. You will be prompted to enter your password if you’re not already logged in.

compactmode = true:

compactmode = false:

STEP 3.2: Navigation

In normal display mode, you can use the following parameters to control whether the top or left menu bars are displayed by default:

  • showTopNav | showLeftNav

Example: Without menu bars

<iframe src="https://app.dealfront.com/cn?companyName=Dealfront+Germany+GmbH&url=www.dealfront.com&compactmode=true&showTopNav=false&tshowLeftNav=false" width="800" height="600" frameborder="0">

The parameters showTopNav and showLeftNav don’t work in compact mode.

STEP 3.3: Widget integration

Widgets are another integration option. This allows individual segments of Connect to be embedded into the integration. To use widgets, you will need to use the following parameters: compactmode and widget. The navigation bar is disabled by default. You can enter one of six values here:

  • info [general company information]

  • employees [employee overview]

  • finances [financial figures]

  • news [news and social media posts]

  • signals [detected signals]

  • hr [trade register information and company organizational chart]

<iframe src="https://app.dealfront.com/cn?companyName=Dealfront+Germany+GmbH&url=www.dealfront.com&compactmode=true&showTopNav=false&tshowLeftNav=false&widget=hr" width="800" height="600" frameborder="0">

Questions, comments, feedback? Please let us know by contacting our support team via live chat or by sending us an email at support@dealfront.com.

RELATED ARTICLES:

Did this answer your question?