Skip to main content

Check out Port for yourselfย 

Customization & accessibility

Port offers various customization options to help you tailor the developer portal to your organization's branding and style as well as communicate important information to your users.

Portal customizationโ€‹

The title and logo of the portal (in the top left corner) are set to "Port" by default.

To change them:

  1. Go to the Builder page of your portal.

  2. Click on Organization settings in the sidebar.

  3. Change the Title and Logo URL to your desired values.
    The previews will update automatically with your changes, one for light mode and one for dark mode.

    Title scope

    This title is intended for visual purposes, it will only affect the text in the top left corner of the portal.

    It is not related to the title & identifier of your organization (i.e. the name & id returned by the Get organization details API endpoint).

  4. Click on Save.

Limitationsโ€‹

  • The title is limited to 30 characters.
  • The logo URL must be a valid public link (e.g. https://example.com/logo.png).

Add an announcement bannerโ€‹

Organization admins can configure an announcement banner that appears at the top of the portal for all users. The banner can be enabled or disabled at any time.

Users can dismiss the banner and it will remain hidden until the admin updates the announcement.

To add the banner:

  1. Go to the Builder page of your portal.

  2. Click on Organization settings in the sidebar.

  3. Open the Announcment tab, and toggle Enable announcement to turn it on.

  4. Fill in the banner details:

    • Announcement: The text that will appear in the banner. (Maximum 300 characters)
    • Color: Choose a color for your banner. Currently, the available colors are blue and red.
    • Link (optional): Add a URL to make the banner clickable and direct users to the provided link. (Maximum 300 characters)
  5. Click Save.

Dark modeโ€‹

To change the theme of the portal to dark mode:

  1. Click on the user button in the top right corner of the portal.

  2. Click on Theme to toggle between light and dark mode.

Accessibilityโ€‹

Port supports various hotkeys to help you navigate the portal using a keyboard.

Widget card navigationโ€‹

In dashboards, you can use Shift + Alt/Option + ArrowLeft/ArrowRight to jump between widget cards (wrapping around is supported).

Table cell actionsโ€‹

In tables, you can use Ctrl/Cmd + C to copy cell contents, and Ctrl/Cmd + E to edit or expand a cell.

Actions menuโ€‹

Some components have an actions menu that can be opened by clicking on the component and pressing Shift + Return (Enter).

This can also be used to drag/rearrange widgets in dashboards, or files/folders in the catalog sidebar:

Press Ctrl/Cmd + K to focus on the search bar.