Freeform 5, part 2

In this episode, we continue our discussion about the new release, Freeform 5. We offer a new and more advanced Stripe integration that opens up many new possibilities for handling e-commerce functionality with Freeform. This includes new possibilities for handling payment methods other than traditional credit cards such as payment methods more popular in Europe and other locales.


Full Transcript

[Music] Welcome to the Solspace Podcast. Thanks for listening.

Mitchell: Hey, welcome back to the Solspace podcast. Mitchell Kimbrough, founder of Solspace here.

In addition to all the client services activity, building and maintaining websites, especially in the industrial manufacturing space, distributors, consultants to that group. In addition to that, we have products, and we have a couple products that are plugins, and they're plugins for CraftCMS, one of our favorite CMSs. And the product that we're talking about right now is Freeform 5 for craft. The previous episode we had a couple of weeks ago, we were talking about what's new in Freeform 5. It's gonna launch, probably by the time this is airing, it'll be out in full release. I think it's available right now to a limited beta group or something like that. We talked about what's new, we talked about how it measures up to the competition, and we touched on a new topic, which is payments in Freeform. And apparently a big change took place in freeform 5 with regard to payments that opened things up quite a bit. So Kelsey, let me start with you and ask, first of all, welcome back to the podcast, G you too. Thanks for coming back and helping.

Kelsey, question for you is, first of all, who cares? Like, why, if there's e-commerce, and there's econ, there's craft commerce, and there's all this commerce capability, why do I care that Freeform is capable of handling e-commerce transactions? It's done elsewhere. Why us? Why are we doing that?

Kelsey: Well, I think that many websites have simpler use cases where maybe they just want to accept a donation for a church or nonprofit. Maybe, they want to accept invoice payments, or maybe they want to have a membership for their website, or maybe they're selling one or two products. The advantage that Freeform offers is that, probably within minutes you could have a form that's accepting payments on your website instead of having to set up a complicated, full e-commerce solution. It certainly has its place, but for websites and use cases, like I described it, Freeform excels at that.

Mitchell: So let's imagine I want to accept a donation on a nonprofit website. Luckily, it's a site built on Craft. I have Freeform running for the contact form. I find out that Freeform 5 that I just upgraded to supports payments. And I'm like, yeah, sweet, let's get donations. We're doing a holiday drive to bring in some funds for the whatever, the nonprofit sector that we serve.

So, what's the process? What's it like? Now that you have Freeform 5 running, what do you do as the developer supporting the client and their request to set up donations?

Kelsey: They basically set up a Stripe account if they don't have that already. And there is probably about 5-10 minutes tops of configuring Stripe and configuring the payment methods you would like to accept. You would then set up the connection on Freeform's side of things and, again, a couple minutes of time there. You would then have a new integration available to your form in the builder and you'd see a new field type called StripePayments. You would drag that into your form and you can configure how it's displayed. You can configure how much money it should be, if it should be a subscription or a one-time payment.

And you can, of course, configure, whether you want the user to set up their own payment amount or choose from a list of options. You can include both the option to do a one-time payment or a subscription in the same form and they can choose their method of payment if you've enabled other options. The new integration offers over 40 payment methods including Stripe Link, Apple Pay, Google Pay, PayPal, bank payments and deferred payments. It's pretty plug and play.

Mitchell: So, a developer doesn't have to get into templates and write any special code if they don't want to, it's all available in the builder for Freeform.

Kelsey: Yes, that's correct. So, Freeform just handles all that automatically. And you can certainly adjust your templates as necessary and you don't need to be a developer to set that up or configure it.

Mitchell: Okay, so that's pretty great. Talk about convenience. I like this.

Gustavs: It's super easy to add payments to your form. The hardest part is getting the API tokens from Stripe.

Mitchell: So, you go to the Stripe control panel to grab those and copy and paste them over to Freeform 5?

Gustavs: Yeah. Then you save the integration. Then you open up the form, enable the integration for that form, and just drop in the stripe field, set the amount, and you're good to go.

Mitchell: One of the things we encountered a few years ago working on Freeform was setting it up to handle and support payments. We encountered that the bulk of our customers who wanted to use Freeform for that purpose weren't in the U. S. They were over in the Netherlands or other parts of Europe and it was, it was a pain to get that right. I think we eventually sort of backed down from really pushing on that capability. It sounds like it's much easier now. What changed?

