零基础也能做浏览器插件,Google 的这个工具帮你轻松搞定

2021 年 11 月 19 日 少数派
浏览器是我们网上冲浪必不可少的工具之一,不管你在用的是哪一款,新标签页往往都是我们进入网络世界的重要入口。
因此市面上已经有了不少对新标签页进行美化或增强的第三方扩展程序,比如少数派介绍过的 Momentum、Infinity 等。这些新标签页扩展很多又会以「个性化定制」为卖点,我们在点开浏览器图标的同时,只属于自己的网络浏览体验就已经准备好了。
也正是因为类似的原因,Google 近日推出的  Tab Maker  才如此具有吸引力——作为 Chrome 背后的缔造者,Google 推出的这款小工具将选择权完全交给用户,让我们即便没有任何代码基础也能制作一款只属于自己的新标签页扩展。
和大多数「零代码」工具一样,Tab Maker 为我们提供了非常直观的分步引导和图形化定制界面 。在 Tab Maker 官网选择 Make your own 进入在线编辑器页面后,我们首先需要从 11 种预置模板中选择一种进行编辑(也可以导入其它人分享过来的 .zip 文件)。
随后 Tab Maker 会引导我们创建一个用于页面内容搭建的 Google Sheet 表格模板。我们此刻需要做的是生成一份这份表格的副本,并将其保存到自己的 Google Drive 存储中。
然后就是在 Google Sheet 中自由发挥的时候了
  • 表格中每一行都代表着一个标签页,我们可以为其添加上页面的背景图片、在每个区块中添加上我们想添加的文字或图片(图片需为链接的形式)
  • 也可以为每个区块附加上超链接,这样区块就具备了点击跳转至目标链接的能力

为了避免大家在 Google Sheet 和 Tab Maker 中来回跳转,表格的左上角还贴心地加上了我们选择的模板样式缩略图。
编辑完表格内容后,接下来我们需要将表格转为公开形式 :依次点击左上角菜单 File > Share > Publish to web,并在弹出的对话框里的两个下拉菜单中分别选择第二份副表 Step 2: Add content to this sheet 和 .csv 格式 Comma-separated values (*.csv),最后点击发布(Publish)按钮即可。
此时,Google Sheets 会自动为表格生成一个链接,我们需要将其复制并粘贴到 Tab Maker 页面下方的对话框中,让 Tab Maker 读取表格中输入的页面数据来生成相应的文字和多媒体内容。
最后,对我们塞进标签页中的各种元素进行排版 。Tab Maker 提供了非常细致的页面元素排版选项,我们可以一步步定制每一个设计细节,包括背景色、背景图片的排版方式、页面与区块的边距、各个区块的大小、字体类型与大小等。总之,根据自己的喜好和品味微调即可,右侧会即时生成对应的效果预览,直到自己满意为止。
至于导出和使用,新标签页扩展制作完成后,Tab Maker 会自动生成一个包含扩展文件的压缩包文件供我们下载。我们可以将其安装进 Chrome/Edge 浏览器中来查看实际效果。
以 Chrome 为例:打开 Chorme 的扩展设置页面,开启开发者模式,然后点击加载扩展包,选择刚刚下载好并解压生成的文件夹。随后打开一个新标签页就能看到自己制作的新标签页扩展效果了!
若要将制作的扩展小范围地与朋友家人分享,只需将压缩包发送给他们,请他们按照上述加载扩展包的步骤重复操作一遍,就能在打开新标签时看到自己制作的扩展了;如果你想让更多用户下载、使用自己制作的新标签页扩展,还可以前往 Chrome 线上扩展商店注册、登录 Google 开发者账号,将压缩包文件上传并等待审核,通过后便会公开向所有 Chrome 用户提供下载。
当然,即便是小范围分享,我们也能对自己制作的新标签页面进行即时更新 !只需持续编辑更新先前那份 Google Sheets 在线表格的内容,被分享者就能在每次打开新标签页的时候第一时间看到我们的内容更新。
在 Google 的设想里,创建 Tab Maker 产品的初衷是为了在这个每天都有无数标签页被打开的时代里,让大家都能无门槛地利用这个平台去与他人分享自己的 idea 或是各种喜爱的事物,例如其给出的四个范例便包含在标签页中建立有关银河星系的画廊来探索学习银河系的奥秘、查看网络上各种可爱的猫猫狗狗、欣赏新生艺术家的作品并获得灵感、从本地的独立商户获取最新的信息和近况等等。
从某种程度上来说,Tab Maker有些类似 Google 早年的产品「iGoogle」服务,该服务可以让用户按照个人的喜好来方便地定制和整合不同来源的信息在 Google 主页上,使其成为一个个性化的门户。
你可以即刻前往 Tab Maker 主页 (https://tabmaker.withgoogle.com/) 来体验这款新产品。
/ 更多热门文章 /

登录查看更多
0

相关内容

【开放书】《命令行数据科学指南(第二版)》
专知会员服务
42+阅读 · 2021年12月13日
【实用书】Python数据分析手册,437页pdf带你实战数据清洗
专知会员服务
25+阅读 · 2021年5月23日
一图搞定ML!2020版机器学习技术路线图,35页ppt
专知会员服务
93+阅读 · 2020年7月28日
TensorFlow Lite指南实战《TensorFlow Lite A primer》,附48页PPT
专知会员服务
69+阅读 · 2020年1月17日
【GitHub实战】Pytorch实现的小样本逼真的视频到视频转换
专知会员服务
35+阅读 · 2019年12月15日
【斯坦福&Google】面向机器人的机器学习,63页PPT
专知会员服务
24+阅读 · 2019年11月19日
【电子书】Flutter实战305页PDF免费下载
专知会员服务
22+阅读 · 2019年11月7日
电脑装不了 Windows 11?用这个小工具就能搞定
计算机视觉中的图像标注工具总结
极市平台
1+阅读 · 2021年10月21日
国家自然科学基金
0+阅读 · 2013年12月31日
国家自然科学基金
0+阅读 · 2013年12月31日
国家自然科学基金
0+阅读 · 2012年12月31日
国家自然科学基金
0+阅读 · 2012年12月31日
国家自然科学基金
7+阅读 · 2012年12月31日
国家自然科学基金
0+阅读 · 2012年12月31日
国家自然科学基金
0+阅读 · 2012年12月31日
国家自然科学基金
0+阅读 · 2012年12月31日
国家自然科学基金
0+阅读 · 2011年12月31日
国家自然科学基金
0+阅读 · 2009年12月31日
Deformable Style Transfer
Arxiv
14+阅读 · 2020年3月24日
Arxiv
10+阅读 · 2018年2月17日
VIP会员
相关VIP内容
相关基金
国家自然科学基金
0+阅读 · 2013年12月31日
国家自然科学基金
0+阅读 · 2013年12月31日
国家自然科学基金
0+阅读 · 2012年12月31日
国家自然科学基金
0+阅读 · 2012年12月31日
国家自然科学基金
7+阅读 · 2012年12月31日
国家自然科学基金
0+阅读 · 2012年12月31日
国家自然科学基金
0+阅读 · 2012年12月31日
国家自然科学基金
0+阅读 · 2012年12月31日
国家自然科学基金
0+阅读 · 2011年12月31日
国家自然科学基金
0+阅读 · 2009年12月31日
Top
微信扫码咨询专知VIP会员