Dev Portal customization

Beta and uses: Dev Portal

Visibility

All menu items have visibility controls, which determine which developers can see different menus. Visibility is Private by default, and will only be displayed to logged-in Developers. If Public is selected, the menu item will be available to all visitors to your Dev Portal.

Main menus are a flat list of links that will be added to the header of every page in your Dev Portal. These titles and links will be spaced evenly horizontally.

Footer menus allow you to create a set of columns with links for global navigation. Select Footer Sections Menu from the dropdown list to begin creating your menus.

Footer sections create vertical columns across the bottom of every page, with the logo from Appearance on the left side. We recommend creating your desired footer sections before creating footer menu items.

Footer menu items are links to any URL you prefer, with a title to be displayed. Items must specify a footer menu section.

Footer bottom menu is a flat list of links that will be added to the bottom of every page. Footer bottom menus are placed below footer menu sections.

SEO customization

To optimize how search engines crawl your Dev Portal, you can provide a /robots.txt directly.

Portal editor

The Portal Editor provides you with a variety of tools for creating highly customized content for your Dev Portal. Navigate to a specific Dev Portal, and select Portal Editor from the left sidebar.

Pages are built using Markdown Components (MDC). Additional documentation on syntax, as well as tools for generating components, are available on a dedicated MDC site.

Appearance

Appearance settings are applied globally to all pages in your Dev Portal. You’ll find the Appearance icon in the left sidebar of the Portal Editor.

Basic appearance settings quickly create basic styles for your default Portal template:

Setting	Description
Theme	You can choose from default light and dark options. This changes the background and text in your default template. Dark or light theme is not selectable by developers.
Brand color	This color is used to set the primary color in the default template.
Portal logo	Automatically used in the header and footer menu sections to ensure consistent branding across pages.
Favicon	Icon displayed in the browser tab and Favorites for Dev Portal visitors.

Custom CSS

For advanced needs, you can also create custom CSS that applies custom styles to your Dev Portal. Custom CSS provides global customization to all pages in Dev Portal.

Preview panel

The preview will automatically show what your page should look like when developers view your Dev Portal. In the event that it fails to refresh after editing the page, there is a refresh button next to the generated URL at the bottom.

There are three icons above Preview that allow you to test adaptive designs in some predefined viewports:

Desktop
Tablet
Mobile

Generated URL

Custom pages allow you to define a page structure/tree that organizes your pages and generates the page URL based on page slugs. The generated URL is shown at the bottom of the preview pane.

FAQs

What are the limitations of the Dev Portal Preview feature?

The Preview feature only displays Visibility: Public assets like APIs and Menus because it does not simulate a logged-in Developer context.

Preview behavior examples:

Private Pages can be previewed.
Private APIs will not appear when using the :apis-list MDC component.
Private Menus in headers or footers will not be shown.

Dev Portal customization

Menu customization

Visibility

Main menu

Footer menu sections

Footer bottom menu