1. Configuring Applications Using Application Composer
  2. Embed a Registered Web Application into Your Application Page

Embed a Registered Web Application into Your Application Page

You can choose to embed a registered web application into your own application as a new subtab or as part of the Summary subtab.

Embed a Web Application as a New Subtab

  1. Click the Create Subtab icon from the Pages Overview page or from the details page layout.

  2. Select Mashup content.

  3. On the Select Mashup Content page, select the web application that you want to embed.

  4. Click Insert.

  5. On the Create Subtab page, in the Display Label field, enter a name for the new subtab.

  6. A default Display Icon appears. You can change the icon by clicking Change Icon.

  7. Enter the URL information depending on the type of mashup:

    • For a parameter-based mashup, enter the parameter values in the Add Parameters section. These parameters are appended to the web application's URL as key-value pairs.

    • For a groovy expression mashup, edit the base URL in the Edit Script section.

  8. Click Next.

  9. On the Additional Layouts page, if more than one details page layout exists, click Next to optionally select other details page layouts that will display this subtab.

  10. Click Save and Close.

The new subtab with the web application appears as the last subtab on the Edit page.

Here's a screenshot showing a sample Wikipedia article mashup:

This is an illustration of a web application embedded into an application page as a new subtab.

Embed a Web Application into the Summary Tab

  1. In Application Composer's object navigation tree, expand the object.

  2. Click the Pages node.

  3. On the Application Pages tab, under Details Page Layouts, duplicate the standard layout to create a new layout to edit, or edit another existing layout.

  4. Click Add and select Mashup Content.

    This screenshot illustrates how to embed a mashup in the Summary tab of an application page.

  5. On the Select Mashup Content page, select the web application that you want to embed.

  6. Click Insert.

    This is a screenshot of the Select Mashup Content page, where you select the mashup that you want to embed in your application page.

  7. To allow your users to expand and collapse the embedded web application, select Enable expand and collapse.

  8. Enter the URL information depending on the type of mashup:

    • For a parameter-based mashup, enter the parameter values in the Add Parameters section. These parameters are appended to the web application's URL as key-value pairs.

    • For a groovy expression mashup, edit the base URL in the Edit Script section. For example: return /wiki/CRM", which opens the Wikipedia's CRM page on your application page.

      This is an illustration of embedding a groovy expression mashup.

  9. Click Next.

    This is a screenshot of the Additional Layouts page that lets you select any other layouts that you want to embed the mashup into.

  10. On the Additional Layouts page, select any other layout that you want to embed the web application into by moving it from the Available Layouts list to the Selected Layouts list.

  11. Click Save and Close.

The embedded mashup appears at the end of the Summary subtab.

Here's a screenshot showing a sample Wikipedia article mashup.

This is an illustration of a web application embedded into the Summary tab of an application page.

Optionally, you can enable your embedded application to call CRM APIs using JSON Web Tokens (JWT) by including window.postMessage() in your mashup content. See Enable Your Embedded Application to Call CRM APIs for detailed information.

Related Topics