Installing Partner AddOns

1. Getting started
2. Installing an AddOn
3. Adding client-side configurations for AddOns

Getting started

You can use ready-to-go AddOns to extend the functionality of BEE (you can also build new AddOns).

To browse and install existing AddOns, log into the BEE Plugin Developer Portal and click on Details to navigate to the application details page.

In the lower part of the page, locate the Application configuration section and click on AddOns.

You will be taken to a page that lists the AddOns that have been installed for this application. If you are just getting started, the list will be empty.

Click on Browse Partner AddOns to get the list of ready-to-install AddOns. We call them Partner AddOns because they were developed by companies that partnered with us to extend BEE’s core functionality.

You will deal directly with those companies with regard to signing up for an account, cost, support, etc.

You will instead click on Create a Custom AddOn if you want to build a new AddOn for BEE.

Installing an AddOn

When you click on the Browse Partner AddOns button, a list of AddOns is displayed. You can browse them and select what you need to install.

After installing a Partner AddOn, you will need to configure it by clicking on the Edit action. A form will be displayed.

At the top of the form you will find the AddOn name and some links to the AddOn documentation. If any signup is required, that is the company that you will need to contact.

Below that, you will see the following form fields:

• API Key
  Shown if this is an AddOn where a signup is required (you will be provided with an API key once you have signed up). Contact the provider of the AddOn if that is the case, so that you can learn about signing up, costs involved, the type of support they provide, etc.
• Handle
  A unique identifier for this AddOn. You will use this unique identifier to pass information to the AddOn from your application, if and when needed.
• Enabled
  A toggle element to enable and disable the AddOn. When toggled OFF, the AddOn is not visible to end users of the editor in your application.
• Icon
  If you want to customize the icon associated with the tile shown in the editor’s Content tab, you canupload an image from your local PC. Choose an image that is small in size: we recommend a 64 x 64 pixel SVG file.
• Labels
  • Title: This is the name that will be used for the tile in the BEE editor’s Content tab (e.g. “Countdown timer”).
  • Call-to-action button: The label for the call-to-action button (e.g. “Select a Countdown Timer”), which is shown to end users on the button to configure the AddOn.
  • Placeholder text: The message shown to end users in the editor’s stage when the tile is first dragged and dropped into it.

With the following setup…

… you would get the following outcome:

Title for the content tile

Placeholder text and button

It displays when the AddOn is added to the editing stage and invites the user to take the next step.

AddOn selection button in content properties

When the AddOn content is selected, the same button is displayed in the content properties.

Adding client-side configurations for AddOns

Once you have initialized BEE Plugin, you can pass a series of configuration parameters to it.

The AddOn section of the configuration allows you to override the parameters you configured in the Developer Portal, on a per-user basis.

For example:

• You can have an AddOn enabled at the application level, but disabled for users on a lower plan (so they have to upgrade to a higher plan in your app to get it).
• You could change the language used for the AddOn text labels depending on the language used for the editor, for that user.
• Etc.

Example

addOns: [
  {
    enabled: true,
    id: "", 
    label: 'Default title label override',
    ctaLabel: 'Default CTA label override',
    placeholder: 'Default stage placeholder override',       
  },
  {
    enabled: false,
    id: "",
  }
]

Params:

• Boolean. When false, the AddOn content is not displayed in the Content tab.

id

• Identifies the AddOn by using the handle provided in the configuration form.

label

• The text string displayed for the AddOn tile in the Content tab

ctaLabel

• The text string displayed in the button that triggers the AddOn action.
• It’s displayed in:
  • The content placeholder (before any content is applied)
  • The content properties

• Text displayed in the content placeholder to provide further information about the content.