淘宝联盟支付宝小程序营销套件媒体对接流程

第一歩：拥有支付宝小程序

要在您的小程序内接入淘宝联盟营销套件功能前，您需要首先完成 开发者入驻 并 创建小程序。

如果已经拥有支付宝小程序，请获取小程序appid并记录好，获取appid链接：https://developers.alipay.com/platform/developerindex.htm

第二歩：支付宝能力中心订购插件

插件订购地址

必订购插件「百川投放能力插件插件」并绑定你的支付宝小程序应用，https://nengli.alipay.com/abilityprod/detail?abilitycode=pl002020051700010297

? banner插件：https://app.alipay.com/abilityprod/detail?abilitycode=pl002020051700010296

? 标签导航插件 https://app.alipay.com/abilityprod/detail?abilitycode=pl002020051500010265

? 浮标插件：https://app.alipay.com/abilityprod/detail?abilitycode=pl002020051700010283

? 弹窗插件：https://app.alipay.com/abilityprod/detail?abilitycode=pl002020051700010313

? 搜索插件：https://nengli.alipay.com/abilityprod/detail?abilitycode=pl002020071500012669

? 搜索返利插件：https://app.alipay.com/abilityprod/detail?abilitycode=pl002020081800013897

? 行业锁佣插件-每日精选：https://nengli.alipay.com/abilityprod/detail?abilitycode=pl002020092700015277【此插件定向邀约，联盟账户日均引流uv>;5w，可以联系运营申请】

以 “授*”插件为例：

1、订购插件

2、绑定应用

第三歩：激活插件并入驻淘宝联盟备案

1、激活淘宝联盟插件

2、绑定淘宝开发者主账户（淘宝开发者账户同淘宝联盟账户，入驻门槛详见：淘宝客入驻条件）

3、入驻淘宝开发者，如果淘宝开发者主账户还不是淘宝开发者需要入驻（已经是淘宝开发者账户忽略此步骤）。

4、入驻成功后返回上一步重新激活淘宝联盟插件。账户绑定，注意：淘宝开发者主账户和支付宝小程序开发者主账户绑定，不要搞错。没有解绑流程！不要搞错。没有解绑流程！不要搞错。没有解绑流程！

5、绑定成功，进入备案

授*绑定成功后，【前往备案】进入淘宝联盟备案页面，支付宝小程序名称、appid、简介自动填充，无需重复填写：按备案信息提示认真填写信息。

填写完成后进入淘宝联盟风控自动审核，审核成功后【继续订购】进入下一步：

第四歩：百川套件申请&配置&发布

1、【申请】按钮进行百川套件申请：

填写申请理由：格式

支付宝小程序应用全称，dau，联盟pubid（账号id，），媒体名称，联系人，电话，申请原因。

案例：播客，1w，123456，淘宝联盟，张三，12345678901，申请淘宝联盟支付宝营销套件用于小程序电商购物变现。

【注意】页面类型，必须勾选默认，2、权限申请成功后，套件页面上的【我的套件】，进行套件配置，新增版本或修改现有配置

进入套件-插件配置页。【默认】，进入插件插件配置页，以（联盟icon导航插件）配置为例：

1、本插件推广位：需要为插件在联盟后台创建一个插件新的pid，注意不要用错！

2、第二至第五的素材信息需要媒体自行配置，如果给了默认配置，媒体可自行替换，如果没给默认配置，媒体需要自行转推广链接（媒体配置链接前一定做下单测试追踪）

3、配置完成后，提交发布。

审核状态查看

通过后，发布状态为【已发布】插件配置才正式生效

第五歩：开始开发，嵌入插件代码

请务必升级小程序开发者工具到v1.12 beta 以上！（去升级）

按照以下文档，在小程序代码中添加插件的配置参数，详情请参考插件使用。

使用

npm install miniapp-bc-user -s

方法

方法

说明

loadbc

加载百川插件

loadbc: promise<{success:boolean}>;

异步方法，加载成功返回{ success:true }

组件

;

属性

属性

说明

code

模块code

具体值参见下表

name

区块名

具体值参见下表

onerror

错误事件，当组件发生错误时触发

code 列表

插件名称

code(模块 code)

name(区块名称)

参数

banner插件

suite://bc.suite.union618/bc.template.banner

block-banner

标签导航插件

suite://bc.suite.union618/bc.template.nav

block-nav

弹窗插件

suite://bc.suite.union618/bc.template.dialog

block-dialog

type: 'static' // 固定模式，默认为空即弹窗模式

浮标插件

suite://bc.suite.union618/bc.template.icon

block-icon

搜索插件

suite://bc.suite.union_search/bc.template.searchbox

block-searchbox

搜索返利插件

suite://bc.suite.etaomarketing/bc.template.rebate.search

block-etao-searchbox

行业锁佣插件-每日精选

suite://bc.suite.choiceness/bc.template.choiceness

block-choiceness

pluginoptions: {

pagesize: 10, // 每页个数，可选，默认 10

maxpagenum: 5, // 比较大页数，可选，默认加载所有数据

relationid: '', // 配置 relationid

},

demo

// page.jsimport { loadbc } from 'miniapp-bc-user'page({ data:{ showcomponent:false }, async onready{ try { await loadbc; this.setdata({ showcomponent: true }) } catch(e) {} }, bcerror(err){ console.log('err:',err) }, /*----以下是行业锁佣插件-每日精选专用代码--其他对接请忽略--*/ // 每日精选插件 // 监听页面滚动到底部，加载更多 onreachbottom { this.setdata({ loadmoretime: (this.data.loadmoretime || 0) + 1 }) }, /*----以上是行业锁佣插件-每日精选专用代码--其他对接请忽略--*/})

// page.axml;;;

// page.json，引入 bc-module 加载插件{ "usingcomponents": { "bc-module": "miniapp-bc-user/es/bc-module/bc-module" }}

// app.json 声明使用插件动态加载方式{ "usedynamicplugins": true}

开发者工具控制台会打印出相关信息，可以检查一下和百川后台配置的 pid 是否一致。

恭喜