How to Create Product Configurator & Connect it to ClickFunnels Checkout

I am new to Playcanvas and was told it would be a great way to create a product configurator for our website to showcase our minibike kits and options.

Although I know this will work and can be embedded to our site, I do not know how or even if it is possible to connect the configurator to the built in ClickFunnels checkout process so the customer can easily design their minibike and checkout.

If anyone has any ideas or suggestions, I would very much appreciate it.

Not sure what “clickfunnel” is, but perhaps export the information as some sort of txt file then use that txt file as html code for the website to change the options in checkout.

ClickFunnels is like Shopify or Wix, it is a website builder where you can sell your products and services.

My goal is for the customer to design the minibike how they would like and then check out similar to a car website.

Welcome, @Mantini! I hope you’re enjoying PlayCanvas so far.

Since you’re new, you have a few options available to you:

I’m not personally familiar with ClickFunnels but this page looks relevant to embedding your PlayCanvas app:

1 Like

Hey Will, thank you so much for sharing all of this.

Not only am I new here, I am new to coding but excited at the possibility to build a configurator like the car example in the Web Components.

The only thing I am unsure of is, even though I know I can embed the 3D configurator onto our website, I am still unsure how it would interact with the backend so that once a customer designs their order, then can checkout with all the upgrades they selected.

A workaround would be for them to be able to save the information and then re-enter it during the checkout process, but I feel like that would not be a great experience for the customer.

Do you know if Playcanvas can send data to a website that it is embedded on?

Not only am I new here, I am new to coding but excited at the possibility to build a configurator like the car example in the Web Components.

The car configurator example is basically 70 lines of HTML:

Plus a script to handle the color selection:

So it’s fairly straightforward.

A workaround would be for them to be able to save the information and then re-enter it during the checkout process, but I feel like that would not be a great experience for the customer.

Yeah, that should be unnecessary. Your PlayCanvas app can store the current configuration in an object and send that to the server via HTTP request as JSON.

Do you know if Playcanvas can send data to a website that it is embedded on?

So yes, 100%!

This is really helpful, I’ll give it a try!

For our website, we want customers to see their selected upgrades in real-time during checkout, similar to a car configurator on a website. This way, they can visualize how the parts come together.

While all our minibike models share the same frame, we have four different versions as well as various accessories that they can use.

Not sure if this is allowed in here, but would you know anyone who might be able to help me implement this?

Make a new topic in the Jobs section about this.

If it is a paid position the Jobs section, otherwise the Collaboration section please.