自定义标注插件LINER， 将标注的文本/图片/视频/音频/链接直接渲染在网页中

本文涉及chrome插件的修改，需要微量的javascript/html的知识。

Liner概述

Liner是一款网页及PDF的标注软件。我们在阅览网页时，常需要记录下心得，资料，图片，及补充文字，以便他日温习之用，这时Liner便派上用场。

本文所讲的是Liner的Chrome插件，它也有自己的手机端app。我们首先在Google Web Store搜索安装Liner，并注册登录Liner账号

Figure1.1

Liner的标注

Liner的标注很简单，只需要选中文本，并点击自动弹出的Liner的图标，则选中的文本会自动添加黄色的高亮。我们也可以继续编辑，选择颜色，添加标注文字。

Liner的编辑界面如下图

Figure1.2

Tips

Figure1.2 截取自技术网站geeksforgeeks中的这篇文章types transmission media, 下文所有操作都将基于此文章页面

我们还需为当前网页的标记选择存储文件夹，如果不选择，则标记的内容不会永久存储。文件夹的选择框会在我们为当前网页做初次标记后，自动弹出。也可通过点击Chrome的extensions tools bar中的Liner图标调出。

Figure1.3

如Figure1.3 所示，在我们选择tech文件夹后，则所有标记将存储到tech中。

当我们下次进入到同一网页时，则我们标记的内容，会在网页加载完成后，自动加载。

我们也可以在Liner后台查询/查看我们标记的内容。可以通过点击Figure1.3中的 Go to Dashboard按钮，跳转到后台。

也可以直接