自定义页面结构
收藏
我的收藏

页面顶部标准化导航栏将不显示,可以自定义页面结构。​

能力介绍

    为保障小程序的良好体验,在原本的标准化导航栏之外提供「自定义页面结构能力」供开发者使用。申请能力通过后,顶部导航栏将不再展示,小程序可以以沉浸式样式展示。​
    自定义导航栏能力设计初衷是为了提升小程序的用户体验,申请能力的开发者需详细阅读设计指南,按照指南要求完成页面布局配置,保证用户体验。​
页面高度
    标准化导航栏下,页面的可绘制高度为导航栏以下区域。​
    自定义导航栏下,页面的可绘制高度为页面全局。​
注意
设计内容需避开logo/返回、胶囊(反馈、更多、关闭)几个元素。
交互说明
    小程序首页左上角展示品牌 logo,非首页会展示返回按钮。​
    若用户进入的首个页面为非首页,则左上角展示品牌 logo,点击后可快速回到首页。​
相关API
通过以上 API,可获取自定义导航栏平台下发的元素(如logo/返回、胶囊「反馈、更多、关闭」)的位置信息​

使用场景

对于页面内容展示具有强氛围感、沉浸感诉求时,可申请使用自定义导航栏:​

接入规范须知

自定义导航栏能力设计初衷是为了提升小程序的用户体验,开发者获得能力后需谨慎使用,详细阅读设计指南,按照指南要求完成页面布局配置,保证用户体验。​
    开发者可依据自身需求在导航栏区增加标题、搜索、Tab、定位等内容​
    元素与平台胶囊需居中对齐,不重叠、不错位、元素间保持一定的安全距离
    导航栏背景可采用纯色、渐变色或氛围图进行氛围感营造​
    需保证背景图信息清爽,避免背景内容对导航栏框架形成信息遮挡,影响用户提取信息​

准入条件

    1.信用分达到 90 分,详情查看信用分介绍; ​
    2.明确告知能力预期的使用场景,且使用场景符合平台要求。​
    3.小程序需要保证优质的用户体验,遵循设计规范。申请时需附上详细抖音小程序的设计稿或真实线上截图。​

接入流程​

第一步:选择申请方式

    1.登录开发者平台控制台。​
    2.在「我的应用」页面中点击「小程序」,然后在「小程序」页签中点击已创建的应用。​
    3.在应用详情页面左侧导航栏选择「能力」>「互动能力」。在「互动能力」页面点击「容器界面」,在「容器界面」页签的「自定义导航栏」区域点击「申请开通」。​

第二步:填写信息提交申请

申请该能力时需要填写「申请原因」、「使用场景」及「场景示例图」。​
平台根据填写的信息及小程序的内容进行审核。​
若开通后,发现开发者在使用过程中滥用此能力,对用户或平台造成负面影响,平台将有权利随时对该功能进行收回,并视情况对违规的小程序进行处罚。​

第三步:平台审核

平台根据填写的应用场景及小程序内容进行审核,审核时间为 5 个工作日。​

第四步:使用能力

审核通过后即可使用该能力。​

接口列表​

API 名称
API 类型
API 描述
OpenAPI​
通过该接口申请页面结构自定义能力​
OpenAPI​
查询页面结构自定义能力申请状态​
OpenAPI​
服务商可通过该系列接口申请能力并查询能力申请状态​