Forms are essential tools for collecting information, managing registrations, and processing payments. They are easy to use and offer flexible customization options tailored to your needs. This article walks you through every step of creating, customizing, and integrating forms on CrocoClick.

Why use forms?

Forms are ideal for:

• Collecting information: such as prospect contact details or booking information.

• Managing registrations: whether for events or online courses.

• Processing payments: easily integrate payment options to provide a seamless user experience.

Unlike surveys, forms are static and do not support complex conditional logic. They are therefore perfectly suited for simple, straightforward data collection.

Use case: Create a form to capture contact information

Introduction to the form builder

The CrocoClick form builder is divided into three main tabs:

1. Generator – Create or edit your forms.

2. Analysis – View responses with charts and statistics.

3. Responses – View and sort received responses. You can search for a specific response by name, email, phone number, or contact ID.

Step 1: Create a form

1. Access the form generator:

   • Go to Sites > Forms and click + New Form.

   

2. Start from scratch or use a template:

   • Start from scratch: Create a fully customized form.

   • Templates: Select a pre-designed template to save time.

Step 2: Add and organize your form fields

1. Edit the title: Click the pencil icon next to the form name to customize it.

   

2. Add elements: Use the + sign on the left to access available fields and drag them into your form.

   • Quick Add: Access standard fields such as Name, Email, Phone, etc.

     

   • Custom fields: These are fields you can create, which will then be automatically saved in the custom fields section. These fields will remain available for future forms, allowing for reuse and centralizing the collected information.

   

3. Edit and delete elements:

   • To edit, click on the element and adjust the settings on the right.

   • To delete, click on the item and press the X.

Step 3: Configure submission options

Configure what happens after the form is submitted:

1. Confirmation message: Display a thank-you message.

2. Redirect to a URL: Direct the user to a specific page after submission.

3. Order confirmation: For payment forms, display a confirmation page

Step 4: Add a payment element and configure order confirmation

CrocoClick forms can be used to collect payments directly, whether for selling products, services, or subscriptions. This feature allows you to turn your form into a complete sales tool, with automatic order confirmation. Here’s how:

1. Add the Payment Element:

   • In the form builder, click the "+" sign to view all elements and select Collect Payment.

     

   • Drag it to the desired location on your form.

   

2. Configure Payment Settings:

   • Click the icon on the right, then go to Options.

   • Under "Upon Submission," select "Order Confirmation" to enable an automatic confirmation page after a successful submission and payment.

   

3. Configure Order Confirmation:

   • Click on the payment item you added to access its settings.

   • Configure product options, prices, and any other relevant payment details. This configuration allows your form to accept payments upon submission.

Step 5: Add logic (optional)

Conditional logic allows you to customize your form’s behavior based on users’ responses. It’s particularly useful for creating a dynamic, tailored user experience. Unlike surveys, conditional logic in forms is simpler and more limited, making it ideal for basic use cases such as displaying messages or redirecting users.

1. Accessing Conditional Logic

   • Click the logic icon (next to the + sign) to view the available options.

   

2. Configure Conditional Logic Actions: You can configure several actions based on user responses:

   • Redirect to a URL: This option allows you to redirect users to a specific URL (for example, a thank-you page or a special offer) based on their response to a particular field.

   • Display a Custom Message: Display a message based on the responses provided. This can include additional instructions or confirmation messages based on users’ choices.

   • Disqualify a Prospect: You can set specific criteria to disqualify a prospect (for example, if a user enters a value that does not meet your criteria). When this happens, the prospect receives a message explaining why they cannot proceed further or is redirected to another page.

   • Show/Hide Fields: Set up rules to show or hide specific fields based on the answers provided in a previous field. For example, if a user answers “Yes” to a question, an additional text field may appear to request more details.

Step 6: Customize Your Form’s Style

On the right side, click the icon on the right, then go to "Modes" to edit:

• Layout: Input style, width, field spacing, label alignment, etc.

• Footer: Add an image that covers the entire page. You can customize colors, add a background image, or add a header image

• Miscellaneous: You can enable or disable the agency’s branding image.

• Advanced settings: These include forms, text fields, labels, short labels, placeholders, and custom CSS

  

Note: Ready-to-use themes:

• Under Themes, you can choose from a wide range of professionally designed themes suited to different styles and purposes.

• All themes come pre-configured with a background, field style, font, size, button design, and more. Below is an example of what the Marine Azul theme looks like.

  

Step 7: Notifications and Auto-Responder

1. Enable notifications: Receive email notifications every time someone fills out a form.

2. Autoresponder: Enable the autoresponder to automatically send the prospect a submission email containing a copy of the information they submitted.

   

Step 8: Embed your form into your website or funnel

Once your survey is ready, you can use it on any CrocoClick website or funnel using the “survey” block in the page builder.

And if you want to use your survey elsewhere, click Embed to get a link or embed code.

• The embed code can be included on an external website.

• The link can be pasted into an SMS or email.

  

Step 9: Use version history (optional)

Version history allows you to restore a previous version of your form if you want to revert to a previous state.

Step 10: Analyze submissions

Go to the Responses tab to view all responses. You can sort and search by contact (name, email, phone number) and adjust the visible columns according to your needs.

Conclusion

CrocoClick forms are a powerful tool for managing interactions with your prospects and customers. Easy to set up, they allow you to collect information, manage payments, and create personalized experiences with a variety of submission options. Feel free to explore all the options to tailor the forms to your business’s specific needs.