通过 Azure API 管理,用户能够使用一组用于配置内容的模板自定义开发人员门户页面的内容。 使用 DotLiquid 语法和所选编辑器(例如 DotLiquid for Designers),以及提供的一组本地化字符串资源、字形资源和页面控件,即可根据这些模板的使用需要非常灵活地配置页面内容。
本部分中的模板可用于自定义开发人员门户中的应用程序页面的内容。
备注
示例默认模板包含在后续文档中,但是会因持续改进而有所更改。 通过导航到所需单个模板,可在开发人员门户中查看实时的默认模板。 如需详细了解如何使用模板,请参阅如何使用模板自定义 API 管理开发人员门户。
备注
以下文档内容与已弃用的开发人员门户有关。 你可以像往常一样继续使用它,直到它在 2023 年 10 月停用,届时将从所有 API 管理服务中将其删除。 弃用的门户只会接收关键安全更新。 有关更多详细信息,请参阅以下文章:
重要
此功能在 API 管理的“高级”、“标准”、“基本”和“开发人员”层中可用 。
应用程序列表模板可用于自定义开发人员门户中应用程序列表页的正文。
<div class="row">
<div class="col-md-9">
<h2>{% localized "AppStrings|WebApplicationsHeader" %}</h2>
</div>
</div>
<div class="row">
<div class="col-md-12">
{% if applications.size > 0 %}
<ul class="list-unstyled">
{% for app in applications %}
<li>
{% if app.application.icon.url != "" %}
<aside>
<a href="/applications/details/{{app.application.id}}"><img src="{{app.application.icon.url}}" alt="App Icon"></a>
</aside>
{% endif %}
<h3><a href="/applications/details/{{app.application.id}}">{{app.application.title}}</a></h3>
{{app.application.description}}
</li>
{% endfor %}
</ul>
<paging-control></paging-control>
{% else %}
{% localized "CommonResources|NoItemsToDisplay" %}
{% endif %}
</div>
</div>
Product list
模板可使用以下页面控件。
{
"Paging": {
"Page": 1,
"PageSize": 10,
"TotalItemCount": 1,
"ShowAll": false,
"PageCount": 1
},
"Applications": [
{
"Application": {
"Id": "5702b96fb16653124c8f9ba8",
"Title": "Contoso Calculator",
"Description": "A simple online calculator.",
"Url": null,
"Version": null,
"Requirements": "Free application with no requirements.",
"State": 2,
"RegistrationDate": "2016-04-04T18:59:00",
"CategoryId": 5,
"DeveloperId": "5702b5b0b16653124c8f9ba4",
"Attachments": [
{
"UniqueId": "a58af001-e6c3-45fd-8bc9-c60a1875c3f6",
"Url": "https://apimgmtst65gdjvjrgdbfhr4.blob.core.chinacloudapi.cn/content/applications/a58af001-e6c3-45fd-8bc9-c60a1875c3f6.png",
"Type": "Icon",
"ContentType": "image/png"
},
{
"UniqueId": "2b4fa5dd-00ff-4a8f-b1b7-51e715849ede",
"Url": "https://apimgmtst65gdjvjrgdbfhr4.blob.core.chinacloudapi.cn/content/applications/2b4fa5dd-00ff-4a8f-b1b7-51e715849ede.png",
"Type": "Screenshot",
"ContentType": "image/png"
}
],
"Icon": {
"UniqueId": "a58af001-e6c3-45fd-8bc9-c60a1875c3f6",
"Url": "https://apimgmtst65gdjvjrgdbfhr4.blob.core.chinacloudapi.cn/content/applications/a58af001-e6c3-45fd-8bc9-c60a1875c3f6.png",
"Type": "Icon",
"ContentType": "image/png"
}
},
"CategoryName": "Finance"
}
]
}
应用程序模板可用于自定义开发人员门户中应用程序页的正文。
<h2>{{title}}</h2>
{% if icon.url != "" %}
<aside class="applications_aside">
<div class="image-placeholder">
<img src="{{icon.url}}" alt="Application Icon" />
</div>
</aside>
{% endif %}
<article>
{% if url != "" %}
<a target="_blank" href="{{url}}">{{url}}</a>
{% endif %}
<p>{{description}}</p>
{% if requirements != null %}
<h3>{% localized "AppDetailsStrings|WebApplicationsRequirementsHeader" %}</h3>
<p>{{requirements}}</p>
{% endif %}
{% if attachments.size > 0 %}
<h3>{% localized "AppDetailsStrings|WebApplicationsScreenshotsHeader" %}</h3>
{% for screenshot in attachments %}
{% if screenshot.type != "Icon" %}
<a href="{{screenshot.url}}" data-lightbox="example-set">
<img src="/Developer/Applications/Thumbnail?url={{screenshot.url}}" alt='{% localized "AppDetailsStrings|WebApplicationsScreenshotAlt" %}' />
</a>
{% endif %}
{% endfor %}
{% endif %}
</article>
Application
模板不允许使用任何页面控件。
应用程序实体。
{
"Id": "5702b96fb16653124c8f9ba8",
"Title": "Contoso Calculator",
"Description": "A simple online calculator.",
"Url": null,
"Version": null,
"Requirements": "Free application with no requirements.",
"State": 2,
"RegistrationDate": "2016-04-04T18:59:00",
"CategoryId": 5,
"DeveloperId": "5702b5b0b16653124c8f9ba4",
"Attachments": [
{
"UniqueId": "a58af001-e6c3-45fd-8bc9-c60a1875c3f6",
"Url": "https://apimgmtst3aybshdqqcqrle4.blob.core.chinacloudapi.cn/content/applications/a58af001-e6c3-45fd-8bc9-c60a1875c3f6.png",
"Type": "Icon",
"ContentType": "image/png"
},
{
"UniqueId": "2b4fa5dd-00ff-4a8f-b1b7-51e715849ede",
"Url": "https://apimgmtst3aybshdqqcqrle4.blob.core.chinacloudapi.cn/content/applications/2b4fa5dd-00ff-4a8f-b1b7-51e715849ede.png",
"Type": "Screenshot",
"ContentType": "image/png"
}
],
"Icon": {
"UniqueId": "a58af001-e6c3-45fd-8bc9-c60a1875c3f6",
"Url": "https://apimgmtst3aybshdqqcqrle4.blob.core.chinacloudapi.cn/content/applications/a58af001-e6c3-45fd-8bc9-c60a1875c3f6.png",
"Type": "Icon",
"ContentType": "image/png"
}
}
如需详细了解如何使用模板,请参阅如何使用模板自定义 API 管理开发人员门户。