Hi, in this article, we will show you step by step on how to integrate our drop-in Signup component into your website or application.
Integrating individual signup embeds into different pages is a completely optional feature if you have already integrated our Pricing embed. In that case you only need to Build the Signup form with the fields you need.
If you are looking for information about configuring the embed code, read this article
You might want to use this signup embed feature if:
- You send individual service signup pages to your customers.
- You have services that aren't listed publicly on your website through our Pricing embed system.
- Or anything that you could think of that requires a separate signup form to fit your use-case.
1. Select (or create) a template
On the left-hand sidebar, navigate to Embeds, then click the Checkout Page widget. At the top is a drop-down menu where you can see the service offering template(s) you have already created. If you do not see any templates, you must create a service offering.
2. Build your signup form
There are many options available for your checkout page when you click Add Custom Field. To add a password or other secure information to your signup form, select the Secure String option from the drop-down menu. As standard, signup forms come with an email field, and a password field (along with password validation field).
You can also use custom fields to include add-on purchases, such as a checkbox for the user to add an additional option to their subscription.
Enter your Custom Property Label in the field (for example, "Password" if prompting the user to enter a password) that will be displayed to the customer when they sign up.
There are three symbols next to this drop-down. Hover over them to read the tooltips. Select Prompt User if you want the user to be prompted to enter information (such as a password) or Required if they cannot proceed until they enter that information.
The Default Value field is the text that will appear in the field by default before the user inputs their own information.
When you are satisfied, save your checkout form.
Note: If you are using ServiceBot's pricing page embed on your website for this service already, the pricing page will link to this checkout form when the user clicks on a tier and you do not need to embed this. If not, proceed to the next step.
3. Embed it
If your service has multiple tiers and pricing plans, you will need to create an embed for each tier and pricing plan (this is only if you are not using ServiceBot's pricing page embed on your website already; read How To Embed A Pricing Page for more information).
Select the tier and pricing plan for the checkout page you wish to create an embed for, and copy the code to paste onto your webpage. For more information about how to configure this embed, check out this article
Note that you can change the code to require credit card information or a password in the signup form.