---
title: "Ladybird 插件 | 星源 Web Studio"
description: "已上架 Chrome Web Store 的免代码扩展，支持网页按钮、可视化自动化流程、本地加密凭据和中英日三语界面。"
url: "https://studio.i17i.com/zh/work/ladybird-extension"
---

浏览器扩展 / 自研效率产品

# Ladybird 免代码网页自动化Chrome扩展

自研并公开上架 Chrome Web Store 的浏览器扩展：免代码给任意网页添加按钮、链接与提示，可视化流程编辑器编排自动化操作，凭据存于本地加密保管库，中/英/日三语界面，持续版本迭代中。

[访问网站](https://chromewebstore.google.com/detail/ladybird-no-code-buttons/nefpepdpcjejamkgpndlfehkffkfgbpe)

- Chrome Extension

- Manifest V3

- WXT

- React

- TypeScript

- Tailwind CSS

## 网站截图

chromewebstore.google.com

chromewebstore.google.com

## 项目背景与挑战

重复的网页操作（逐条填表、批量点击）对非工程师是日常负担：写脚本门槛高，云端自动化SaaS又要求把业务数据交给第三方。需要一个免代码、数据完全留在浏览器本地的自动化方案，并通过 Chrome Web Store 的 Manifest V3 审核公开发布。

## 解决方案

基于 Manifest V3 + WXT + React + TypeScript 开发：侧边栏统一管理页面元素与自动化流程；可视化 Flow 编辑器把输入、点击、等待、数据源映射等步骤编排成可复用流程，支持数据逐行填表自动提交；隐藏规则一键屏蔽页面干扰元素；凭据保存在本地加密保管库。完成商店上架素材与审核流程，公开发布并持续迭代。

## 交付成果

- 通过审核公开上架 Chrome Web Store，版本迭代至 v2.x

- 免代码：网页按钮/链接/提示 + 可视化自动化流程编辑器

- 数据源流程：一行数据映射一次表单填写，批量任务自动化

- 凭据本地加密存储，业务数据不出浏览器

## 核心功能

- 免代码给任意网页添加按钮、链接、提示

- 可视化 Flow 编辑器：输入/点击/等待等步骤编排

- 数据源流程：数据行→表单字段映射→自动提交

- 隐藏规则：一键隐藏页面干扰元素

- 本地加密凭据保管库

- 中/英/日三语界面

## 技术栈

- Chrome Extension

- Manifest V3

- WXT

- React

- TypeScript

- Tailwind CSS

[获取报价](https://studio.i17i.com/zh/contact)

## 相关服务

[Chrome浏览器插件开发 Manifest V3插件定制开发，从需求到Chrome Web Store上架 2500美元起，按功能范围报价 了解详情](https://studio.i17i.com/zh/services/chrome-extension)

## 相关案例

[yaofengxny.com 机制炭制造 / 新能源燃料 Yaofeng New Energy 机制炭制造商外贸站 为机制成型炭制造商开发的海外官网+产品目录站，支持英语、中文、阿拉伯语（RTL）、俄语4种语言，覆盖中东与俄语区目标市场，包含产品目录、OEM定制页与完整询盘导线。 - Next.js - TypeScript - Prisma - PostgreSQL 了解详情](https://studio.i17i.com/zh/work/yaofeng-new-energy)
[juns.i17i.com 家具·建筑五金制造 Junsheng Hardware 家具五金B2B目录站 为家具与建筑五金制造商开发的B2B产品目录站：产品目录、分类页、产品详情、目录请求表单与询盘表单，标注MOQ（最小起订量）等B2B要素，支持多语言切换。 - Next.js - TypeScript - Prisma - PostgreSQL 了解详情](https://studio.i17i.com/zh/work/junsheng-hardware)
[tn.i17i.com 跨境服务 / 订阅制电商 订阅制在线销售站（Stripe支付） 面向跨境业务用户的订阅制销售站，从企划、设计到实现与上线运维独立完成：Stripe Checkout在线支付、Webhook订单状态同步、管理后台、客户自助页面与全流程邮件通知。 - Next.js - TypeScript - Prisma - PostgreSQL 了解详情](https://studio.i17i.com/zh/work/subscription-commerce)

## 相关文章

- [PHP2Shell 是什么？PHP 网站漏洞排查与修复指南了解 PHP2Shell（CVE-2026-109618、CVE-2026-109619）的原理与影响，按步骤检查网站 PHP 版本、安装安全补丁、重启服务并验证修复，避免只改配置却遗漏核心风险。了解详情](https://studio.i17i.com/zh/blog/php2shell-loudong-xiufu)

- [Shopify还是定制开发？外贸独立站选型的完整对比外贸独立站该用Shopify等SaaS平台还是找服务商定制开发？本文从前期与长期成本结构、SEO自由度、多语言与RTL支持、B2B功能适配、数据与源码归属五个维度做完整对比，给出零售型与B2B获客型业务的不同选型建议，帮你避免选错路线导致推倒重来。了解详情](https://studio.i17i.com/zh/blog/shopify-vs-dingzhi-kaifa)

- [外贸独立站SEO实操指南：让海外买家搜到你的八个要点外贸独立站SEO怎么做？本文从技术SEO基础、关键词意图分层、多语言hreflang配置、产品详情页优化、内容营销与外链建设等八个实操要点展开，附关键词分层示例与上线自查表格，帮助外贸企业在谷歌获得自然流量，把独立站变成持续产生询盘的获客渠道。了解详情](https://studio.i17i.com/zh/blog/dulizhan-seo-youhua)

## 准备好开始你的外贸独立站了吗？

免费咨询，一个工作日内回复，提供针对你行业的建站建议与报价

[免费咨询](https://studio.i17i.com/zh/contact)
[查看案例](https://studio.i17i.com/zh/work)