Customize Your Gravity Flow Inbox with GFSearch

//

BrightLeaf

GFSearch is built to help you display Gravity Forms entries your way — including workflow-specific information from Gravity Flow. In this post, we’ll show how to use that power to build a custom Gravity Flow inbox that’s more flexible, better looking, and easier for users to navigate than the default one.

Whether you’re building a sidebar widget, a personalized dashboard, or just want more control over how tasks are presented to your users, GFSearch gives you the flexibility that the native inbox can’t.


What’s Wrong With the Default Gravity Flow Inbox?

Gravity Flow is a powerful tool, but the inbox layout is rigid:

  • It only shows four fixed columns
  • You can’t change which fields appear
  • You can’t restyle it to match your site
  • It can also be difficult for users to spot the task they need in a long, cluttered list of entries

That’s fine for some back-end use cases. But if you want to build a polished, on-brand frontend you need more control.


Why GFSearch is a Better Inbox

Using GFSearch, you can create custom workflow views that:

  • Show only the tasks assigned to the current user
  • Display any part of the entry or workflow metadata you need
  • Link back to the Gravity Flow entry for approval or updates
  • Fit anywhere on your site (including dashboards, widgets, or sidebars)
  • Render using whatever layout makes sense: lists, tables, cards, accordions, etc.

GFSearch handles the filtering. You handle the display.


Design Your Inbox: Layout Options

Here are just a few examples of how you might replace the inbox with your own layout using GFSearch.

📋 Table Layout (Admin-Style)

A clean table layout for dashboards:

<table>
  <thead>
    <tr>
      <th>Step</th>
      <th>Submitted By</th>
      <th>Field 21</th>
      <th>Form Title</th>
      <th>Status</th>
      <th>Created At</th>
      <th>Name</th>
      <th>Date</th>
    </tr>
  </thead>
  <tbody>
  [gfsearch search="workflow_user_id=0"
  display="<tr>
    <td><a href='{gfs:workflow_submission_url}'>{current_step:name}</a></td>
    <td>{gfs:created_by:display_name}</td>
    <td>{21}</td>
    <td>{gfs:form_title}</td>
    <td><a href='{gfs:workflow_submission_url}'>{gfs:workflow_status}</a></td>
    <td>{gfs:created_at}</td>
    <td>{12}</td>
    <td>{25}</td>
  </tr>"
  separator="__none__"]pending[/gfsearch]
  </tbody>
</table>

📄 List Layout (Good for Sidebars)

Simpler output for narrow areas — this is based on a live implementation we use in the sidebar of one of our sites (with form and page IDs changed):

<ul>
  [gfsearch search='workflow_email_' target='1'
    display="<li style='color:white;'>
      Tuition Contract for<br>
      {96}<br>
      <a href='{gfs:workflow_submission_url: page_id=2 assignee=email_field[22]}' target='_blank'>
        {current_step:name}
      </a>
    </li>"
    default="You don't have any tasks." separator='__none__' limit=all]
  pending
  [/gfsearch]

  [gfsearch search='workflow_user_id_0' target='3'
    display="<li style='color:white;'>
      Invoice for {1}<br>
      <a href='{gfs:workflow_submission_url token=true}' target='_blank'>
        {gfs:current_step:name}
      </a>
    </li>"
    default="You don't have any invoices." separator='__none__' limit=all]
  pending
  [/gfsearch]
</ul>

🧱 Card Layout (For App-Like Dashboards)

Custom styles make this perfect for portals or mobile views:

[gfsearch search="workflow_user_id_0"
  display="<div class='card'>
    <h3>{current_step:name}</h3>
    <p>{21}</p>
    <a href='{gfs:workflow_submission_url}'>Open</a>
  </div>"
  separator="__none__"]pending[/gfsearch]

Our Custom Gravity Flow Inbox

This is one of the approaches we use in production. Our task list is wrapped in a custom accordion shortcode, allowing us to embed task blocks inside collapsible sections and display workflow data exactly the way we want it.

Accordion-style task list generated with GFSearch showing custom Gravity Flow entries
A live example of how we display workflow tasks using GFSearch inside an accordion section.

Here’s what the shortcode looks like:
(accordion wrappers removed for clarity)

<table class='admintaskstable'>
  [gfsearch search='workflow_user_id_0'
    display="<tr class='admintasksrow'>
  <td>
    <a href='https://digital.brightleaf.info/dashboard/my-tasks/?page=gravityflow-inbox&view=entry&id={gfs:form_id}&lid={gfs:id}' target='_blank'>
      {current_step:name}
    </a>
  </td>
  <td>
    <a href='https://digital.brightleaf.info/dashboard/my-tasks/?page=gravityflow-inbox&view=entry&id={gfs:form_id}&lid={gfs:id}' target='_blank'>
      {gfs:created_by:display_name}
    </a>
  </td>
  <td>
    <a href='https://digital.brightleaf.info/dashboard/my-tasks/?page=gravityflow-inbox&view=entry&id={gfs:form_id}&lid={gfs:id}' target='_blank'>
      {{gvlogic if='{gfs:form_id}' is='1||2||3||4' }}{19} (${20} to {1}) {{else}} {21} {{/gvlogic}}
    </a>
  </td>
</tr>"
    default="You don't have any tasks."
    separator='__none__' limit=all]pending[/gfsearch]
