由于网页的特点，我们可以进行很多定制化，比如利用油猴脚本就能做很多事情，但它们却缺乏整体性与体验一致性，于是我开发了 Steward Helper 这个扩展，内置一些常用操作，并实现操作的自动化。

在 Chrome 应用商店下载安装，代码开源

在官网 http://ihelpers.app/ 可以发布和共享操作配置

Steward Helper 能做什么？

非侵入式的阅读模式

不改变页面的结构与样式，只对阅读区以外的内容进行暂时隐藏，按 ESC 可以退出

B 站 / 腾讯视频页自动宽屏

个人看视频的时候喜欢直接宽屏，但每次都要找到宽屏按钮再点击一下，挺麻烦。

通过类似下图的配置，则可以免去此麻烦。

图片类资源下载

主要是针对那些有特殊限制的网站，比如微信读书 PC 版。

通过设置的快捷键(chrome://extensions/shortcuts)唤起下载资源(Download Element)的动作，将虚线框中指定图片，点击即可下载，配合通用图片下载这个 Automation，体验更佳。

给博客类文章自动添加锚点

某些文章页面虽然用了各级别的标题排版，但却无法利用标题在进行页面内的定位，

以 https://cloud.tencent.com/developer/article/1482342 为例

而 Steward Helper 的添加锚点功能可以弥补这个缺失。

说明：此功能只对部分网站有效。

其它内置操作

还有代码拷贝、删除页面元素、让视频链接包含播放进度、全屏页面某块区域等等，这里就不一一说明。

发布/共享配置平台

虽然操作已经大幅简化，但为了更方便大家使用，我基于 LeanCloud + Github Action 搭建了 Automation(自动化配置)的共享平台 http://ihelpers.app/。

一些基本概念

动作

就是 Steward Helper 内置的一些功能，通过右键菜单或快捷键可以执行，快捷键请访问 chrome://extensions/shortcuts 找到 Steward Helper 设置即可。

记录

大部分动作执行后都会产出一条记录(record)，可以在 popup 的 Records 面板查看到。

自动化

如果你想让某个动作在某些网站的页面自动执行，就需要用到自动化(Automation)。

自动化(Automation)可以单独添加，也可以从 Records 里转成。

它有两个参数，即指令(Instructions)与模式(Pattern)：

指令(Instructions)：用来描述动作与它的参数。以下图为例，readMode 是动作名，@.article-area 表示动作将应用于 .article-area 这个 css selector 代表的页面元素。

模式(Pattern)：表明指令将在哪些页面会自动执行，如 https://juejin.im/post/* 就对应着掘金的所有 post 页面。

使用

Steward Helper 的使用可能需要一些基本的 css selector 知识。如果你不了解这块，建议了解下，也可以去 http://ihelpers.app/ 查找，或者在这里、QQ 群里、Steward 论坛或 Github Issue 中提问。

其它

目前内置的这些动作，只是个人在使用浏览器过程中收集的一些需求，如果大家有一些较为通用的动作设想，我将在后续迭代中实现，当然也欢迎 Pull requests。