Inlined React

Verifying individuals with the Inlined React Flow can be easily achieved with a short code snippet. You'll only need your template ID which can be found in the Integration Section of your Dashboard.

📘

Looking for v3?

View our migration guide for how to migrate to persona@4.

persona@3 will continue to work for the immediate future, but may not support new features. We recommend everyone upgrade to persona@4 if possible.

Inlining the flow

To permit the Persona iframe to render on your domain, see Security > Embedded iframe.

Persona can be integrated with the following code snippet. Remember to replace templateId with your organization's template ID.

import Persona from 'persona';

const InlineInquiry = () => {
  return (
    <Persona.Inquiry
      templateId='itmpl_Ygs16MKTkA6obnF8C3Rb17dm'
      environment='sandbox'
      onLoad={() => { console.log('Loaded inline'); }}
      onComplete={({ inquiryId, status, fields }) => {
     	  // Inquiry completed. Optionally tell your server about it.
        console.log(`Sending finished inquiry ${inquiryId} to backend`);
      }}
    />
	);
};

When using the persona NPM package, you must also ensure its peer dependencies are installed.

# npm
npm install persona react styled-components
# yarn
yarn add persona react styled-components