HTML
The HyperText Markup Language or HTML is the standard markup language for documents designed to be displayed in a web browser.
1. To use SAWO Login you would need an API key which can be obtained by creating a project in the sawo dashboard.
2. Once you create your project, you would need to set your project name and hostname.
2.1 For development in a local machine, the hostname should be set to 'localhost'.
If using ''localhost" as hostname is not working for you, try "127.0.0.1"
🤓
2.2 For production, the hostname should be set to your domain
If you are adding your domain do not add 'https://', ''http://', 'www' or even trailing backslash.
Example:
https://dev.sawolabs.com/ should be kept as dev.sawolabs.com3. Copy the API key from the project and keep it safe and secure.
The best practice to store your API key is to store values in .env so that they are not exposed.
4. On your source, create a container for sawo component inside
body tag<div id="sawo-container" style="height: 300px; width: 400px;"></div>
Every added custom field should be accompanied by an
65px increase in the component height.5. Add the snippet at bottom of source inside
body tag<script src="https://websdk.sawolabs.com/sawo.min.js"></script>
<script>
var config = {
// should be same as the id of the container created on 3rd step
containerID: "sawo-container",
// can be one of 'email' or 'phone_number_sms' or 'both_email_phone'
identifierType: "phone_number_sms",
// Add the API key copied from 2nd step
apiKey: "",
// Add a callback here to handle the payload sent by sdk
onSuccess: (payload) => {
console.log(payload)
},
};
var sawo = new Sawo(config);
sawo.showForm();
</script>
Once the SAWO SDK is successfully set up, a login form will be rendered in the provided container as displayed in the picture below:
Last modified 9mo ago