How to Build an Issue Tracker Using GravityView

When it comes to running a software company, tracking and fixing issues is important for keeping your customers happy. To stay on top of issues and bugs, it’s crucial to have an organized and efficient workflow.

Issue tracking software is a fundamentally important customer support tool. There are different apps out there that offer this service but why invest in another third-party solution when you could build and customize your own issue tracking tool? Furthermore, issue tracking software is often overly complex and out of the budget range of many small companies.

In this post, we show you how to build an issue tracker for WordPress using Gravity Forms and GravityView. Sounds interesting? Keep reading to find out how!

What Is an Issue Tracker?

Software companies need ways to log, track and monitor bugs. An issue tracker helps you manage the process so you can notify developers to start working on fixes. Without an efficient issue tracking system, it’s hard to pinpoint important issues and prioritize development work.

Many companies around the world pay “hackers” thousands of dollars for finding issues and vulnerabilities in their software which they can then take action on.

Why Use Gravity Forms and GravityView?

If you already run a WordPress website, it makes sense to build an issue tracker using the same platform. After all, why spend time switching between different apps, when you can use one for everything?

To build an effective issue tracking system, you need two things: 1. A way for users to report issues in detail and 2. A way to categorize, update, filter, and sort those issues.

Gravity Forms takes care of the reporting side of things by allowing you to build powerful forms and configure custom notifications. GravityView allows you to display, update, sort, and filter those entries on the front end. Using Gravity Forms and GravitityView, you can build a customized issue tracker that suits the needs of your business. 

Using WordPress to power your issue tracker means that you have control over the data you collect. Gravity Forms stores form entries in your site’s database, so no need to worry about privacy issues.

Furthermore, Gravity Forms and GravtyView are both flexible solutions that can scale as your business grows.

Gravity Forms Bug Report System Using GravityView

GravityView is an add-on for Gravity Forms that allows you to display form data on the front end. The power of GravityView lies in its extensive layout options that give you full control over how your entries are displayed.

With GravityView, you also get advanced filtering and sorting capabilities, making it the perfect tool for keeping track of issues as they arise.

Moreover, GravtyView allows you to build layouts using a drag and drop builder. It’s no-code but 100% developer-friendly! To start building your issue tracker, you’ll need to grab a copy of GravityView and install it on your website.

Installing GravityView

After purchasing a GravityView license from our website, log in to your account and download the plugin as a ZIP file. Now log in to your WordPress admin panel and upload GravityView. After activating the plugin, you’ll see a new “Views” menu item on the left-hand side.

Next, activate your license by going to the GravityView Settings page and pasting your license key into the box.

Creating the Form

Now that GravityView is installed, it’s time to create your bug report form in Gravity Forms. GravityView makes this easy for us as it ships with an “Issue Tracker” form preset right out of the box!

To use GravityView’s presets, you need to first create a View. To do this, hover over Views and click New View. Now give your View a name (don’t worry this is for your reference only) and under Data Source, select Use a Form Preset.

Next, scroll down and select the “Issue Tracker” preset.

GravityView will now create a new form for you in Gravity Forms with all the fields you need for an issue tracker. The plugin will also load a pre-configured View containing all of the necessary fields. This saves you loads of time and allows you to get an issue tracker up and running in only a few clicks!

For now, save your View. We’ll come back to it shortly.

Embedding the Form

To check out the preset form that GravityView created, hover over Forms and click Forms. You’ll see the new form called “GravityView – Issue Tracker”. Click Preview to see what it looks like.

You’ll see it contains a range of different fields allowing users to describe the bug, upload screenshots, and change the status. Feel free to customize the form by clicking “edit” to add new fields or delete fields you don’t need.

Now that the infrastructure is all set up, you can embed your form on a page or post on your website. To embed a Gravity Form, create a new page and add a “Gravity Forms” block from inside the WordPress block editor.

Alternatively, If your site isn’t using the block editor, you can embed your form using the [gravitform] shortcode.

The Issue Tracker Preset View Layout

Now it’s time to go back to the View that GravityView automatically created. You’ll see three tabs at the top – Multiple Entries Layout, Single Entry Layout, and the Edit Entry Layout. These are the three screens that make up a View.

The Multiple Entries Layout is where all the issues will be displayed. Here users can search, sort, and filter the different issues from the front end. Clicking on an issue takes you to the Single Entry screen, which displays more information about the issue.

