Verify Via Button

1. Package Installation

  • After ARGOS ID package is installed, you can create a button to call the modal window.

  • To create ARGOS ID button, insert 1 CSS file, 1 JS file and <argos-id> tag to the Head Tag.

  • You can write codes in Java, Python, JSP, PHP, Ruby, Asp, JavaScript.

1-1. Setting Head

  1. To create an ARGOS ID button, <argos-id></argos-id> tag is needed.

  2. To use the tag, 1 CSS file and 1 JS file should be added as shown below.

<head>
		<script defer src="https://id.trustargos.com/bundle.argos-id.js"></script>
		<link href="https://id.trustargos.com/static/css/argos-id.css" rel="stylesheet">
</head>

1-2. Creating ARGOS ID Button

  1. Should be writtne in <body></body> tag.

  2. There are 4 attributes for <argos-id></argos-id> tag.

  3. 'id' and 'project' are required.

  4. 'chains' and 'button-style' are optional, default value will be set when they are empty.

    • When 'chain' is not desgnated in the code, the options set from the dashboard will be applied.

    • 'chain' stated in the code has higher priority than the one from the dashboard.

    • For the 'chains' value, bsc/eth/klay/matic/sol are available. They all should be seperated with a comma(,) and all should be in lower characters.

    • 'chains' can be text but when it needs to dynamic, use dynamic variables.

    • For 'button-style', CSS won't be applied. Please designate it as a variable and apply CSS.

1-3. Code Examples

  • With only <argos-id></argos-id> tag, the button won't be created. Options must be set between <script></script>.

  • <script></script> tag shold be written under the <argos-id></argos-id> tag.

1-3-1. Basic Code

<argos-id 
		id = "{id}"
		project = "{projectId}"
		>
</argos-id>

1-3-2. Option Applied Code

  • To set the property dynamically, specify it as variable and apply the options.

  • <script></script> parts are examples.

<argos-id 
		id= "{id}" 
		project ="{projectId}"
		button-style = "{button-style}"
		chains = "{chains}"
>
</argos-id>
<script>
    const argosIdButton = document.getElementById('id');
    const chains = "bsc,eth,klay"
    argosIdButton.setAttribute('chains', chains)
    argosIdButton.setAttribute('button-style', '{"backgroundColor":"blue", "color":"white"}')
</script>
EX)
<argos-id 
		id="argos-id-button"
		project ="projectId"
		button-style = "{button-style}"
		chains = "{chains}"
>
</argos-id>
<script>
	if (window.location.href.includes('eth') {
				const argosIdButton = document.getElementById('argos-id-button');
		    argosIdButton.setAttribute('chains', 'eth')
	}
</script>

Last updated