Online Event Registration Made Easily Without Codingby@olivian-stoica

Online Event Registration Made Easily Without Coding

by Olivian StoicaNovember 14th, 2019
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

Here are steps for building an online event registration process on your website without needing coding skills. Get started right away!

Companies Mentioned

Mention Thumbnail
Mention Thumbnail
featured image - Online Event Registration Made Easily Without Coding
Olivian Stoica HackerNoon profile picture

Most of the events I participated at got my attention on Facebook. I believe it’s the same in your case. If it’s not Facebook, it’s through colleagues or friends. Which most probably learned about the event from Facebook, or other friends. 

In any case, building awareness about your event is not as hard as creating the registration process itself - assuming, of course, that it’s a closed event. 

Let’s start with a use case.

Let’s say I want to organize a course about SEO in a venue that has 50 seats max. And, to be able to buy some refreshments for the attendees, I’ll need to collect a small fee from each participant. 

All cool and dandy up here. But now, I need to start building the form and its workflow. 

A functioning and good registration form for such an occasion should have:

  • A clean design (lots of spacing and good contrast between form elements)
  • Field validation with human-words for the error handling
  • A title
  • Details about the event: time, place and location
  • Field inputs: Name, Email, Phone
  • Form controls - in forms of questions: "How skilled are you in SEO?", "Have you ever worked with SEO before?", "Do you want to be updated about future events?"
  • A map of the location
  • A payment processor
  • A personalized confirmation message
  • An auto-reply email message 
  • A CRM system
  • A database (SQL or other)
  • A straightforward call-to-action submit button

Doing all the above in code could be fun or cumbersome - depending on your skills. I’ll need HTML, CSS, jQuery and PHP for the form alone. Not to mention the fact that I’ll need to work with the API of the CRM system of my choice - let’s presume it’s MailChimp.

Then there’s the payment processor, which in this case can be PayPal. Can you imagine the lines of code? I know I can. In fact, I’m not even proficient in coding past HTML and CSS.

However, let's assume that I am capable of coding everything. Do you think I would waste hours and hours of scripting the entire registration process? 

Here’s what I’ll do: I’ll create my event registration form with an online tool such as 123FormBuilder. It will take less time and I can do all of the above without getting lost in hundreds of lines of code. 

First of all, I’ll need to outline the form which will contain the fields:

  • Name
  • Email
  • Phone
  • Q1: How skilled are you in SEO?
  • Q2: Have you ever worked with SEO before?
  • Q3: Do you want to be updated about future events?
  • Google map

    I’ll do this by creating a blank form or by customizing a template in the form editor.

Next, I’ll need a form design that will match my website. I’ll play with the many design options available or use the custom CSS panel.

Now, that I have the form created, I can configure the field validations and error messages. 

It’s no secret that shorter forms convert better. I can switch between my questions and create a conditional logic that works as follows:

IF “Have you ever worked in SEO before?” = “Yes” THEN Show “How skilled are you in SEO?” 

This way, the form is shorter and people won't get scared off to easily.

Now it’s time to limit the number of entries, since I have only 50 seats available. So I will use the limit the number of submissions option and set the limit to 50.

This will guarantee that the first person that accesses the form after the cap has been achieved will get notified of the seats being already booked.

The fee. Since I want to collect payments in PayPal, I can use the already built-in integration within the tool.

Unfortunately, since 123FormBuilder is not PCI compliant, all payments are handled on PayPal’s side. That means that participant will be required to submit the form and complete payments on PayPal's checkout page.

Now, to save the email in MailChimp. I’ll just use the integration provided by 123FormBuilder which will save each email in a mailing list of my choice. From MailChimp, I’ll be able to send out newsletters and other updates.

There’s even an option to use webhooks, in case you want to send the form data to your server. Keep in mind though, that 123FormBuilder creates an HTTP head request to validate the URL of your script. Make sure you support them.

Last, but not least, the email notifications and auto-reply messages. In my personal opinion, you should always use auto-reply messages, no matter what your form is for. It assures the sender that the message has been delivered. 

In this case, my attendees need assurance that their seat is booked, since they paid for it.

Everything that I did above with 123FormBuilder is compiled in a sweet JS snippet that I can just copy and paste in the source code of my web page - and voila! The event registration form is up and ready. 

As for the database of the form, 123FormBuilder creates a so-called Submission section where I have full control of the data. I can just print or export the list of attendees and put it on my desk before the course starts.

And that’s how easily you can optimize your registration process for any event. 

Are you looking to build a registration form for yourself or a client? Are you going the coding-way or the tool-way? 

Whatever you choose, always try to find a solution that makes you work less, but brings you more results.