### [瓜奇主题文字格子广告插件8码库原创](https://guaqi.com/topic/77942)

**Published:** 2026-09-22T01:49:59

**Author:** 星动优创

**Excerpt:** 这个插件解决什么问题中小站长想赚广告位这份钱，通常卡在三件事上：没有现成的广告位管理系统；卖格子全靠人工对接—…

## **这个插件解决什么问题**

中小站长想赚广告位这份钱，通常卡在三件事上：没有现成的广告位管理系统；卖格子全靠人工对接——来人问、聊价格、发收款码、手动挂链接；广告到期没人记得下架，旧的占着位置、新的进不来。格子广告本来就是碎片生意，用人工方式做，一天卖三格就要耗掉半天。

「广告文字墙」要解决的就是这件事：把格子广告的售卖、收款、上架、到期回收整条链路自动化。站长只需要在后台配一次规格和价格，剩下的交给访客自助走完。

## **插件概览**

-   **插件名称**：广告文字墙
    
-   **插件标识**：`guaqi/ad-text-wall`
    
-   **当前版本**：v1.0.3
    
-   **运行环境**：瓜奇（GuaQi）框架运行时插件
    
-   **适用前端**：Nuxt SSR 站点，客户端与服务端同构渲染
    
-   **上线状态**：已在 8号码库（8maoku.com）首页启用运行
    

## **核心功能**

### **一面墙 18 个格子，行列都能配**

默认 6 列 3 行，合计 18 个可售格子。列数与行数都写在后台配置里，想做成 8 格的小墙或者 24 格的大墙，改配置即可，不用动代码。

### **六色轮换，空格子也不难看**

格子底色按蓝、橙、青、紫、粉、绿六色循环铺开。一个广告都没卖出去的时候，整面墙看上去依然是一块排布整齐的色块区，而不是一片「待填充」的荒芜感。对首屏观感来说，这一点比想象中重要。

### **访客自助下单，全程无人值守**

点空格子 → 填广告文字和跳转链接 → 选租期看实时报价 → 确认并付款 → 扫码支付。整条链路访客自己走完，站长不用回消息、不用发收款码。游客身份也能直接下单支付（后台可关），不需要先注册登录。

### **预约锁位，不会两个人买到同一格**

访客点开空格子会生成一次预约，预约有效期 20 分钟；下单后若未完成支付，格子锁定 3 小时，超时自动释放回可租状态。避免「你还在填单，格子被别人买走了」这种最伤体验的情况。

### **到期自动回收，格子不永久占坑**

广告租期结束后，格子状态会在渲染前自动归一为「可购买」，重新进入可租池。不需要站长手动下架，也不会因为历史记录还留在库里，就让一个格子永远挂着旧广告占位置。

## **访客租一个格子，共五步**

-   **点格子**：点击任意一个可购买的格子，弹出下单窗。
    
-   **填内容**：填写要展示的广告文字与跳转链接。
    
-   **选租期**：选择租几个月，系统按单价实时算出总价。
    
-   **确认并付款**：核对文字、链接与金额，提交订单。
    
-   **扫码支付**：走瓜奇框架自带支付链路，弹出支付二维码；支付完成后格子即时上架展示。
    

## **格子的四种状态**

-   **可购买**：空格子，任何人都能点开下单。
    
-   **已预约**：有人正在填单或等待付款，暂时锁定，其他人点开能看到提示。
    
-   **已上架**：付款完成，展示广告文字，可点击跳转。
    
-   **已过期**：租期结束，自动降级回「可购买」。
    

## **后台配置**

网格规格、单价、租期、是否允许游客付款，都放在表单定义的 `config.ad_text_wall` 里，改配置就能调整售卖策略：

```json
"ad_text_wall": {
  "wall_layout": "text_wall_6",       // 网格布局，6 列
  "wall_rows": "3",                   // 行数，3 行（共 18 格）
  "text_align": "center",             // 格子内文字对齐方式
  "slot_monthly_price": {             // 每格每月单价，支持多币种
    "CNY": "5",
    "USD": "0.70",
    "EUR": "0.64"
  },
  "minimum_months": "1",              // 最短租期，单位：月
  "allow_guest_pay": "1",             // 是否允许游客直接下单付款
  "purchase_description": {           // 下单窗中的购买说明
    "zh-hans": "",
    "en": "",
    "es": ""
  }
}
```

复制

其中 `wall_layout` 与 `wall_rows` 决定卖多少个格子，`slot_monthly_price` 决定卖多少钱，`minimum_months` 决定起租门槛。三个参数组合起来，就是一个完整的价格策略，不需要改任何代码。

## **技术规格**

-   **多语言**：简体中文 / English / Español 三语，配置与前台文案按语言分开存放，切换语言不会出现空白项。
    
-   **移动端适配**：输入框字号不低于 16px，避免 iOS 自动放大页面；按钮点击区域不小于 44px；窄屏下网格转为横向滚动。
    
-   **输出安全**：访客提交的广告文字一律按文本节点渲染，不使用 v-html。即使有人在文字里塞进标签，也不会被当作 HTML 执行。
    
-   **同构渲染**：客户端与服务端共用同一份组件源码，避免服务端渲染与水合结果不一致。
    

## **安装与上线提醒**

下面三条都是实际部署时踩过的坑，提前知道能省不少时间：

### **1\. 支付表单的标题不能留空**

瓜奇会把支付表单的标题当作支付网关的「商品名」提交。标题为空时，支付宝会直接拒单，返回 `ACQ.INVALID_PARAMETER：商品订单的商品标题不能为空`。而这条错误在前端会被统一收敛成一句「操作失败，请稍后重试」，很容易被误判成插件故障、白白排查半天插件代码。给表单帖补一个标题（例如「广告位招租」）即可恢复。

### **2\. 升级同一插件，走「更新安装包」而不是「安装插件」**

同一个插件 id 上传新版本时，「安装插件」会新增一条独立的包记录，导致同插件多版本并存；若旧版本还挂在某个前端上处于启用状态，就会触发「A runtime plugin must use one revision across all frontends」，启用过程卡在半路。正确做法是走插件卡片菜单里的「更新安装包」，它会把原本启用该插件的站点一起带进更新流程。

### **3\. 安装、启用、删除都在后台完成**

运行时插件的安装与启用走的是会话级校验，应用密码接口只能读取插件目录、写不了。所以这一步没法用脚本批量处理，在后台的运行时插件页操作即可。

## **常见问题**

-   **格子不够卖怎么办？**把 `wall_rows` 调大即可扩容；也可以提高 `slot_monthly_price` 控量。
    
-   **只想让登录用户购买？**把 `allow_guest_pay` 关掉，就只有登录用户能下单。
    
-   **广告到期需要手动下架吗？**不需要，过期状态会在渲染前自动降级为可购买。
    
-   **能改格子配色吗？**可以，格子配色由插件运行时样式控制，在站点全局自定义 CSS 中覆盖对应的颜色变量即可生效，不需要改插件包。
    

## **小结**

「广告文字墙」把一件原本很零碎的生意做成了自助流程：配一次价格，之后每卖出一格就是净收入，售出、收款、上架、到期回收都不需要人工介入。对流量不大但稳定的中小站点来说，这是把首页某块位置变成现金流的最省事的方式。

本文介绍的插件为 8号码库原创，目前已在 8maoku.com 首页实际运行，可按自身站点情况调整网格与定价后再投入使用。



**Comments:** 

**春哥:** 感谢老哥写的插件，我还没来得及上官网，我这弄好后上官网给大家用



---