<ph type="x-smartling-placeholder"></ph>
您正在查看 Apigee Edge 文档。
转到
Apigee X 文档。 信息
主题背景是定义网站外观和风格的文件集合。通过 Developer Services 门户最初使用默认主题进行定义,您可以自定义该主题。 这样,您就可以根据需要选择门户外观和风格。更多 具体来说,您可以更改链接、背景、文字和其他主题元素的颜色。您 也可以更改开发者门户首页显示的欢迎辞。
您可以通过开发者门户界面自定义主题,也可以在自定义的 主题文件以替换默认主题文件。
<ph type="x-smartling-placeholder">根据您的开发者门户版本,您将有多个主题可供选择 发件人:
主题 | 说明 |
---|---|
Apigee 自适应主题 |
基于 Bootstrap 3, 新版本的门户此主题支持宽度从 768 像素到 1400 像素。此主题提供所有 Bootstrap 3 功能。 注意:要使用 Apigee 自适应主题背景,请确保引导加载程序 7.x-3.0 主题背景已启用。 |
Apigee DevConnect 主题 |
Apigee 自适应主题之前的默认门户主题。 现有门户可以升级到新的 Apigee 自适应主题,但必须先升级 确保所有块、模板和其他内容都与 Bootstrap 3 和 Bootstrap 7.x-3.0 主题已启用。 |
Apigee 基本主题 |
Apigee DevConnect 主题的父主题,不应用于其 。 |
设置默认主题
如果您的门户仍在使用旧版 Apigee DevConnect 主题,您可能会看到警告 形式为:
"Apigee DevConnect theme" is out of date
您可以使用以下步骤为该门户设置默认主题。您应该 务必先在非生产系统上测试新主题,然后再将主题部署到 生产环境。
<ph type="x-smartling-placeholder">如需设置默认主题,请执行以下操作:
- 以拥有管理员或内容创建权限的用户身份登录门户。
- 在 Drupal 管理菜单中选择 Appearance。已启用的 主题。
- 对于您想用作默认主题背景,选择设为默认。
要使用 Apigee 自适应主题背景,请确保 Bootstrap 7.x-3.0 主题背景 该页面上也启用了这项功能 - 保存配置。
自定义 Apigee 自适应主题
本部分介绍如何配置 Apigee 自适应主题,包括:
- 自定义模态表单
- 自定义常规设置
如需自定义模态表单支持,请执行以下操作:
该门户使用 Drupal 引导加载程序 模态表单沙盒模块,用于将 Drupal 表单显示为模态。登录和注册表单的 默认函数作为模态。您可以停用此功能,让这些表单显示为 各个页面
- 以拥有管理员权限的用户身份登录开发者门户。
- 选择配置 >界面 >引导加载程序模态表单, Drupal 管理菜单。
- 启用或停用表单的模态支持。
- 选择保存配置。
要自定义 Apigee 自适应主题的常规设置,请执行以下操作:
- 以拥有管理员或内容创建权限的用户身份登录门户。
- 在 Drupal 管理菜单中选择“Appearance”。已启用的主题背景列表 。
- 在页面的 Apigee 自适应(默认主题)区域中,选择 设置(请勿选择页面顶部的“设置”按钮)。
- 系统随即会显示 Apigee 自适应主题的设置页面。
- 下表介绍了该页面上可用于配置
主题。如果您更改了以上任何设置,请选择“保存配置”。
领域 部分 说明 引导设置
组件
控制面包屑导航的显示、主菜单的位置(称为 设置中的 Navbar),以及区域井的显示:
- 面包屑导航:隐藏/显示面包屑导航,启用/停用首页链接 路径内。
- Navbar:将导航栏(主菜单)的位置更改为 固定/静态/正常位置,使布局更具动态性。
- 区域井:向网站上的任何区域添加井类, 为该区域添加颜色更深的背景。
JavaScript
控制锚点、弹出式窗口和提示的显示:
- 锚点:修复锚点位置并实现流畅播放 滚动。
- 弹出式窗口:弹出式窗口可在任意内容上添加 元素。启用/停用弹出式窗口,并配置弹出式窗口的使用方式。
- 工具提示:配置提示的使用方式。您可以强制每个 显示在每个表单元素的右侧、左侧、顶部或底部的提示,并设置 其他显示选项。
高级
控制门户如何使用 BootstrapCDN 更新引导主题文件您可以停用对门户的依赖, BootstrapCDN,但之后必须提供自己的 Bootstrap 实现 框架。
DevConnect 设置
设置欢迎辞、默认颜色和显示的徽标大小 。
覆盖全局设置
切换显示模式
允许和禁止显示入口的不同区域。
徽标图片设置
指定在主菜单中显示的图片。
快捷方式图标设置
指定浏览器地址栏中显示的图片或 打开该门户
自定义 Apigee DevConnect 主题
Apigee DevConnect 主题是旧版本门户的默认门户主题,并且 可以升级到新的 Apigee 自适应主题。不过,您必须先确保 在执行 升级。
自定义 Apigee DevConnect 的常规设置 主题:
- 以拥有管理员或内容创建权限的用户身份登录门户。
- 选择外观 >Apigee DevConnect 主题 >设置 管理菜单。这会显示主题的初始设置。颜色设置 指定为十六进制值。
- 根据您的偏好更改设置。
例如,添加或更改欢迎信息,或更改标头背景颜色。通过 标头背景颜色最初设置为接近橙色 (#FF4300)。您可以更改 更改为其他颜色,例如蓝色 (#0000FF)。 - 更改完设置后,点击保存。
通过创建子主题来自定义主题
定义门户随附的默认主题的所有文件和资源都位于 profiles/apigee/themes 目录 安装在门户安装目录下。此目录位于 /var/www/html/profiles/apigee/themes 已将门户安装到默认位置。
要编辑主题以修改网站的外观和风格,请不要修改位于 profiles/apigee/themes。 否则,您下次升级门户时将覆盖您所做的更改。
您可以复制默认主题,为要修改的主题创建子主题 将文件复制到 /sites/all/themes 目录。有关子主题的说明,请参阅 Drupal 文档,请访问 https://www.drupal.org/node/225125。
- 复制 profiles/apigee/themes/apigee_responsive/apigee_responsive_starterkit 文件夹 添加到 /sites/all/themes 文件夹中。
- 重命名 apigee_responsive_starterkit 文件夹 至 YOUR_THEME_NAME。
- 将 apigee_responsive_starterkit.info 文件重命名为 YOUR_THEME_NAME.info。
- 将 css/apigee_responsive_starterkit.css 重命名为 css/YOUR_THEME_NAME.css。
- 将 js/apigee_responsive_starterkit.js 重命名为 YOUR_THEME_NAME.js。
- 编辑 YOUR_THEME_NAME.info 文件并替换以下行:
stylesheets[all][] = css/apigee_responsive_starterkit.css
脚本 [] = js/apigee_response_starterkit.js
替换为:
stylesheets[all][] = css/YOUR_THEME_NAME.css
脚本 [] = js/YOUR_THEME_NAME.js - 将 YOUR_THEME_NAME.info 文件中的主题名称从 Apigee 自适应入门套件更改为“您的主题” NAME。
- 如果您要为主题添加新的屏幕截图,请替换现有 screenshot.png 文件。
- 如果您想为主题添加新徽标,请替换现有 logo.png 文件。
- 如果您要为主题添加新的网站图标,请替换现有的 favicon.ico 文件。