高级模式

通过 Excel 批量填充图片、文本和组件,并使用 AutoFit、AutoGap 等自动化规则。

高级模式通过一份 Excel 批量填充图片、文本、组件和 Frame,并支持组合使用多种后缀规则。

ProdFill 高级模式界面
选择 Excel,并根据数据方向选择按行或按列填充。
ProdFill 高级模式字段前缀规则
Excel 表头使用前缀指定 Frame、图片、组件和重命名操作。

上传 Excel

Excel 字段名需要与 Figma 图层名对应。Figma 图层名只保留实际字段名称,不需要写 Pic、Com 等表头前缀。

FramePic 产品#Stack(-8)Pic 赠品#Scale(0.8)利益点#Hide(1)标签#Each#Hide(1)价格#Dot(32)产品名称Com 价格轴
XXXXXXXXXXXXXXX
XXX
XXXXXX长度=长, 颜色=红

下载动态排版 Excel 示例

按行或按列填充

  • 字段名位于第一行时选择“按行填充”,常用于批量制作主图。
  • 字段名位于第一列时选择“按列填充”,常用于批量制作详情页。

表头前缀

Frame:指定画框

存在 Frame 列时,每行数据会填入对应名称的画框;没有 Frame 列时,目标节点按视觉顺序处理。

XXX:文本填充

除系统保留的英文前缀外,其他字段均按文本图层名称匹配并写入。

Pic XXX:图片填充

表头以 Pic 开头表示图片字段,Figma 图层只需命名为 XXX。单元格内换行可向同一容器插入多张图片。

Com XXX:组件变体

表头以 Com 开头表示组件变体。ProdFill 会先切换到匹配变体,再填充图片与文本。

Name XXX:重命名节点

可重命名图片、矩形、文本、Frame 等任意支持的节点。

Position XXX:移动节点

单元格填写 120,36 或 120,36,按父级内部坐标设置目标节点的 x/y;空值不移动。

图片与可见性规则

#PasteFill:组件内图片粘贴填充

替换组件或实例内部的图片占位层,一个图层只替换一张图片。与 #Web 组合时可把网络图片写入目标位置。

#Hide(n):隐藏图层

字段没有数据时隐藏指定层级:#Hide(0) 当前层、#Hide(1) 父级、#Hide(2) 上两级。

#Scale(0.8):缩放倍数

数字表示缩放比例。图片、Group 和 Frame 可以缩放;组件实例需要通过母组件调整大小。

#AutoFit:自动贴边适配

保持素材比例,将产品自动铺满容器的宽或高。目标容器需要设置固定宽度或高度。

#Web:网络素材

使用网络图片数据。自动布局容器需要设置固定宽度和固定高度;支持阿里和京东图片地址。

自动布局规则

#Stack(-8):自动分组

同一产品 ID 数量大于 1 时创建 Horizontal Auto Layout,括号中的数字表示组内间距。

#AutoGap:动态排版

品牌版专享。根据商品数量自动计算间距:商品少时更疏,商品多时更紧。容器需要设置固定宽度。

#AutoGapGroup(XXX):多容器动态排版

与 #AutoGap 配合使用。参与共同排版的容器使用相同组名,并放在具有固定宽度的父容器中。

文本格式规则

#Each:多节点按行填充

当 Figma 中存在多个同名文本节点,且单元格包含多行数据时,按节点顺序逐行写入。

#Dot(32):小数部分字号

整数段保持原字号,整数后面的所有字符统一缩小为括号内指定字号。

#Comma(32):千位逗号字号

将数字千位分隔符的字号设置为括号内的值。

规则可以组合

例如 Pic 主图#PasteFill#Web。请保持前缀与规则拼写不变,并在正式批量执行前用一行数据验证结果。