What we need:
- For the Budget you can use a dropdown selector type of field in Crmble with three possible options, like 100, 200 and 300 for instance.
- Keep the names of each field simple. Don’t use spaces or special characters as this is required to match the names of your spreadsheet columns later.
- In WPForm, use the placeholder info instead to specify the value you are asking for like in the screenshot example above.
The 3 steps setup
1) Connecting your WPForm to the Google Sheet connector plugin
2) Connecting the Google Sheet we’ve setup
Here is a small breakdown of Google sheet URL’s to get the info we are asked for:
Google Sheet example URL
Standard first part:
Sheet Unique ID:
3) Connecting Crmble to the Google Sheet
- From the Google Forms topping section, sign in with the Google account that owns the G Sheet. Follow the on screen authorization process to grant Crmble access to your spreadsheets.
- Your connected Google Account will show up. Now click on the upper right green “+ Add new Google Form” button. Fill out the dropdown fields to select the desired G Sheet.
- One last step to match your G Sheet columns with your Crmble Fields and you are done. Click on the little black arrows next to each Name, Email and Budget field to link each one to its corresponding G Sheet column name.
Time for a test! Fill out a new form in your WordPress page and check your default Crmble list for new entries.
- Make sure the first row is a header row with column names
- Don’t manually edit the Google Sheet to delete or add new rows
Connecting the Elementor form widget with Crmble
In this last bit of our blog post we are going to focus on Elementor. Even though it’s only been around for a couple of years, Elementor has become the most used page builder for WordPress. With a staggering 5% of all websites in the world built with Elementor, it’s no wonder their out of the box form widget is also a widely used form solution for WordPress. We use Elementor at Crmble and we love the way it works and how they are constantly adding new features and improving with every new update. If you use WordPress but haven’t heard of Elementor before, we encourage you to visit their recently published facts and stats page that will walk you through the milestones they’ve achieved in these 5 years. Congratulations Elementor!
While Zapier is not free, they offer a free plan that covers 100 tasks/month to check it out. In our example though we will need a paid plan since we need to use webhooks (more about webhooks in a minute). Check out Zapier’s price plans here starting as low as $19.99/month billed annually for 750 tasks a month including multi step automations and with up to 3 premium apps integrations and webhooks.
So, what the heck are webhooks, you might ask?
Well, while webhooks might sound a bit intimidating at first and only reserved to developers, the truth is that Zapier makes it very easy to set one up to act as the trigger of our whole automation.
Make a new Zap
First thing we’ll need to do is to access our Zapier account to create a new automation. (automations are called “Zap’s”).
As soon as zapier.com loads, you’ll see a button at the left top corner called “MAKE A ZAP”. Let’s go!
Setup a Zapier webhook Trigger
Once selected you’ll get a couple of options. In this case we need to select the Catch Hook type one. By doing so, Zapier will create a so-called end point that will be entered later in Elementor’s Form widget.
Click continue and Zapier will show us the url of our newly created webhook. You can leave the rest as is and go on and copy the Webhook URL and click continue.
Configure the webhook trigger in Elementor form Widget
At this point you should see a new section in your widget settings called “Webhook” where you can now paste the Webhook url we just copied from Zapier.
Now save your configuration and visit your live form page and submit a quick example that will come in handy to finish our Zap configuration.
And now back to Zapier to quickly test out our webhook.
Add an action to create a new Crmble card
Once you’ve selected Crmble Zapier will ask you to define the action. Click on the action selection button and pick the only one available at the moment called “Create a Trello Crmble card” and click continue.
Connect Crmble using the Zapier Topping token
Now it’s time to “Sign in to Crmble”.
Go back to your Trello board where Crmble is installed and open the Zapier Topping you find in Crmble’s main menu Toppings section. Once there, click on the “Generate Board Api Token” button and copy the long string and paste it where you left it at Zapier.
Turn your Zap “ON”
Congratulations, You made it! From now on every submitted form on your page will result in a new card ready for you or your team to work on in the way you’ve designed your sales funnel.