Gustavs: Stripe had a different way of implementing payments in their forms, and they only supported credit card payments. Then later on, they started supporting other payment methods, some of European descent, stuff like Klarna. But we couldn't really implement that functionality because of how vastly different the implementations were. For instance, what we implemented in Freeform 4 had the flow of generating a submission for a form and then completing the payment. So, we had the submission first, and then we could confirm and complete the payment on our backend and store the payment information.

But the latest stripe element has a completely different flow. It assumes that you already have the order or submission or whatever you have, before you display the payment form. So, we had to redesign some stuff and figure out a better flow. And now we generate the payment object, which you then complete by filling out the information which, for some payment methods, requires a redirect to a stripe page, where it validates everything and then redirects back. So, what we do in the background is we store the current data that is being submitted, which is already validated beforehand. Then we redirect stripe. It handles the whatever payment method you have, then it redirects back with a complete finished payment, which might be successful or failed payment. And from that, we pull in the submitted data that was stored before, and we create a submission from that. So, this is a completely different flow, which is why it hasn't been implemented yet in other form plugins. And so we took care of that, and it allows people to have many different payment options, which is really great. For instance, using PayPal is convenient for me rather than using credit cards because you never know where the credit card goes.

Mitchell: So, is there tracking in Freeform 5 for the payment transactions? I mean, they're part of a form submission, right? So, there's whatever e-commerce whatever the dollars or the monetary values are attached in there. Are they captured as well?

Kelsey: Yeah, basically, Freeform will allow you to map Freeform submission data to Stripe, and also it'll store some of the Stripe data as well, but it won't store any sensitive data, so it won't store credit card numbers and stuff like that. It'll maybe store the last four digits, which is useful for providing support for a customer to confirm a card or whatever, but certainly doesn't keep any sensitive data. But it will show you in Freeform, if the payment was successful, if it failed, and what the failure message was etc.

Gustavs: It also links back to the Stripe dashboard to the correct payment if you click on it in Freeform. And also Stripe links back to the form, to the submission, to the integration. Everything that you might want to go back to, it links back to Freeform as well.

Mitchell: What is possible in Formie with regard to e-commerce and payments? Does it support any of that?

Kelsey: Basically, from my understanding, Formie offers the older Stripe integration a little bit different than what we offered in Freeform 4. But similar in terms of what it can do, like the one-time payment and the subscription, but only with credit cards, they have a couple other integrations, one specific for PayPal and one specific for some other payment gateway that seems like it's Australian based. So, Freeform 5 certainly offers significantly more integration payment method options, but it is all done within a single gateway.

Mitchell: Okay. So, all this exciting talk about Freeform 5. Gustavs, I think right now you're working on the migration path between Freeform 4 and 5. How different are the database tables? How significant a change is that?

Gustavs: It is completely different and Freeform 4 and below we stored everything in a JSON file. All of the form configuration of the row, page field configurations of the integrations, they're all stuffed inside this single, large JSON file. And so, if the structure change at any point, it was pretty risky to deserialize the whole JSON, make the changes, and then serialize it back again. So it was scary each time it had to be done. And because of the global fields, we also had to always reference back the ID from the fields database. But in Freeform 5, since you don't really have any global fields anymore, those fields are created for a particular form. So instead of having a global fields table, we now have a table which stores the specific fields for specific form with its specific configuration and rows, pages, integrations, everything has their own database table. Even conditional rules have their own database tables and so everything links back to everything else. And if we have to make any change for a particular component, it's done for that particular component in a particular database table. So that reduces a lot of risk. And also, in this way, we prevent data redundancy like missing, loose, orphaned fields or integrations or what have you. So, if you delete a form, for instance, the database itself is going to clean up all the other tables that relate to this particular form or field or integration.

Mitchell: So when someone goes to upgrade from Freeform 4 to 5, is there any indicator yet of how long that migration takes? And like, is it a few seconds or a minute or two? Like what's the story on that?

Gustavs: It's a couple of seconds. It's the same as just having a single plugin upgrade or craft upgrade. You just click update the database, it spins for a second, and then it's done. It's all going on in the background.

Mitchell: That's the last thing you have to finish before we're ready to let this bad boy loose, right?

Gustavs: Yes.

Mitchell: Nice. Alright, that answers all my questions.

Thank you both for helping me out. Thanks for joining the podcast and giving us a brief on this upcoming, impending major launch of Freeform 5. We've invested a lot of time, effort, and money. Gustavs, you've been saying this is some of the best work you've ever done. I'm really proud that you've been part of the team and doing that. That's humbling. I'm excited to see this get into the marketplace and see our existing customers get into it. Hopefully it makes their lives even easier. So thank you both.

[Music] You’ve been listening to the Solspace podcast.