The beauty of the Run Free Project and Stacks automated gridding is that you can list and sell anything in your eCommerce store that you can create in your point of sale (POS) system. The only limit is your creativity.

Many stores sell training programs and other intangibles from their eCommerce storefront. This is a how-to guide outlining common approaches to automating the gathering of additional data that's often required at the time of sale for certain products and services.

Please Note! If you're unfamiliar with Stacks and how Run Free auto grids products from your POS, read this article before proceeding any further. You should also understand how to add custom products to your Run Free store by building them in your POS. To learn that process, check out this video:

With those two prerequisites out of the way, let's proceed...
​

We'll step you through the three most common paths stores take to listing training programs and other offerings that require additional data. They are:

The simplest, most straightforward way to present custom products like training programs is to embed a form right onto the product page itself. It's easy to do and you can use the Blurb to call users to action.

When we're done, your product page should look something like this:

Technically, you can use any embeddable form to accomplish this step (if you use a marketing automation tool like Klaviyo or Hubspot, you can create embeddable forms on their platforms that link directly back to your marketing automation workflows). If you don't have a marketing automation tool with a built-in form builder, we suggest this awesome form builder from Elfsight (it's awesomely free too!). The creation process in Elfsight's dashboard is super simple and it steps you through the whole process. First, you'll create your elements (i.e. fields, selections, etc.) on Form tab. Then, you'll set up your mail settings on the mail tab (where the form needs to go and how it needs to be sent there). And finally, you can customize the appearance if you want to. Save your Elfsight form, then click close.

You'll be taken to your widgets listing page. Find the form you just created and click more actions (the three ellipses on the far right) as shown below:

From there, choose the Embed Code option. A modal will appear that looks similar to the one pictured below:

Click the green copy code button to grab that Javascript code from Elfsight. That little snippet of code tells Run Free where to grab your form so it can present it on the product page.

With code in hand, go back to your Run Free Project Admin Console, login, click products, and find the training product you wish to add the form to. When found, click the arrow to the right of the product listing and select edit as shown below:

This will open the product details page. Add images, pricing, and adjust settings as you normally would, then scroll down to the Short Description (also known as blurb). You will want to enter some sort of relevant call to action that informs your customer they need to fill out the form before making a purchase. An example is shown below:

This verbiage will appear just below the product name and price to the right of the product images on the customer-facing product page, meaning it's sure to grab your customer's attention.

Next, scroll down to the Full Item Description. This section is where you set the text below the images and product information on the product page and is where we're going to paste that code you copied by pressing the green button from the previous step. Before doing anything, be sure you click the source button as shown below to toggle hacking the Matrix mode on:

After you click source, you can paste the code snippet. That's all there is to it!

Before navigating away from the product page, be sure to save your work, then navigate to the customer-facing side of your eCommerce store and test out the form to ensure you've set it up properly.

The great thing about embed code like this is that if you made a mistake in setting up the form on Elfsight, you can just go back and edit it there. Any changes you make will automatically show up on the form in Run Free.

One interesting and flexible way to present custom products like training programs to customers is to use an informative landing page with a form. With this approach, you present the training plan or plans as an option to your customer from the custom homepage template or the "home" page builder page in your store. The customer journey follows the process shown below:

An example is shown below, beginning with the store homepage:

The Training Classes category tile is set to link to the informative landing page with a form this store created with the Run Free page builder. Behind the scenes, in the Run Free admin dashboard under Layout > Homepage, the category tile configuration shown above looks like this:

Clicking on the Training Programs category tile takes the user to the landing page below, created with the Run Free page builder:

Once the customer completes the form on the landing page and clicks the submit button, they are redirected to the training program product page (you set the button's destination when building your form), where they can add it to their cart and complete their purchase standard Run Free fashion.

The content of this landing page is totally customizable on the back end of Run Free under Layout > Pages. This particular page layout is shown in Run Free's edit mode below:

In this case, the Custom HTML section holds the embed code from the form builder.

To recreate this process in your store, you must first create a form. Technically, you can use any embeddable form to accomplish this step (if you use a marketing automation tool like Klaviyo or Hubspot, you can create embeddable forms on their platforms that link directly back to your marketing automation workflows).

If you don't have a marketing automation tool with a built-in form builder, we suggest this awesome form builder from Elfsight (it's awesomely free too!). The creation process in Elfsight's dashboard is super simple and it steps you through the whole process. First, you'll create your elements (i.e. fields, selections, etc.) on Form tab. Then, you'll set up your mail settings on the mail tab (where the form needs to go and how it needs to be sent there). And finally, you can customize the appearance if you want to. Save your Elfsight form, then click close.

You'll be taken to your widgets listing page. Find the form you just created and click more actions (the three ellipses on the far right) as shown below:

From there, choose the Embed Code option. A modal will appear that looks similar to the one pictured below:

Click the green copy code button to grab that Javascript code from Elfsight. That little snippet of code tells Run Free where to find your form.

Once you've copied the embed code as described above, navigate back to the Run Free Project Admin Dashboard, click layout > pages, and edit the landing page you wish to embed a form into.

In the page editor, simply click the Custom HTML widget as shown below. This will add a custom code section to your landing page:

Scroll down to the Custom HTML block and paste the code snippet you copied from your form builder (Elfsight in this example) as shown below:

Save the page, then test the customer journey as illustrated early in this section to ensure it meets your needs.

The Run Free Project is built to work with the systems you use to manage your business. While we love the simplicity of Elfsight, if you use Klaviyo, Hubspot, or another marketing automation tool that has form creation capabilities, we suggest using that instead.

The processes described in this article will be exactly the same, but instead of setting up the form and copying the code from Elfsight, you'll do that step inside your marketing automation tool, then paste that code snippet into Run Free based on which of the two most common training program listing techniques you choose.