8.2. 自定义 Developer Hub 实例的品牌徽标

您可以通过在 app-config.yaml 文件中配置 branding 部分来自定义 Developer Hub 实例 的品牌 徽标，如下例所示：

app:
  branding:
    fullLogo: ${BASE64_EMBEDDED_FULL_LOGO} 
    iconLogo: ${BASE64_EMBEDDED_ICON_LOGO}

app:
  branding:
    fullLogo: ${BASE64_EMBEDDED_FULL_LOGO}


    iconLogo: ${BASE64_EMBEDDED_ICON_LOGO}

Copy to Clipboard

Toggle word wrap

其中：

fullLogo 是展开的（固定）侧栏上的徽标，需要采用 base64 编码的图像。

iconLogo 是折叠（未固定）边栏上的徽标，需要一个 base64 编码的图像。

您可以格式化 BASE64_EMBEDDED_FULL_LOGO 环境变量，如下所示：

BASE64_EMBEDDED_FULL_LOGO: "data:_<media_type>_;base64,<base64_data>"

BASE64_EMBEDDED_FULL_LOGO: "data:_<media_type>_;base64,<base64_data>"

Copy to Clipboard

Toggle word wrap

以下示例演示了如何使用 data :_<media_type>_;base64, <base64_data> 格式自定义 BASE64_EMBEDDED_ FULL_LOGO ：

SVGLOGOBASE64=$(base64 -i logo.svg)
BASE64_EMBEDDED_FULL_LOGO="data:image/svg+xml;base64,$SVGLOGOBASE64"

SVGLOGOBASE64=$(base64 -i logo.svg)
BASE64_EMBEDDED_FULL_LOGO="data:image/svg+xml;base64,$SVGLOGOBASE64"

Copy to Clipboard

Toggle word wrap

将 image/svg+xml 替换为您的镜像的正确介质类型（如 image/png 和 image/jpeg），并相应地调整文件扩展名。因此，您可以在不引用外部文件的情况下直接嵌入徽标。

您还可以通过为品牌部分中的 fullLogoWidth 字段设置值来自定义 品牌 徽标的宽度，如下例所示：

app:
  branding:
    fullLogoWidth: 110px 
# ...

app:
  branding:
    fullLogoWidth: 110px


# ...

Copy to Clipboard

Toggle word wrap

返回顶部