Video Walk through of this Tutorial

If you would like to see this Approval Widget in CRM Use Case in action, click this video below.

General Description

This example shows users how to use the power of the ProcessMaker I/O workflow engine as an integrated widget in an easy way. In this use case, Processmaker I/O is integrated with a sample customer CRM system to add workflow and bpm features.

In this example, we will build on top of a free, open-source CRM called Flarepoint. However, this could be done with ANY CRM. For our CRM use case, we have created a Loan Management example. Banks, companies, credit unions, government agencies, and many more types of entities are often faced with the challenge of expanding their CRM usage to incorporate the management of a decision process, such as a loan approval process. This pushes most CRMs beyond their capabilities because CRMs are not workflow automation systems, they are transactional systems. As such, they don't have a way to manage decision flows that involve embedding APPROVE / REJECT decisions in the system. Previously, the alternative was to add a full blown BPM system to the mix to pass information from the CRM to the BPM system to manage approval workflows. Now, ProcessMaker I/O can be integrated with a CRM to bypass adding an entire BPM system. It is light-weight and allows users to add this decision point and workflow directly into the CRM system.

So, in this example, we have added the loan approval workflow directly to the Flarepoint CRM system. You still manage all CRM functions as you would normally - adding clients, managing their profiles, documents, etc - but now you can create loans that generate an approval workflow with full routing controls. In the picture below you will see the Approve/Reject buttons in green and red. These have been added to the CRM to generate actions in the ProcessMaker I/O API.

Alt text here

Getting Started with the Use Case

How to Launch an Environment* of ProcessMaker I/O

*ProcessMaker I/O is an "always on" cloud service. In this document an Environment refers to an installation of ProcessMaker I/O in a virtual machine or a container. This environment is created, launched and managed directly through the ProcessMaker I/O web management console.

If you don't have an Environment of ProcessMaker I/O yet, please:

  1. Go to the Environment page.
  2. Click Create an Environment and follow the instructions provided.

If you already have a ProcessMaker I/O Environment, please:

  1. Launch an Environment of ProcessMaker I/O on the Environment page.
  2. Copy the Environment URL link; it will be required later as your-environment-url, (as example "your-environment-url" is "", where "MYENVIRONMENT" is your "Processmaker I/O environment name")
  3. Click on the Examples - "Click to open" link in the Environment Info tab
  4. Switch to the CRM example tab on the left menu
  5. Click the Processes tab.
  6. Click the Upload Process Scheme button.
  7. Click the Choose File button.
  8. Click the Import button to upload the revised BPMN file from your computer to your Environment.
  9. After going to ProcesMaker I/O SDK you should create another user to use in our example later.

How to Set Up and Integrate a ProcessMaker I/O Widget to Use with a Custom CRM

Follow the next steps to integrate our CRM with ProcessMaker I/O.

  1. Generate user access token keys for both users to give them access to the ProcessMaker I/O API.
  2. After generating the token keys, you should bind them to the users in the CRM.
  3. For any requests to the Processmaker I/O API, you should get the external URL of the ProcessMaker I/O environment (example:
  4. Before you start, you should download an example of the process in .bpmn format and import it to the ProcessMaker I/O environment using our portal

How to Run the Process:

Make a request to the start event "Loan Requested" of the ProcessMaker I/O endpoint by calling a "webhook" using the GET method on the event.

When the CRM creates the new loan (example of request:) then pass the following in GET arguments:

*Amount - requested amount, *Case_ID - ID of the case in the CRM system, *CRM_callback - the URL for call backs that can be used for reverse connections.

Initiate the widget - it will listen for the statuses of newly created loans and make the following requests to the ProcessMaker I/O environment:

Check the Status of the Manager Task:

*Request the process instance ID by passing "case_id" to the request (example: processes/Loan%20Request/datamodels/search/case_id='+{{case_id}}).

*After that, we can use the instance ID and the name of user task (Manager approval) to retrieve the delegated task for our Manager user: "instances/instanceId/tasks/Manager%20approval/task_instances/delegated"

In our case there will be 1 delegated task. We should show 2 buttons - decline and approve.

To save the manager's decision, we should make a PATCH request to the "task_instances/taskInstanceid" API endpoint by passing the updated decision parameter and turning on tasks with COMPLETE status in the data model:

data = {
  'data': {
    'attributes': {

Show message: You've made a decision.

The same logic can be applied to the Big Boss decision:

Check the Status of Big Boss Task:

*Request the process instance ID by passing "case_id" to the request (example: processes/Loan%20Request/datamodels/search/case_id='+{{case_id}}) The request delegated to the Big Boss is: instances/instanceId/tasks/Big%20boss%20approval/task_instances/delegated and as in the Manager side, pass the updated decision parameter and turn on tasks with COMPLETE status:

data = {
  'data': {
    'attributes': {

After that, operations in the ProcessMaker I/O instance will run "Reject Case Http connector" or "Approve Case Http connector" and will make the request to our CRM with the call back URL that we passed to the Start event with the final status of the case: approved or rejected. Our CRM turns on the case status according to the final status.

How to Install FlarePoint CRM with the Integrated ProcessMaker I/O Widget

To demonstrate all the theory described below, you can use our already modified Flare Point CRM.

How to Install Flare Point CRM

  1. Insert the project into an empty folder / git clone address of changed CRM REPO

  2. Create an empty database table

  3. Copy .env.example to .env and insert the Database config

  4. Run the following commands:

    composer install
    php artisan migrate --seed
    php artisan key:generate
  5. Log in with these credentials: Email:, Password: admin123 (can be changed on the dashboard)

Set Up the Processmaker I/O instance

  1. Go to Settings >Integrations and paste the URL of your ProcessMaker I/O instance core.

Alt text here

  1. Go to the Users section and paste the access token keys for the two users that you got from ProcessMaker I/O instance core. Alt text here

Subscription Use Case

Process Description

Imagine we have an external CRM system. We want to add the ability to create and approve loans for our CRM customers. We have 2 CRM users (Manager and Big Boss) that have to make a decision to approve or reject a loan request depending on the amount of the loan.

  1. Manager creates a new loan in the CRM and fills in the request with customer data or uses the current loan request
  2. Manager assigns this loan to the Approver
  3. Approval process starts and the approval widget appears in the CRM interface (ah...the magic happens)
  4. Manager makes the decision
  5. If the amount is >50K, the loan is moved to the Big Boss for approval
  6. When all decisions are made, the Script task records this operation to the log file
  7. Decision for the loan is recorded to the CRM

Process Scheme

Alt text here

Download BPMN file

Download Approval BPMN file