Help & Documentation
Open Support Ticket

Overview of Portal Pages (prior to v7.1.0)

Portal Pages have been renamed to Apps in 7.1.0.

NOTE: For information on App (Portal Page) configuration in v7.1.0+, see Overview of Apps (Portal Pages).

Portal Pages enable the development of single webpages and multi-page websites hosted on Metric Insights. They are incredibly flexible, allowing you to utilize the basic toolset for building websites: HTML, CSS, and JavaScript.  The tools permit a User to create highly curated experiences around content from any source supported in Metric Insights.

Portal Pages can be embedded directly into your existing Metric Insights Portal, or you can use the Layout function to create your own branded portal or website in which to embed these Pages, with no visible Metric Insights UI.

1. Control the Use of Portal Pages

Access Admin > System > System Variables

NOTE: See Setting System Variables for details on System Variables configuration.

The use of Portal Pages can be controlled by the System Variables shown above:

  1. Enter portal in the search field
  2. Set ENABLE_ADVANCED_PORTAL_PAGES_R_SHINY to 'Y' to enable R Shiny Apps embedding directly to Portal Pages
  3. Set LOGIN_ERROR_PAGE to the value of Name used in URL of the Portal Page which should be displayed to users upon unauthorized login
  4. Set MOBILE_APP_PORTAL_PAGE to the value of Name used in URL of the Portal Page which should be displayed to mobile users when accessing Metric Insights via the mobile app
  5. Set MOBILE_BANNER_PAGE to the value of Name used in URL of the Portal Page that will display a banner when accessing MI from a mobile device, encouraging the user to download the mobile app
  6. Set PORTAL_MAX_TABS to the maximum number of tabs visible from the homepage
    • NOTE: The value of this System Variable does not include the Catalog Page in the tab count.
  7. Set PORTAL_PAGE_FILE_UPLOAD_LIST to a comma-separated list of allowed file extensions for Portal Page Assets uploading
  8. Set ENABLE_R_SHINY_WITHIN_APPS to 'Y' to enable R Shiny functionality within the Apps

2. Example of Portal Tabs

  1. The traditional Homepage in Metric Insights appears as Catalog.
  2. Portal Pages appear as tabs. Any of these Pages can be selected as a User's default Homepage upon entry into the system.

3. Create a Simple New Portal Page for Use in MI

Access Content > Portal Pages

  1. [+New Page]
  2. Provide a descriptive phrase in Name
  3. Provide a name to be used in page URL
    • Note: Letters, numbers, dashes and underscores are the only supported characters for Portal Pages' URL names
  4. Optionally, choose a Template
  5. [Save]

4. Configure Portal Page

It is possible to migrate Portal Pages by using Import/Export Utility. For more information, refer to All External layouts are client-specific and must be custom-designed. Contact support@metricinsights.com for assistance if you do not already have a layout for your website.

4.1. Basic Example of Finding the Code to Embed an Object

Proceed with instructions on finding objcect embedding code for your MI version:
v7.0.1+
  1. Access Preview of a desired Tile
  2. Click Share icon
  3. [Embed this instead]
  4. Scroll down to the bottom of the grid, [Copy Code] 

To locate the Embed codes for any Metric Insights object, refer to Embedding Overview.

Prior to v7.0.1
  1. Access Preview of a desired Tile
  2. Click Share icon
  3. [Embed this instead]
  4. [Copy Code] 

To locate the Embed codes for any Metric Insights object, refer to Embedding Overview.

4.2. Understanding Embedding Сode Options

Proceed with instructions on object embedding configuration for your MI version:

v7.0.1+
  1. Element View: Type available:
    • Tile: Displays the element exactly as it appears in the Catalog View
    • Preview: Displays the same image used for the Homepage Preview
    • Live Dashboard: Displays the element as seen in the Viewer, but without the Viewer’s navigation bar
    • Viewer: Displays the element as seen in the Viewer, including all interactive features
  2. Determines if clicking on an element will open that element in Metric Insights; i.e., a Tile in MI vs. visualization in an external BI tool
  3. Determines if clicking on a link will open that link in a new browser tab
Prior to v7.0.1
  1. Language:  Choose to create the code in either HTML or JavaScript. The examples used here are for HTML, but the process is the same
  2. If the element is Dimensioned, choose to display "All" or select a specific Dimension Value from the drop-down list
  3. Element View:  Type available:
    • "tile": identical to view of tile on Catalog View
    • "tile Chart": same image as above only larger
    • "preview": an interactive image with additional detail as shown in Preview on Catalog View
    • "full Chart":  an interactive image as shown on element Viewer
    • "viewer": not currently supported
  4. If the element is Dimensioned, select the format for display of Dimension Values; e.g., the default of 1x1 allows viewing of additional Dimensions via a scroll bar
  5. Determines if clicking on an element will open that element in Metric Insights; i.e., a Tile in MI vs. visualization in an external BI tool
  6. Determines if clicking on a link will open that link in a new browser tab

4.3. Syntax of Embedding Codes for Creating Custom Embed Codes

