Embed in web app

introduction this page describes how to integrate the plug in within your website and get started performing health scans prerequisites make sure you're able to obtain a valid plug in url, by following the explanation in our plug in url docid\ wcs2y1mg2pqnl4r4mgg z page iframe html component now that you've obtained a valid plug in url, the web application can be embedded in your website by loading it into an iframe html component an iframe or inline frame is used to embed another document within your current html document add the plug in as an iframe to your website as follows take into account the additional attributes, which are further described below html intelliprove integration welcome to intelliprove explore intelliprove face scan seamlessly integrated into your website for the face scan plug in when to dismiss the face scan plug in iframe? when a user completes a face scan and clicks to continue, your platform should respond appropriately for example, you could transition to a new page displaying the scan results or our health dashboard docid\ hnrkfuxwrzggwqxtvxl24 to determine when to proceed, listen for post messages sent by the face scan plug in for instance, the dismiss message signals that the face scan was completed refer to our message events documentation for more details about these events message events docid\ kz6xsnd6v4g8efcgd02ib it's important to note that you might also receive a dismiss event if the user ends the face scan without successfully completing it, for example, due to unfavorable conditions the 'hasresults' attribute will be false in this case we recommend accounting for this in your user journey design, for example by adapting the content accordingly camera access our face scan plug in requires access to the device's camera make sure the allow="camera" attribute is added to the iframe html tag \<iframe src="your webplugin url" allow="camera">\</iframe> when the user first visits your website, the site will request permission to use the user's camera if the user doesn't grant permission, a pop up is shown indicating that a measurement cannot be started the user is then presented with two options they can click the try again option, in which case the permission is requested again through a modal they can click continue in this case, a message event of the type userfinished is sent to you you can use this to handle this situation as you desire for example, you may redirect the user to an information page explaining how the health scan works, or to your homepage for more information, refer to message events docid\ kz6xsnd6v4g8efcgd02ib minimal dimensions the intelliprove plug in components require minimial dimensions to be correctly displayed below are some recommendations to help you optimize these settings below a certain available height, there may be insufficient space available to display all content, which may result in a double scroll bar (scroll bar within the iframe) this can be undesirable for users to prevent this, set the iframe’s screen height to 100% and make sure the containing element has enough height to display all the content in the iframe the required height will vary based on the selected width this will ensure that all text and action buttons are fully visible without triggering an extra scroll bar the face scan plug in has minimum dimensions if these dimensions are not met, the plug in will not display consider these carefully when designing the area for the face scan plug in minimal width 300px minimal height 500px optional css parameters to seamlessly embed the iframe in your html code, add additional styling parameters to the iframe html tag note the web plug in's temporary behaviour implies that the iframe's src attribute should be set from the js code dynamically next steps 1\ determine the intended use case and user flow and display the results h ead to our embed health insights docid\ f2 0ikisgfy3c5l181vv9 page this includes things like establishing communication between your own app and the plug in this may be useful to track the user's progress within the plug in, or to obtain the results in json format for further analysis or linking actions visualizing the results for your users 2\ customisation to allow for seamless integration of the plug in in your website, matching your brand's colours and fonts, please visit our white labelling docid\ vzz odplrstmbhthzklld documentation