在coze官方推荐的Bot里面,经常会看到一些比较酷炫的结果。
比如像下面这个比较火的奥运手办的Bot。在对话输出里面既有图片,还有文字。并且可以做到排版
输出的结果也很满足商业化的标准。还有按钮可以点击。点击定制手办,就可以跳转到闲鱼上的店。直接利用Coze来引流了
要做到这样的效果,就得用到 卡片 这个功能。今天就来介绍怎么玩转卡片
01 创建卡片
在个人空间里面,可以找到卡片选项。
点击创建卡片进入新建界面
卡片的设置有模板,组件,结构三大
模板:就是定义卡片的基本结构。点击模板,在下面可以找到coze官方提供的很多现成模板
点击其中一个,在右边区域就会显示出来。
以这个模版为例,共有4个组件。
1 是title
2 是图片
3 是文本区域
4 按钮
点击每个组件,最右侧会出现针对这个组件的配置
如果你不想要coze的模板,可以点击组件。组件里面有布局和基础组件
选择好布局,可以把基础组件一个个的拖进去,然后自己行成一个模板
下面就是我单独创建的一个模板,一个title一个图片,图片选择 宽度铺满。一个自定义的模板就产生了
02 配置卡片
卡片的作用是和工作流进行联动。工作流的输出,不管是文字还是图片。最终都要生成在卡片上
所以就必须在卡片上做参数配置,便于后续和工作流,插件等进行联动
联动就需要用到变量。每个组件的内容部分,点击下图中的图标。可以看到新增变量。
给title组件 创建一个变量:title, 类型为string,默认值为0
在给图片插件 添加一个变量 photo。类型为string, 默认值为0
最后加一个定制化的按钮。点击后的动作选择打开URL。然后url 中输入想跳转的地址。这里我选择了京东的首页当做跳转地址
配置完成后,可以看到图片插件的资源 变成了变量:photo.
到此一个卡片就配置完了
03 绑定卡片
先来看工作流。这个工作流根据输入,调用图像流进行绘画。输出output和title。分别是图像和标题
在 工作流的按钮中选择绑定卡片数据
然后选择我的卡片。此时可以看到创建卡片的两个变量,title和photo
为卡片绑定数据源,title绑定自工作流输出的title,photo绑定自 工作流输出的output。
卡片和工作流的数据绑定就完成了。工作流中title的输出内容会显示在卡片的title组件上,工作流output输出的图像会显示在photo组件上
这样卡片和工作流的数据绑定就完成了。