Configuration
Bellow is a complete list of all configuration parameters available for Metamap button and direct link.
Client Id
Can be used as: html attribute
url parameter
configuration field
Type: string
Required
Used to identify you as a merchant.
<metamap-button clientid="your_client_id"></metamap-button>
https://signup.getmati.com/?merchantToken=your_client_id
const verification = new MetamapVerification({
clientId: 'your_client_id',
});
Flow Id
Can be used as: html attribute
url parameter
configuration field
Required
Type: string
Used to identify which workflow to load for verification.
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
></metamap-button>
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id
const verification = new MetamapVerification({
clientId: 'your_client_id',
flowId: 'your_flow_id',
});
Identity Id
Can be used as: html attribute
url parameter
configuration field
Type: string
Used for facematch service. Learn more about Facematch tool here.
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
identityid="user_identity_id"
></metamap-button>
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&identityId=user_identity_id
const verification = new MetamapVerification({
clientId: 'your_client_id',
flowId: 'your_flow_id',
identityId: 'user_identity_id',
});
Verification Id
Can be used as: html attribute
url parameter
configuration field
Type: string
Used to continue already existing verification.
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
identityid="user_identity_id"
verificationid="user_verification_id"
></metamap-button>
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&identityId=user_identity_id&verificationId=user_verification_id
const verification = new MetamapVerification({
clientId: 'your_client_id',
flowId: 'your_flow_id',
identityId: 'user_identity_id',
verificationId: 'user_verification_id',
});
⚠️ Note: Requires identity id to be specified in order to work
Color
Can be used as: html attribute
url parameter
Type: string
Verification accent color can be customised. By default accent color is set to blue
.
Color parameter can accept predefined color values or hex values.
name | hex value |
---|---|
blue | #507DED |
green | #00B257 |
red | #EB5757 |
pink | #FF527E |
orange | #F2994A |
yellow | #FFBD00 |
Predefined values
<!-- using predefined values -->
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
color="blue"
></metamap-button>
<!-- using hex values -->
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
color="#507DED"
></metamap-button>
// using predefined values
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&color=blue
// using hex values
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&color=507DED
Text Color
Can be used as: html attribute
url parameter
Type: string
Verification accent contrast color can be customised. Bu default this value is computed to be a contrast color of accent color.
Color parameter can accept predefined color values or hex values.
<!-- using predefined values -->
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
textcolor="red"
></metamap-button>
<!-- using hex values -->
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
textcolor="#EB5757"
></metamap-button>
// using predefined values
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&textColor=red
// using hex values
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&textColor=EB5757
Predefined values
name | hex value |
---|---|
blue | #507DED |
green | #00B257 |
red | #EB5757 |
pink | #FF527E |
orange | #F2994A |
yellow | #FFBD00 |
Icon
Can be used as: html attribute
Type: string
Metamap button icon can be customised.
To hide icon set parameter value to none
.
To display custom icon set parameter value to image URL.
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
icon="icon_url"
></metamap-button>
⚠️ Note: This only applies to icon on the button itself, Metamap branding inside verification won't be affected.
Language
Can be used as: html attribute
Type: string
Metamap button language can be set using language parameter. By default Metamap button picks language from the browser. Defaults to en
.
Available options are en
, fr
, es
and pt
.
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
language="es"
></metamap-button>
⚠️ Note: This wont affect verification itself.
To fix a language in the verification screens you can add the parameter fixedLanguage
in the metadata.
<script src="https://web-button.metamap.com/button.js">
</script>
<metamap-button
clientid="your_client_id"
flowId="your_flow_id"
language="es"
metadata='{"fixedLanguage":"es"}'
/>
Metadata
Can be used as: html attribute
url parameter
configuration field
Type: string
object
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
metadata='{ "key": "value" }'
></metamap-button>
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&metadata={"key":"value"}
const verification = new MetamapVerification({
clientId: 'your_client_id',
flowId: 'your_flow_id',
metadata: {
key: 'value',
},
});
Redirect
Can be used as: url parameter
Type: string
Used to redirect user to a url after verification process is completed.
redirect
parameter - used to specify URL
target
parameter - used to specify target. Acceptable values are _self
, _blank
, _parent
, and _top
, defaults to _blank
.
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&redirect=redirection_url&target=_blank
⚠️ Note: Redirection domains should be whitelisted. Learn more about whitelisting redirection domains here.
Configuration Id
Can be used as: html attribute
url parameter
configuration field
Type: string
Used to specify ODC configuration id. Learn more about ODC here.
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
configurationid="your_odc_id"
></metamap-button>
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&configurationId=your_odc_id
const verification = new MetamapVerification({
clientId: 'your_client_id',
flowId: 'your_flow_id',
configurationId: 'your_odc_id',
});
Encryption configuration Id
Can be used as: html attribute
url parameter
configuration field
Type: string
Used to specify encryption configuration id. Learn more about Custom encryption here.
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
encryptionconfigurationid="your_encryption_configuration_id"
></metamap-button>
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&encryptionConfigurationId=your_encryption_configuration_id
const verification = new MetamapVerification({
clientId: 'your_client_id',
flowId: 'your_flow_id',
encryptionConfigurationId: 'your_encryption_configuration_id',
});
Reload persistance
Can be used as: html attribute
url parameter
configuration field
Type: boolean
Prevents creation of new verifications if browser tab reloads. Defaults to false
.
If set to false
Metamap will resume verification on page reload in the same tab until user finishes verification or closes the tab.
If set to true
Metamap will create new verification each time page is reloaded.
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
nopersist="true"
></metamap-button>
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&nopersist=true
const verification = new MetamapVerification({
clientId: 'your_client_id',
flowId: 'your_flow_id',
nopersist: true,
});
⚠️ Note: If identity and verification ids are specified this wont have any effect on verification.
Debug
Can be used as: html attribute
url parameter
configuration field
Type: boolean
Enables debug mode. Defaults to false
.
<metamap-button
clientid="your_client_id"
flowid="your_flow_id"
debug="true"
></metamap-button>
https://signup.getmati.com/?merchantToken=your_client_id&flowId=your_flow_id&debug=true
const verification = new MetamapVerification({
clientId: 'your_client_id',
flowId: 'your_flow_id',
debug: true,
});
Updated about 1 month ago