No-Code Dashboard: Two Simple Steps to Add Login Form to Versoly Websites

All new Cotter No-Code Dashboard: Add magic link to your Versoly site in 2 simple steps!

In this tutorial, we will be using Versoly to create a beautiful landing page for your business. Quick PSA though, our friends at Typedream offers a better, simper, beautiful landing pages / sites with a Notion-like editor. Their AI Web Builder will handle your SEO, copywriting, design and overall web experience. However, if you want to stick with Versoly, you’ll need a few things in advance:

1. A Versoly account, register here
2. A Cotter account

Step 1: Create a landing page in Versoly with a call to action button

In this case, the call to action button is the Get Started Now button.‌

Step 2: Connecting the login form to our landing page

All we need to do now is to connect the form to the call to action button inside our landing page. We do this by setting the landing page’s Get Started Now button URL to the link provided by Cotter. Here’s what you need to do:

1. Go to Cotter’s dashboard > Projects > Forms & Fields, then click on the “Login Link” button, press the copy to clipboard icon. Make sure you chose the correct form in the dropdown.
2. Go to your Versoly editor, click on the button, then paste in the URL input section on the right side toolbar.‌

Finally, copy the following code to your External Scripts Site Settings.‌

<!--Get Cotter JS SDK-->
<script
    src="https://unpkg.com/cotter@0.3.31/dist/cotter.loader.js"
    type="text/javascript"
    data-cotter-api-key-id="<YOUR-API-KEY-ID>"
></script>

Save and publish your Versoly site!

You’re done 🎉

You can save the project and publish it. You should be able to log your users in.