As you can see, the Multiple Entries page contains a Search Bar widget at the top. To change the search settings click on the gear icon next to the widget name.

Below, under Entries Fields, you’ll see three fields – the Issue ID, Issue Summary, and Issue Status. These are the fields that GravityView automatically added for us. To add new fields, click the + Add Table Column button and to re-order fields, simply drag and drop them.

If you click on the Single Entry Layout tab, you’ll see the remaining fields are displayed there. Again, feel free to add, delete or rearrange fields as you see fit. When you’re happy with your View, save it and embed it on your website using the [gravityview] shortcode.

Viewing Our Issue Tracker on the Front End

To check out what your View looks like on the front end go ahead and fill out your form with a few issues and then open the page containing your View.

Here’s what the multiple entries screen looks like. As you can see, there’s a search widget at the top, allowing us to search issues by status or keyword. Below that, the issues are displayed one after the other in a table layout.

Clicking on the Issue ID will take you through to that issue’s Single Entry. Here’s what the Single Entry screen looks like. As you can see, it contains all of the details about the issue, including a screenshot (if the user decided to upload one).

At the bottom of the Single Entry, Layout is a link to edit the entry. By clicking this you can update the issue with new information or change its status from the front end. This is helpful when needing to move issues from “New” to “Resolved” to “Closed”.

Sorting and Filtering Entries

GravityView includes various options for sorting and filtering your entries on the front end. To change these options, edit your View, scroll down to the View Settings box and click on Filter & Sort.

Here you’ll find a range of options allowing you to sort by fields, specify the sort direction, and filter by date.

For more granular control over sorting and filtering, install the GravityView Advanced Filter extension. This allows you to filter your View based on parameters you set using conditional logic. To Install Advanced Filter, hover over Views, click Manage Add-Ons, scroll down to Advanced Filter and click Install.

The Advanced Filter gives you endless ways to customize your View. For example, here’s how you would filter your View to exclude issues marked as “Closed”.

For more information about using the Advanced Filter extension, check out our documentation.

Assigning Issues to Specific Users

At this point, we’ve got a fully functioning Issue Tracker allowing us to report issues, categorize them and update them from the front end. But what if you need to be able to assign issues to specific users?

This is possible using another add-on for Gravity Forms called “Populate Anything”. This add-on is part of the Gravity Perks suite of add-ons offered by Gravity Wiz. Populate Anything allows you to populate field values and choices with information from your WordPress database, including users. 

After installing Populate Anything, edit your form and create a new dropdown field called “Assigned to”. Next, set the Value to the User ID and the Label to Display Name. Now you can use this dropdown field to assign issues to specific members of your team to work on.

If you want your View to only display issues assigned to the current user, you can use the Advanced Filter extension to add a new condition that checks the “Assigned to” field and matches it to the currently logged-in user.

You can do this using the {user} merge tag, like so:

Setting Up Email Notifications

Using Gravity Forms’ built-in Notifications feed, you can set up email notifications every time a new issue is reported. 

To do this, go to your form settings and click on Notifications. Now edit the existing Admin notification or create a new notification. Here you can choose the Send to address and modify the From Name, Subject, Email body, and more.

Bonus: Setting up Slack Notifications

Most tech companies use Slack for team communication. Gravity Forms offers a Slack add-on that allows you to send Slack notifications when your form is submitted. This is helpful if you have a Slack channel for issues/bugs and want to keep a record of them inside the app.

To install the Slack add-on, hover over Forms and click Add-Ons. Scroll down to the Slack add-on and click Install. Next, go to the Gravity Forms Settings page and click on the Slack tab. Click “Connect to Slack” to connect your Slack account to Gravity Forms.

When that’s complete, you can create a new Slack notification feed by going to your form Settings, clicking on the Slack tab, and adding a new feed.

Building an Issue Tracker with GravityView: Final Thoughts

Having an efficient issue-tracking workflow is a critical part of improving and growing your app or software platform. Many third-party apps allow you to report and track issues but they are often complex and inflexible. 

You can build your own issue tracker for WordPress using Gravity Forms and GravityView. Gravity Forms allows you to collect bug reports and notify developers via email, while GravityView allows you to display, edit, filter, and sort issues on the front end.

If you enjoyed this tutorial, subscribe to our newsletter below and we’ll notify you when we publish new content! Next, check out how to build a custom task management system.