</table>

We’ll break down how this works step-by-step below.


Breaking Down the Example: How It Works

Let’s walk through how the real-world GFSearch shortcode we shared works, step by step:

1. search='workflow_user_id_0'

This filters the entries to only show those where the current user is the assigned workflow assignee.

2. display="..."

The display attribute is where you define exactly how each matching entry should appear. In this case, it’s rendering a custom table row (<tr>) for each entry.

3. First Column: Current Workflow Step (with link)

The first <td> in the table row contains a link to the full entry view in the Gravity Flow inbox, using a combination of merge tags:

<a href='https://digital.brightleaf.info/dashboard/my-tasks/?page=gravityflow-inbox&view=entry&id={gfs:form_id}&lid={gfs:id}'>
  {current_step:name}
</a>
  • https://digital.brightleaf.info inserts your site’s base URL. This is a custom merge tag we added on the suggestion of a Gravity Forms Facebook group member.
  • {gfs:form_id} returns the current entry’s form ID. The gfs: prefix ensures that the tag is processed by GFSearch instead of Gravity Forms or GravityView. This behavior is explained in more detail in our documentation.
  • {gfs:id} returns the entry ID.
  • {current_step:name} outputs the label of the current step in the workflow. See the Gravity Flow docs for details.

The result is a clickable link labeled with the current workflow step name that sends the user directly to the detailed inbox view for that entry.

4. Second Column: Submitted By (with link)

The second <td> also links to the full entry view but displays the name of the user who originally submitted the entry:

<a href='https://digital.brightleaf.info/dashboard/my-tasks/?page=gravityflow-inbox&view=entry&id={gfs:form_id}&lid={gfs:id}'>
  {gfs:created_by:display_name}
</a>

This uses the Gravity Flow merge tag to output the display name of the user who submitted the form. It helps users identify who created the entry without leaving the task list.

5. Third Column: Conditional Output (with nested shortcode)

For details, see the Gravity Flow merge tag documentation (Look for the “Additional Merge Tags” section near the bottom).

The third uses a gvlogic block to conditionally show different content depending on which form the entry came from. Here’s what that part of the shortcode looks like:

<a href='https://digital.brightleaf.info/dashboard/my-tasks/?page=gravityflow-inbox&view=entry&id={gfs:form_id}&lid={gfs:id}'>
  {{gvlogic if='{gfs:form_id}' is='1||2||3||4'}}
    {19} (${20} to {1})
  {{else}}
    {21}
  {{/gvlogic}}
</a>

This logic says:

If the entry came from forms with IDs 1, 2, 3, or 4, show values from fields 19, 20 and 1 (e.g. “John Doe ($100 to 1234)”).

Otherwise, show field 21.

This is useful when your forms don’t all use the same structure, and you want the display to adjust accordingly.

Nested Shortcodes in Display

Note that the gvlogic block is nested inside a display=”…” attribute. This only works because GFSearch is built to process shortcodes inside display attributes. Be mindful of escaping and formatting issues when nesting this deeply. More info on this pattern is available in the GFSearch documentation (see the nested shortcodes section).

You can read more about GVLogic here.

6. default="You don't have any tasks."

This message shows if the user has no assigned entries that match the search.

7. separator='__none__'

The separator attribute controls what is placed between each result. In this case, __none__ tells GFSearch not to insert any separators — especially useful when rendering full HTML blocks like <tr> or <li>.

8. limit=all

The limit attribute controls how many entries are displayed. Setting it to all means no limit — GFSearch will return all matching entries.

9. pending

The value between the opening and closing shortcode — in this case, pending — is what GFSearch looks for in the meta field defined by the search attribute. Here, workflow_user_id_0 dynamically becomes a meta key like workflow_user_id_123, meaning “entries assigned to this user.” GFSearch will only return entries where that meta key has a value of pending, which corresponds to the workflow status.

This setup is useful for filtering entries to a specific workflow step, such as pending, approved, rejected, or complete, depending on your use case.



Build the Inbox That Belongs On Your Site

GFSearch gives you the power to turn the Gravity Flow inbox into a frontend experience that actually fits your brand. You decide what’s shown, how it looks, and where it goes — your own fully customizable Gravity Flow inbox.

Need a quick sidebar widget showing “You have 2 pending approvals”? Done.

Want to build a full-page dashboard with different task types grouped in collapsible sections? Easy.

Once your workflows are in place, GFSearch gives you full control over how they’re presented — and not just inboxes. You can build all kinds of filtered views and dynamic layouts using entry data from any form.

See here for all the features of GFSearch.