自定义开发人员门户页面的样式

在 Azure API 管理中自定义开发人员门户有三种最常见的方法:

本文介绍如何自定义旧版开发人员门户页面上元素的样式并查看更改 。

显示在旧版开发人员门户中更改设置的位置的屏幕截图。

注意

以下文档内容与已弃用的开发人员门户有关。 你可以像往常一样继续使用它,直到它在 2023 年 10 月停用,届时将从所有 API 管理服务中将其删除。 弃用的门户只会接收关键安全更新。 有关更多详细信息,请参阅以下文章:

可用性

重要

此功能在 API 管理的“高级”、“标准”、“基本”和“开发人员”层中可用 。

有关 v2 层 (预览) 的功能可用性,请参阅 v2 层概述

先决条件

自定义开发人员门户

  1. 选择“概述”。

  2. 单击“概述”窗口顶部的“开发人员门户(旧版)”按钮 。

  3. 在屏幕的左上方,可以看到由两支画笔构成的图标。 将鼠标悬停在此图标上,打开门户自定义菜单。

    突出显示了由两支画笔构成的图标的屏幕截图。

  4. 从菜单中选择“样式”,打开样式自定义窗格。

    可以使用“样式”自定义的所有元素都显示在该页面上

  5. 在“更改变量值以自定义开发人员门户外观:”字段中输入“headings-color”。

    @headings-color 元素将显示在页面上。 此变量控制文本的颜色。

    自定义样式

  6. 单击 @headings-color 变量对应的字段。

    此时会打开颜色选取器下拉列表。

  7. 从颜色选取器下拉列表中选择一种新颜色。

    提示

    可实时预览所有更改。 自定义窗格顶部会显示进度指示器。 几秒钟后,标题文本的颜色将更改为刚刚选择的颜色。

  8. 选择自定义窗格菜单左下角的“发布”。

  9. 选择“发布自定义项”,以公开所做的更改。

查看更改

  1. 导航到开发人员门户。
  2. 可以看到所做的更改。

后续步骤

你还可能希望了解如何使用模板自定义 Azure API 管理开发人员门户