‘Start workflow’ buttons in SharePoint libraries

SharePoint Online and Microsoft Flow make the process of creating workflows instant and straightforward. Users can create a simple workflow from available templates in minutes and effortlessly automate business processes.

This is great, but at Breadcrumb we like to think about user experience and improve it where possible. In this article I’ll share one simple trick that will make your workflow solutions shine.

To start a workflow in a SharePoint library, select a document and click the Flow menu to choose from the available workflows.

Starting a Flow in SharePoint

This works fine when there are only one or two workflows in the list, but for some libraries that involve complex business processes the list can expand significantly and make your users confused. This increases the chances of human-error and diminishes the value of automating a process.

SharePoint library Flow drop down box with lots of flow options

A simple solution we found for this problem is to add a ‘workflow start’ button to a column next to a document. For example, on the picture below you can see button ‘Request approval’ in the column ‘Approval’. The button allows users to send a document for approval with one click.

SharePoint library showing Flow request approval button

How to add buttons to your library

Let me assume that you already know how to create workflows for SharePoint using Flow. So, I’ll skip that part and jump straight to the solution.

First, you need to create a new column for buttons in your library. I created a ‘single line of text’ column and named it ‘Approval’. Next, you need to format this column with JSON.

SharePoint library screenshot, showing Approval column settings

In the text field enter JSON code.
{
"$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
"elmType": "button",
"customRowAction": {
"action": "executeFlow",
"actionParams": "{\"id\": \"994daa97-4947-41ad-9bcf-b9887c790bbd\"}"
},
"attributes": {
"class": "ms-fontColor-themePrimary ms-fontColor-themeDarker--hover"
},
"style": {

"border": "none",
"cursor": "pointer",
"background-color": "#FFA300",
"color": "#000",
"padding": "4px 4px 4px 4px",
"border-radius": "5px"
},
"children": [
{
"elmType": "span",
"attributes": {
"iconName": "Flow"
},
"style": {
"padding-right": "4px"
}
},
{
"elmType": "span",
"txtContent": "Request approval"
}
]
}

Now you need to link the button to your workflow. Go to Flow and open the workflow you’ve created for the library. Copy the Flow ID from the URL (it’s a string of numbers and letters located between flows/ and /details).

Screenshot showing how to link a button to your workflow and where to find the Flow ID from the URL

In the JSON find the line "actionParams": "{\"id\": \"FlowID\"}" and replace the text with the copied flow ID. If you have basic JSON skills you can modify the look of the button, icon and text to fit your workflow.

SharePoint screenshot to Format Approval column and the relevant JSON code

Following the same steps, you can create a few buttons for multi-step workflows. This solution can be implemented in SharePoint libraries as well as in lists.

SharePoint library showing multi-step workflows

In our experience, implementing buttons for workflows makes the user adoption process easier and quicker. It also helps mainstream and simplify complex business processes.