In-app online-add-ons and Webhooks enable extending Pepperi's functionality using 3rd party or in-house custom applications.

There are several kinds of add-ons:

Webhook add-on - when pressing the submit button triggers an HTTP post to a pre-configured URL and ets back an HTML response that is presented to the end-user , and can be defined as part of a Workflow.
UI Add-ons

1. Read Only - enables placing a menu item within the Mobile App that displays an external HTML page based on the user and account you are opening it from (query string parameters) - mainly used for BI Reports and Dashboards.

2. Read/Write - enables placing a menu item within the Mobile App that displays an external HTML page based on the user and account you are opening it from (query string parameters) - and enables getting data from that page and updates the App's Data Model and is later synced to the server. This is a very powerful tool that enables extending the business logic functionality of the App. For example to present a web page that validates addresses or gets a UPS price for a package and updates Pepperi with it.

This article will explain online add-ons in Pepperi, give examples of use cases and give detailed instructions on how to create them within the Pepperi Web Admin.

Examples of online add-ons

1. UI Add-on Read Only – This add-on is a URL that displays any type of data from your back office system (reports, charts, etc.). The URL is context sensitive to the screen from which it was opened in Pepperi (parameters from the Pepperi app may be used in the URL). The report can be launched from buttons positioned in the app menus, as shown below.

Examples of UI Add-on Read Only:

Real time Account statistics (purchasing goals, plans, payments, debts).
Order attributes such as an Account shipping address code.
View Account documents (such as contracts, etc.).
Sales Rep information (targets, discounts, budget status).
View marketing material about products, brands, company events, etc.

2. UI Add-on Read/Write – This add-on displays a URL a form that can be filled in by the Sales Rep, submitting data to external sources (such as ERP, CRM, other). The form is submitted and the result is returned via XML and displayed in Pepperi to the sales rep. The form can be launched from buttons positioned in the app meanus, as shown below.

Examples of UI Add-on Read/Write:

Info about special offers, discounts and packages.
Update the cart with additional items, and special offers/discounts during an order.
Suggest complementary items for the customer to add to the order (ie. If you bought this… you might like this…).
View real time inventory updates.
Update any order header information – such as addresses, payment terms, delivery methods, date, and many more (fields will be updated on copy of the order sent to configured destinations).

3. Webhook Call – this type of add-on is executed upon submission of an order in Pepperi. A call is executed from Pepperi's servers to a web service that processes the order and waits for a returned status and optionally an HTML message to send back to the user. The Webhook call is launched when the Submit button is pressed in the cart in the app.

Examples of Webhook Call:

Real time integration to your back-end systems with an instant response from your system to the sales rep - an HTML message that presents the Order number in your system, its status, and optionally a link to edit it online.
Real time verification of inventory quantities on hand, prices, special offers, or discounts of items.

User Interface

The UI add-ons are accessed through a menu option or button positioned in the mobile app. A dedicated browsing window is then opened.

The Webhook call is initiated upon pressing the Submit button in the cart.

This article explains:

How to create a UI add-on
How to position a UI add-on in the App Menus
How to position a display only UI add-on (display a URL) as a button on the App HomeScreen
How to connect a Webhook add-on to a Transaction Type "Submit" button

How to create a UI add-on

Go to Settings -> Configuration files -> Online add-ons

Click "Add New Online Add-on"

Fill in the following fields:

Name: Give your add-on a name. It will be displayed in the menus where the add-on appears.

Description: Write a short description about the add-on. This is for your own reference and will not appear anywhere in the app.

Type:

Display (UI Read Only) Used to display the URL, for marketing information or any other online web pages you wish to make available within the app. For example a link to company blog or social media, product info online, and more. These types of simple URL add-ons can be configured to appear as buttons on the App Home Screen, as well as positioned in the Order Center and Cart menu. For more details on displaying marketing information see: How to add shortcuts to links on the App Home Screen

Order Center (UI Read/Write) - These are UI Read/Write add-ons that are used when the web service is called from the Order Center after a Transaction has been started. These types of online add-ons need to be positioned in the Order Center menu. For details on how to position the online add-ons see below.

Order Submission (Webhook) - These are Webhooks that are used when when tapping submit on an order in the cart.

URL: Enter the URL of the web service or Webhook being called. The web service is a program written by your company for the specific purpose of being used from within Pepperi. If it is display only, you can enter any URL you wish to display. For ex: https://www.mycompany.com/blog

Icon: Select an icon that will be used to represent the online add-on in the menus and dashboards.

How to position the online add-ons in the Order Center or Cart Menus

After creating the online add-on it needs to be positioned within the app menus for the user to access and run it.

To position in the Order Center Menu go to:

Settings -> Sales Activities -> Transaction Types

Edit the Transaction Type where you want to position the add-on.

Go to the "Views and Forms" Tab and select "Menu"

Transaction Menu - Configures the options available in the menu in the Order Center and the Cart.

Edit the Rep form (or any other profile form) and add from the Online add-ons section in the Available fields to the Layout.

You may of course also add other menu options that are out of the box Pepperi features to this menu, such as Favorites, Wishlists, Order duplication, PDF, Order details form access, etc. . .

The online add-ons added to the layout will appear in the menu in both the Order Center and Cart.

How to position an online add-on (Read only) in the App Home Screen

To position the online add-on on the app home screen:

Go to Settings -> Company Profile -> App Home Screen

Edit the Rep form (or any other profile) and add from the Online add-ons section in Available Fields to the Layout.

The URL will open when the button is tapped on the app home screen.

For more information on the app home screen see: App Home Screen Configuration

How to connect a Webhook add-on to the "Submit" button of a Transaction

Go to Settings -> Sales Activities -> Transaction Types

Edit the Transaction Type you wish to add the Webhook for.

Go to the Workflows tab and select "Add Online Add-on"

Select the Webhook that should be associated with this Transaction Type from the menu.