API-driven checklist items

If tours or URL links are not enough for your checklists, the API-driven items are here for you.

API-driven checklist items are a big help when you need more advanced onboarding flows. For instance, if you want the user to fill multiple forms and finish an advanced account setup, it's quite difficult to accomplish using Product Fruits base functionalities. API-driven items are entirely controlled by your code.

How to use API-driven checklist items

First, add an API-driven item in the Product Fruits administration.

You must assign an Internal ID. This ID will identify the item in your code. It can be any string.

Code flow

Listen to the item-launched event and launch any action you need in your code.

window.productFruits.api.checklists.listen('item-launched', (id, internalId) => {
	console.log('Identify the item by internalId and launch an action.');
}); 

When the action in your application is done, you will probably want to mark the item as completed.

window.productFruits.api.checklists.markItemAsDone(internalId, true);

The internalId identifies the item to be marked as completed.
The second parameter (boolean) determines whether the checklist pop-up should be expanded:

  • true: Expands the pop-up.
  • false: Does not expand the pop-up.

Conclusion

API-based items provide complete flexibility to integrate custom actions into your checklist. Use them to create advanced flows tailored to your product's specific needs and enhance the user experience during onboarding.

Was this article helpful?