Quick Start
Adding the Enzoic Password Strength Meter to your existing signup or password change form is simple.
Add the following script include before your closing body tag:
<script async type="text/javascript"
src="https://cdn.enzoic.com/js/enzoic.min.js" />
Add the “enz-enable” attribute to your signup form’s password input element:
<input type="password" enz-enable />
Alternatively, you can call the applyToInputElement function:
<script type="text/javascript">
var passwordEl = document.getElementById('id_of_your_password_input');
Enzoic.applyToInputElement(passwordEl);
</script>
Delete any existing password strength meter from the page, as you will no longer need it.
Add in code to prevent the user from submitting the form if the password strength is insufficient. The mechanism for alerting the user will be specific to your page, but a basic code snippet in JavaScript for this is below:
// typically this is the onsubmit event handler for your signup form
function formSubmit() {
// check if the current password meets your desired
// strength score (strong in this case)
if (Enzoic.currentPasswordScore <
Enzoic.PASSWORD_STRENGTH.Strong) {
// password is not strong enough, do something
// here to indicate to the user that they must
// improve their password's strength before they
// can move on
}
}
You’re done! When you reload the page, your password input will now have the Enzoic frame around it when it is focused.
Last modified 1mo ago