Share airfocus items with the customizable Portal app

Create a portal

1. Click the plus icon to the right of "Portals" in the navigation on the left side to get started.
2. Add a portal name and URL.
   • By default, the Portal’s name will be copied to the URL field (excluding special characters). Only letters from a - z, numbers 0 - 9, and dashes are allowed. The portals are hosted and suffixed with the “airfocus.site” domain. Portal URLs must be unique.
3. Optionally, customize your portal with additional security, a logo, a favicon, or a primary color. See the sections below for more details.
4. Click Create portal.

Sharing your portal (password restriction & SSO)

When creating your portal, you can set additional security with the following options:

• Password: Users are asked to enter a password before accessing the portal.
• Require login: Requires team members to log in with their airfocus credentials before being able to access the portal. 
  • If SSO is enforced for your team, this setting will instead enforce single sign-on for portal access. Users who are authorized via your existing SSO/IdP automatically have a contributor account created within your team upon signing up for airfocus.

Portal customization

You can optionally customize your portal with a logo, favicon and primary color:

Logo

Make sure your images don’t surpass the maximum allowed ratio of 9:1.

The logo will be displayed in the top navigation bar in the Portal.

Favicon

• The favicon will be displayed in the browser tab and link share thumbnails.
• Make sure they have a ratio of 1:1. 
• Allowed formats are: .svg, .ico, .png.

Color picker

Either use a 6 digit hex code of the brand color that will be applied to the theme of the portal or use the color picker option to pick the color directly from the logo you have already uploaded.

You can access the Portal settings and change them using the setting button next to the Portal's name in the navigation menu on the left side of the page.

Add a page to your portal

Pages are the top-level navigation elements of your portal. Use them to show selected workspace items or to link to external URLs. Pages can be customized to fit your brand and messaging.

After creating your portal, you'll be taken to the portal settings. From there, follow these steps to add a page:

1. Select Pages from the navigation menu at the top of the settings panel.
2. Decide whether you would like to post items from one of your workspaces to the portal or if you’d like to link an external URL to it.
   • External URLs will open in a new browser tab. This could be useful, for example, to link to your company’s “About us” page.
3. Enter the page name and URL.
   • By default, the page name will be copied to this field (excluding special characters). Only letters from a - z, numbers from 0 - 9, and dashes are allowed.
4. If you're adding an external URL as a page, click Add page to finish. If you're adding a workspace, continue on with the following steps.
5. Using the "Workspace" dropdown, select the workspace you want to add as a page in the portal.
6. Optionally, set up the following:
   • Tabs: Group items into tabs using a single-select field.
   • Sections: Organize items into sections using a single or multi-select field.
   • Additional fields: Choose additional fields to display on each item published to this page.
   • Allow filtering: Let end users filter by any field listed under "Additional fields".
7. Optionally, enable the Forms or Voting apps. Make sure the app is active on the workspace before activating it for the page.
   • Activate the Forms app to allow portal visitors to provide feedbac.
   • Activate the Voting app to allow portal visitors to vote.
8. Optionally, enable the following:
   • Hero section: Add a headline and description to provide context to your page visitors.
   • SEO: Configure SEO metadata and search engine indexing.
9. Click Add page.

After you've added a page, ensure the toggle at the top of the page settings is on if you want it to be shown on your portal.

The green globe icon indicates a portal that is live, an orange globe indicates that the portal is not live. By hovering on top of the globe icon, you’ll get an explanation of each status.

Add your workspace to multiple portals

You can also choose to add your workspace as pages to more than one portal.

To do this, follow these steps:

1. Click Extensions from the top-right corner of the workspace.
2. Select Portal.
3. Click + Add to portal from the bottom of the panel.
4. Create a new portal to add the workspace to, or select an existing one.

You can either choose to reconfigure an existing page or add your workspace as a page to another portal.

Post an item to your portal

If you have added your workspace as a page on your portal, you can post items directly from within the item details view. You can customize your items with customer-friendly names, descriptions, and even cover images.

Go to the workspace you used for your page by accessing it from within the Portal settings or the airfocus overview, then follow these steps:

1. Open an item that you want to show on your portal.
2. Select a portal from the top-right corner of the panel that appears.
3. Optionally, upload a custom image for the item, add a title, and write a description for viewers to see from your portal.
4. Toggle on "Post item to portal".
5. Click Save.

Quickly jump to the published item on the portal by clicking on the link (this only appears if your portal is already live).

The green globe icon indicates a portal that is live, an orange one indicates that the portal is not live. By hovering on top of the globe icon, you’ll get an explanation of each status.

Set your portal live

Before you set your portal live and share it with your audience, make sure you have added a page and posted an item.

To set a portal as live, follow these steps:

1. Select the portal from the navigation menu on the left side of any arifocus page.
2. Toggle on "Set portal live" from the top of the panel that appears.

Embed your portal

Once your Portal is live, copy its URL and place it within the following code-block:

<iframe src="PASTE-YOUR-PORTAL-URL-HERE" frameborder="0" width="100%" height="100%"></iframe>

For example:

<iframe src="https://airfocusportal.airfocus.site/" frameborder="0" width="100%" height="100%"></iframe>

You can use the iframe code on your website or anywhere you’d like your users to see your Portal so that they can interact with your Portal directly.

Remove logo from your portal header

When embedding a Portal to your website, having your logo repeated twice on your embedded Portal and on your website may seem repetitive. To remove one of the logos, follow these steps:

Add an additional ?mode=embed&hideLogo=true to your airfocus Portal URL.

For example, if your URL is https://airfocusportal.airfocus.site/ , then your new URL becomes https://airfocusportal.airfocus.site?mode=embed&hideLogo=true

Add the new URL above to the iframe src, and your iframe embed code will now be ready:

<iframe src="https://airfocusportal.airfocus.site?mode=embed&hideLogo=true" scrolling="no" frameborder="0" width="100%" height="100%"></iframe>

Give feedback on this article