Hero CTA 总览

预览 FlatPaper 首页 home_hero 底部贴纸按钮的预设、配色与贴纸组合,可直接 hover / Tab 查看交互。

配置说明

  • 在 _config.flatpaper.yml 的 home_hero: 下配置底部引导按钮,通过 cta_text 与 cta_link 修改文字与跳转锚点。
  • cta_background 选择内置预设 01–09(颜色 + 贴纸组合,默认 01)、random(每次载入随机),或自定义按钮背景图路径。
  • cta_color 与 cta_sticker 可单独覆盖预设的颜色或左侧贴纸;配合 random 时,已配置的一项保持固定,只随机另一半。
# home_hero:  cta_text: 开始阅读  cta_link: "#flatpaper-home-content"  cta_background: 01      # 01–09 内置纸片预设、random,或按钮背景图路径  cta_color: accent       # 可选覆盖颜色:brown/pink/orange/green/yellow/blue/violet/accent 或 #hex  cta_sticker: heart      # 可选覆盖贴纸:none/flower/bear/tulip/sprout/star/sparkle/heart/tape 或图片路径
模式
强调色

cta_background 预设 01–09

random 每次载入从这 9 个中随机。

01 · none
开始阅读
02 · flower
开始阅读
03 · bear
开始阅读
04 · tulip
开始阅读
05 · sprout
开始阅读
06 · star
开始阅读
07 · sparkle
开始阅读
08 · heart
开始阅读
09 · tape
开始阅读

cta_color 覆盖

搭配 cta_sticker: none,只看颜色;accent 跟随上方强调色。

cta_sticker 覆盖

保持默认颜色(preset 01),只换贴纸;最后一个是图片路径。

文案长度

开始阅读
开始阅读
Start reading
Start reading
翻开今天的手账吧
翻开今天的手账吧
超长(截断)
Start reading the journal from the very beginning