Kontakt Form in Bubble App/dynamic static + Email notification

Hello Bubble Community,

I´m currently facing the challange what´s the best plugin/workflow/… for adding a contact Form to your bubble App.

Any experience with good plugins or how do you bestly solve the problem when you want to add a dynamic and static contact form to your app and also that your get a notification to your email account when sb. filled out the contact form ?

Thank you very much

all the best

Marc

Hey @dev17

Thanks for the post and great question!

I would highly recommend building this yourself instead of using a plugin. This sort of functionality is quite achievable using Bubble’s built in featureset and doing it yourself will give a high level of control over the design, functionality etc.

First, you’ll want to build the form. You’ll do this by dragging inputs onto the page. Most of the time, those inputs will be text inputs, but you can also use dropdowns, radio buttons, checkboxes, multiline inputs and more.

Once they’re all on the page in a format you’re happy with, now you’ll want to set up the workflows to run it all. You’ll add a ‘submit’ (or something similar) button that triggers the workflow. What I would recommend would be a submission data type or something similar that stores each time you receive a submission, with one field for each of the inputs you put on the page. Your workflow will most likely have atleast 3 actions.

  1. Create a new submission, where you set each field to the value of it’s corresponding input on the page.
  2. Send an email, where you send yourself an email with any of the values you’d like to receive (2a You might also send an email to the person who submitted the form letting them know you got it)
  3. I typically like to run a reset relevent inputs action to clear the inputs after things have been submitted.
  4. You might consider displaying an alert on the page saying the form was submitted successfully

Give this a try and don’t hesitate to reach out to Support@Bubble.io if we can assist with anything else.

Hey, Thank you very much for that !! Great to hear that. Is there any Way how you can style the Email. So for example when i want to send a user a notification about sth that should be adressed to him. Is there any possibility to style a good form?

Kind regards

Marc

Sure thing @dev17 Happy to help!

Yea, in the email action, you can write that email as desired and can reference dynamic data throughout the email. For instance, you could pull their name from one of the form inputs, pull dynamic data from elsewhere in the app etc.

Past that, you can use Sendgrid to create a legacy template in their system to make sure your emails have a professional and cohesive template complete with a logo or anything else you choose. Here’s more info from our manual on working with Sendgrid in Bubble.

Hey, thank you very much!!

The only problem I get is that there is a @bubbleapps.io in the field where my email adress should be.
Do you know why that is the case?

Thanks for the reply @dev17 !

This sounds like you might not be using a custom domain so we’re sending on a temp address that lives @bubbleapps.io like you mentioned. Once you set your app up with a custom domain and put in a Sendgrid API key, you can absolutely have those emails go out on a custom domain of your choice.

Here’s the section from our manual on that: Email - Bubble Docs

Feel free to reach out to us directly at Support@Bubble.io with any additional questions.

Hey,
thank you very much!! Is there any alternative then sendgrid which is completely free?

Kind regards

Marc

Sure thing! And, good question!

Sendgrid actually offers a free tier. And, you get a lot with the $15 a month plan.

But past that, while I know there are other alternatives, I’m unsure about free alternatives. While I’m not aware of their pricing structure, I’d recommend looking into SendinBlue and Postmark as some primary competitors to Sendgrid.

Hey,

yeah. Thank you very much!!
I saw that. do you have any further links where a good implemenation of sendgrid is explained?

Kind regards

Marc

Hey Marc,

Our manual will be the best documentation we have on it! From there, if you’re looking to set up a custom integration of some kind, I might recommend searching our forum specifically for posts related to Sendgrid as I know some of our power users have built some pretty interesting integrations.

And of course, we’re here to help! You can always reach out directly to Support@Bubble.io with any additional questions.

This topic was automatically closed after 70 days. New replies are no longer allowed.