Once you copy some embedding codes, you can easily duplicate and create new codes without going into Metric Insights to Copy code. See Rules and examples here.

4.4. Example Results (with Custom Formatting Added)

5. Sharing Portal Pages

  1. The access restriction toggle is enabled by default, meaning that the User who:
    • is not in share Access list (specified below) AND
    • does not have edit access to the Portal Page AND
    • is not Admin
  2. Will see the Access Denied message that can be customized.
  3. Optionally specify the User types which will see the Portal Page in their navigation bar

For more information on Portal Page security, refer to Portal Page Security article.

5.1. Add Groups and Users Manually (via Portal Pages)

  1. [Add Group/User]
  2. Select Group/User
  3. Specify if the Page will display when the User initially signs on to Metric Insights
  4. Specify if the Page will display when the User initially signs on to Metric Insights via the mobile app
  5. [Save]

User may override their Starting Location by using the My Setting menu option under their name. Once a User has set their Starting Location via the My Setting options, it cannot be overridden on either the User Editor or the Portal Page.  See more information on Setting a Portal Page as your Start Location

For each Group chosen from drop-down, all Group members inherit Portal Page Access .

5.2. Sharing with Groups and Users Manually (via Group or User Editors)

Access the Portal Pages section on Other Access tab on either Group Editor or User Editor

  1. [+ Portal Page for Group/User]
  2. Select Page from a drop-down
  3. Specify if the Page will display when User initially signs on to Metric Insights
  4. [Save]

On User Editor, Portal Page Sharing is inherited from Groups will display as well as those individually assigned to an individual User:

Starting location assigned on User Editor will override assignment inherited from either Group or Portal Editors.

If User sets Starting location on their My Settings screen, this choice overrides any settings on User, Group, or Portal Editors.  See Setting a Portal Page as your Start Location

5.3. Copy Access Rules from Another Portal Page

You can view the Share options for your chosen Portal Page using the Edit icon to access that Portal Page Editor > Sharing tab.

Any updates to the Share options in Page B will now automatically be applied to Page A.

5.4. Assets: Add Images or Animations for Use in Portal Pages

For v7.0.1+: Access Content > Portal Pages > Global Assets

For versions prior to v7.0.1: Access Content > Portal Pages > Assets

You can:

  1. Create [New Folder] for uploading style sheets, JavaScript files, or images
  2. Upload files located locally via [Select Images, JavaScript and CSS assets that are needed to construct Apps]
  3. Upload files by dropping them on the page
  • It is highly recommended that all custom files are uploaded into Assets to ensure a seamless experience with the Portal Pages functionality. Assets are used with both Portal Pages in Metric Insights and with external Portal Pages.

6. Configure Advanced Settings

Proceed with instructions on advanced settings configuration for your MI version:

v7.0.1+
  1. Toggle on to enable receiving POST requests from sites other than the current MI instance
  2. Support v6 App Code: Enable this option if your App contains v6 code and you want to make it compatible with v7
  3. Asset Browser Cache Setup: Set up cache lifetime for Assets
  4. Custom Domain: Enter a Custom Domain for the App

For image collection, you can decide when the system should take a screenshot of App or how much time an App can take to load before the system takes a screenshot of that Page:

  1. Timeout: Specify a time interval after which a screenshot is taken once the App is opened
  2. Screenshot on: Select a condition of taking a screenshot. Note that a screenshot will be taken when the selected condition is met or after the time interval specified in the Timeout field has elapsed
    • Only on Timeout: A screenshot is taken after time interval specified in the Timeout field
    • Element Removed from Page: This condition is appropriate if you want a screenshot to be taken after some element disappears from an App. The element can be set in the CSS Selector field; e.g., if you want a screenshot not to be taken until the App is fully loaded, enter .loading to the CSS Selector field
    • Element Added to Page: Select this condition if you want a screenshot to be taken when some element appears on an App. The element can be set in the CSS Selector field
  3. [Save]
Prior to v7.0.1
  1. Toggle on to enable receiving POST requests from sites other than the current MI instance
  2. Custom Domain: Enter a Custom Domain for the Portal Page
  3. See Configuring a Custom Domain for a Portal Page for details on Custom Domain configuration

For image collection, you can decide when the system should take a screenshot of Portal Page or how much time a Portal Page can take to load before the system takes a screenshot of that Page:

  1. Timeout: specify a time interval after which a screenshot is taken once the Portal Page is opened
  2. Screenshot on: select a condition of taking a screenshot. Note that a screenshot will be taken when the selected condition is met or after the time interval specified in the Timeout field has elapsed
    • Only on Timeout: a screenshot is taken after time interval specified in the Timeout field
    • Element Removed from Page: this condition is appropriate if you want a screenshot to be taken after some element disappears from a Portal Page. The element can be set in the CSS Selector field; e.g., if you want a screenshot not to be taken until the Portal Page is fully loaded, enter .loading to the CSS Selector field
    • Element Added to Page: select this condition if you want a screenshot to be taken when some element appears on a Portal Page. The element can be set in the CSS Selector field
  3. [Save]