Custom branding your app

“Branding,” as the positioning pundits are fond of saying, begins with well… er… the brand. You can build white label apps for your clients and customers using Flow. If you like, you can also add your own logo to any apps you build.

The easiest way to do this, is to upload the logo as an asset, and insert the asset into the content editor of a Step element, or the presentation component of a page layout.

Uploading the logo

  1. Click LOG IN to login to the Boomi Flow Drawing Tool.
  2. Click Assets.

    This opens the Assets tab.
  3. Click Upload.

    This opens the Upload dialog box.
  4. We can either drag the logo file, or click Add files to select a file from the computer.
  5. Click Upload.

    This uploads the logo as an asset. We use the following URL form to store/retrieve assets — https://s3.amazonaws.com/files-manywho-com/{Tenant ID}/{Asset name}
  6. Click Close.

Using the logo in a Step element

  1. Let’s say we have a Step element. Click Insert in the configuration panel.
  2. Select Image.

    This opens the Insert/edit image dialog box.
  3. Click the folder icon next to Source.

    This opens the Flow Assets dialog box.
  4. Select the logo.
  5. Click Insert.
  6. We can resize the logo here, if we like. Click Ok.

    This inserts the logo in the content editor.
  7. We can add whatever content we like in the editor. For example, we can copy-paste the text Flow is brought to you by Dell Boomi. Click Save Step.

When we run the app, this is how the logo is rendered:

Using the logo in a page layout

  1. Let’s say we have a page layout. Drag a Presentation component to the Main container.

    This opens the page component configuration panel.
  2. Type Logo in the Name field.
  3. The content editor used in the page component, is the same as the editor in the Step element. Let’s follow the procedures mentioned for: Using the logo in a Step element (Please see the section above). Click Save Component when done.

    This is what the page layout looks like now.

    We can keep adding subsequent components to the page.

This is how the logo is rendered in the page:


If you need to take a closer look, click on the images to enlarge them. Have a question? Click the Help button on the bottom right-hand corner of this page to ask.

Check out the glossary for a definition of terms and key concepts that appear in the Boomi Flow website, Drawing Tool, technical documentation, blogs, and marketing communications.