Set up a contact form

Contact forms are the best way to offer support at scale. With contact forms you can pre-triage every support request so that when you are in Plain you know exactly what to prioritize.

Plain does not provide you with any UI components or a drop-in script tag. Instead, you use your own UI components and then use Plain's Custom Timeline Entry API. This means you can offer a support experience which truly feels native to your product.

When a contact form is submitted you can do different things depending on your desired behaviour.

Typically you will want to:

• Upsert a customer to get a customer id
• Create a Custom Timeline Entry for the customer you just upserted
• Open an issue so you know what everyone is getting in touch about and how urgent it is

You can however also do other things as part of the form submission like for adding the customer to a group or assigning the customer to someone in your team.

Examples

Contact forms can take any shape and be very specific to your product and customers. Here are just a few examples as starting points for you to then customise.

Example floating contact form

This shows how you might build a very simple floating contact form (bottom right) in NextJS.

View demo ↗ (opens in a new tab) | View source on Github↗ (opens in a new tab)

Example advanced contact form

This shows a much more advanced contact form in NextJS with structured inputs depending on the topic you are getting in touch about and categorisation.

View demo ↗ (opens in a new tab) | View source on Github↗ (opens in a new tab)