Do you want to create a Toggl project form in WordPress?
With WPForms, you can easily make a form on your website that automatically creates a project in Toggl when the form is submitted.
In this article, we’ll show you step-by-step how to integrate Toggl with WordPress.
What Is a Toggl Project?
A Toggl project is an area in the Toggl workspace where you can track time and plan projects. You can integrate Toggle with WordPress using Zapier.
With Toggl, you can assign each project to a different client so that everything’s organized, then simply click the timer to start tracking time.
For example, a web designer might create a project for a new client website. By splitting the project into tasks, they can accurately track time against each step.
Tracking time in Toggl projects is useful if you want to:
- Measure project activity in your company or team
- Create timesheets for your clients
- Track the time you spend working in tools like GitHub or Basecamp by integrating them with Toggl.
So now that you understand a little more, let’s create a WordPress form to integrate Toggl with your website.
How to Create a Toggl Project from a WordPress Form
In this example, we’re going to create a Volunteer Recruitment Form in WordPress. When a volunteer signs up, we’re going to create a new Toggl project automatically so that we can organize their training and track time.
In This Article
Before you start, it’s a good idea to set up your organization and clients in Toggl. If you don’t need to assign projects to clients, just use your own name as the client for now.
Step 1: Install the WPForms Plugin
In order to connect Toggl to WordPress, you’ll also need the Zapier addon. You can easily install it by going to WPForms » Addons and clicking the Install Addon button.
Once you’ve installed and activated WPForms and the Zapier addon on your site, you can move on to the next step.
Step 2: Create Your Toggl WordPress Form
Next, create a new form in WPForms by going to WPForms » Add New.
You can create any kind of form you want here, but for our example, we’ll create a client information form. We’ll use it to collect information about new clients and automatically add them to Toggl.
To speed things up, we’re also going to use the Client Intake Form template.
It’s really easy to customize the form. Just drag and drop fields from the left-hand side of the builder to the right-hand preview area.
You can also use the form builder to:
- Drag fields up and down to reorder them
- Mark fields as Required
- Remove fields you don’t need
- Duplicate fields
- Add a GDPR agreement field to your form
The form we created in this example has a lot of questions. If you want to learn how to split long forms into pages, check out this guide on how to create a multi-step form in WordPress.
Click Save when your form is complete.
Don’t leave the form builder yet. There’s one more thing you need to do here before you head over to Zapier.
Step 3: Submit a Test Entry to Your Toggl Project Form
Now you need to fill out your form and submit a test entry to it. You’ll use this test entry to set up your Zapier connection, so don’t skip this step!
In the form builder, you can open your form by clicking the Preview button.
Then simply fill out your form and click the Submit button.
Great! Now you’re ready to move over to Zapier and start connecting Toggl to WPForms.
Step 4: Connect WPForms to Zapier
Head to Zapier and sign up to the service (if you haven’t already) or log in to your account. Then, open your Zapier dashboard and click Create Zap.
Now search for WPForms and click the icon to select it as your trigger app.
Then, choose New Form Entry as the trigger event and click Continue.
You’ll now need to connect your WPForms account with Zapier. To do this, click on the Sign in button.
A popup will open asking for your site URL and your Zapier API key. You can find your API key in your WordPress admin dashboard.
Head over to your site’s WordPress dashboard and navigate to WPForms » Settings » Integrations. Click the Zapier icon to reveal your key.
Go ahead and copy the key, then paste it into the Zapier connection window with your site URL, like this:
Click Yes, Continue to close the window.
Now, click on Continue and Zapier will ask you to choose which form from your account you want to use. Click on the dropdown field and select the form you want to connect with Toggl and press Continue again.
At this point Zapier will test your connection with WPForms to make sure everything is set up correctly. Click Test trigger to begin.
Zapier will connect to WPForms and pull in the test entry we created in Step 3.
If you’ve done everything right so far, you’ll see a success message and your test entry.
In the next step, we’re going to set up an action for the WPForms trigger we’ve just finished configuring above. Click Continue to proceed.
Step 5: Connect Toggl to Zapier
Zapier will now ask you to add an action for the trigger set up above. Here, Search for Toggl and click the icon.
Now, Zapier will ask what you want to do in Toggl when your WordPress form is submitted. There are lots of awesome things you can do here. For this example, we’ll choose Create Client, then click Continue.
Next, Zapier will ask you to sign in to Toggl. Click the Sign in button to begin.
This will open a popup window asking for your Toggl API token, which you can find in your Toggl account’s profile settings. Paste your API token here, then click Yes, Continue.
When the window closes, click Continue again to move on.
It’s time to tell Zapier what your Toggl project should look like when a user fills out a form. Use the dropdowns and fields to get everything mapped the way you want it.
To create a new client like in our example, all you have to do is select a pre-existing workspace from your Toggl account and the Name field from your form.
When you’ve customized the action, click on Continue.
Now Zapier will test your Toggl connection just like it did for WPForms. Click on Test action to get started.
If your Zap is set up correctly, then you’ll see a success message. You’ll also have a new client set up in your Toggl account from your test entry.
That’s it! All that’s left to do is publish your Zap to make the connection live and embed your form on your website so that users can start filling it out.
Next, Use Slack Integrations for WordPress
To make your work even easier, you can integrate lots of WordPress plugins with your Slack for quick access to all important tasks related to your site. See our guide on top slack integrations for WordPress for more information.
Also, if you’re looking for more project management tips, here’s a really neat way to add a Kanban board in WordPress.
Ready to build your Toggl project form? Get started today with the easiest WordPress form builder plugin. WPForms Pro includes free customizable templates and offers a 14-day money-back guarantee.