Embedding SDK - common issues and their solution

Embedding the SDK marks the final step of your integration creation process. Once, it is embedded your users can view the Flows available and create integrations against them. 

The embed code is already provided for your app, once you create the deployment. You can tweak it according to your app UI. This article talks about the common and the most typical issues that our customers faced during widget embed process and how they can be fixed. Let’s see them below.  

Integration form does not render.

Please confirm that you have the HTML template code (as described in the documentation) available on your web page where the integration form is supposed to be rendered.

Why do I have the HTML template code with such notations "

Please make sure that you apply 'hidden' Use hidden class to x_integry_configs.view_container. Also, you will need to define this class in your own CSS like .hidden {display:none}. SDK has this class defined but sometimes SDK's CSS styles take time to load. During this time the HTML template code remains visible on your page.

HTML template code is not working and template characters give errors in my app.

Are you using a framework that uses some other templating engine? Following are a few tips:

• If your web app is built in angular or react, you will need to escape the templating characters required by Integry SDK. For example, <%integration_name_field%> can be written as <%integration_name_field%  
• If you are using RoR, you may need to escape templating characters, for example, <%integration_name_field%> can be written as  <%%=integration_name_field%> 

How to open the form in edit mode?

There are two ways

• Use  integration.link  in  callback_render_integration_row callback method
• Call SDK method to explicitly open an integration edit form -  integryAppSDK.renderTemplateForm(template_id, integration_id) 

The rendered HTML from SDK is not matching to my app's look and feel.

SDK returns a basic HTML structure that you have full control over. As the SDK's output becomes part of your app, so you can override the CSS styles to make any changes required to match your own app's look and feel.

There are some extra HTML elements being rendered by the SDK, e.g. a few headings that we don't need, etc.

You can simply inspect the HTML returned by the SDK and set the elements to hidden which are not required.

Why do I see an option for the user to connect to my app?

If your app uses API-key-based authentication, then Integry SDK has built-in support to configure the user authentication seamlessly. You simply need to provide  x_integry_configs.app_auth.api_key (please refer to the documentation for more details).