Skip to content

utags/utags

Repository files navigation

UTags - Add usertags to links

English | 中文

Add custom tags or notes to links such as users, posts and videos. For example, tags can be added to users or posts on a forum, making it easy to identify them or block their posts and replies. It works on X (Twitter), Reddit, Facebook, Threads, Instagram, Youtube, TikTok, GitHub, Greasy Fork, Hacker News, pixiv and numerous other websites.

UTags = Usertags. Userscript, Userstyle allows users to customize the functionality and style of the site, Usertags allows users to customize the tags (labels) for the site.

For now it works on

Installation

Usage

  • Move the mouse over the title of the post or the username, and a tag 🏷️ icon will appear next to it, click the icon to add tags

  • Multiple tags are separated by commas

  • Tags can be added to post titles, usernames, and categories screenshots

  • Some special tags have special effects, such as 'ignore', 'clickbait', 'promotion', 'block', 'hide', etc. screenshots

Screenshots

screenshots

screenshots

screenshots

screenshots

screenshots

screenshots

screenshots

screenshots

screenshots

screenshots

screenshots

screenshots

screenshots

Video Demos

Features

  • You can directly add tags to the browsed page, and the page will not be reloaded when you save the tag
  • Tags can be added to post titles, usernames, and categories
  • Support Vimium extension, click the 'f' key, the tag icon will also have a hint marker, you can quickly add tags
  • On the tag list page, you can see tagged users and posts, sorted by update order
  • Support data export and import
  • Automatically mark browsed posts. You can display the browsed content semi - transparently or hide it. This feature needs to be manually enabled on the settings page. By default, it is turned off. Currently, it is only applicable to the website linux.do.

Release Notes

  • 0.12.11
    • Remove the limit on the number of settable emoji tags
  • 0.12.10
    • On BOSS Zhipin, you can mark companies and job positions and leave remarks. For instance, adding tags like "block" or "hide" allows you to hide uninterested companies and job positions.
    • Make UTags support the website forum.cursor.com
  • 0.12.9
  • 0.12.5
    • Enhance the mobile experience of Discourse
    • Make UTags support the website kater.me and bbs.viva-la-vita.org
  • 0.12.4
  • 0.12.3
  • 0.12.2
    • Make UTags support the website built with flarum, includes discuss.flarum.org, discuss.flarum.org.cn, www.nodeloc.com, freesmth.net, veryfb.com
  • 0.12.1
    • Make UTags support the website bbs.tampermonkey.net.cn
    • Add the official installation URLs for userscripts as well as the URLs of extension stores.
    • Enable browsing content tagging on V2EX
    • Display the enable button on websites that support browsing content tagging
  • 0.12.0
    • Enable applying custom style
  • 0.11.1
    • Add an option for change the title color for the browsed content
  • 0.11.0
    • Automatically mark browsed posts. You can display the browsed content semi - transparently or hide it. This feature needs to be manually enabled on the settings page. By default, it is turned off. Currently, it is only applicable to the website linux.do.
    • Display the "Settings" button in the tag input interface
  • 0.10.7
    • Enhance add tags on X (Twitter). Filtering tweet and comments with special tags.
  • 0.10.6
    • Apply utags to community.wanikani.com
  • 0.10.4
    • Apply utags to rule34video.com, rule34gen.com
  • 0.10.3
    • Enable add tags to communities, posts and users on Reddit. Filtering posts and comments with special tags.
    • Enable add tags to videos and users on TikTok. Filtering videos and replies with special tags.
  • 0.10.1
    • Enable add tags to notes and users on RedNote(xiaohongshu). Filtering notes and replies with special tags.
    • Improve performance
  • 0.9.11
    • Enable add tags to posts, categories and tags on linux.do and other discourse sites. Filtering posts and replies with special tags.
  • 0.9.10
    • Apply utags to dlsite.com
    • Apply utags to dmm.co.jp
    • Apply utags to kemono.su
    • Apply utags to coomer.su
    • Apply utags to keylol.com
  • 0.9.9
    • Apply utags to www.pixiv.net
    • Apply utags to linux.do
    • Apply utags to meta.appinn.net
    • Apply utags to NGA
  • 0.9.8
    • twitter.com -> x.com
    • fix github.com, threads.net, e-hentai.org issues
  • 0.9.5
    • Add emoji tags 👍
    • Increase the size of the list of candidate tags
    • Enable the select/find feature on the tag management page
    • Use CSS custom properties to define the width of the text tag border
  • 0.9.4
    • Update selectors for GitHub, now can add tags to issues, pulls and discussions
    • Define utags font-size and icon size with CSS custom properties
  • 0.9.3
    • Update selectors and style
    • Apply utags to douban.com
    • Apply utags to myanimelist.net
    • Change the injection moment to 'document_start'
  • 0.9.1
    • Add the copy button in the prompt UI
  • 0.9.0
    • Use advanced tag input prompt UI
    • Define utags ul styles with css custom properties
  • 0.8.10
    • Apply utags to rebang.today
  • 0.8.9
    • Update bilibili.com, greasyfork.org, youtube.com, douyin.com, pornhub.com style and matching rules
  • 0.8.8
    • Apply utags to podcasts.google.com
    • Apply utags to douyin.com
    • Apply utags to sspai.com
  • 0.8.7
    • Apply utags to weibo.com, weibo.cn
    • Apply utags to pornhub.com
  • 0.8.6
    • Apply utags to xiaohongshu.com
  • 0.8.5
    • Apply utags to zhihu.com
  • 0.8.4
    • Fix a bug on YouTube, compare keys when reusing utags elements
    • Update youtube selectors and style
  • 0.8.0
    • Implement multi-language support, currently supports English and Chinese
  • 0.7.7
    • Update instagram.com, threads.net
    • Improve performance, update tags when document is not hidden
  • 0.7.6
    • use svg element instead of background-image with data: url to fix CSP issue
    • (v2ex): handle cited replies generated by ve2x.rep userscript
  • 0.7.5
    • Handle default site rules for chrome extension and firefox addon
    • Add option to enable/disable utags on current site
    • Update bilibili, github selectors
  • 0.7.2
    • Apply utags to 52pojie.cn
    • Apply utags to juejin.cn
  • 0.7.1
    • Apply utags to tiktok.com
    • Apply utags to bilibili.com
    • Apply utags to youtube.com
    • Apply utags to facebook.com
  • 0.7.0
    • Apply utags to threads.net
    • Apply utags to instagram.com
    • Apply utags to mp.weixin.qq.com
  • 0.6.7
    • Apply utags to twitter.com
  • 0.6.6
    • [github] Match username in issues, PRs and commits
    • Prevent utags elements from being remade when the tags have not changed
  • 0.6.5
    • Apply utags to reddit.com
  • 0.6.4
    • Apply utags to github.com
  • 0.6.3
    • Apply utags to lobste.rs
    • Move focus on utags elements through the TAB key
    • Show utags with vimium hint marker on Firefox
  • 0.6.0
    • Apply utags to hacker news (news.ycombinator.com)
  • 0.5.2
    • Improve performance
    • Prevent tag content from being copied together when copying HTML text
  • 0.5.0
    • Apply utags to greasyfork.org and sleazyfork.org
    • [V2EX] 允许给所有外部链接添加标签
  • 0.4.5
    • 取消点击空白区域时显示标签按钮的延迟效果
    • 连续点击区域相同时,隐藏标签按钮
  • 0.4.1
    • 更新标签图标与样式
  • 0.4.0
    • 支持触屏设备
  • 0.3.1
    • 提高可访问性, 修改 v2ex 超级增强兼容问题
  • 0.3.0
    • 修复楼中楼回复模式时,隐藏或半透明效果影响整个楼的问题
  • 0.2.1
    • 设置中添加打开标签列表,导出数据/导入数据链接
  • 0.2.0
    • 添加设置功能,可以设置是否显示被隐藏的内容,是否去除半透明效果
  • 0.1.10
    • 兼容 Violentmonkey, Greasemonkey(Firefox), Userscripts(Safari) 等脚本管理器
  • 0.1.5
    • 添加更多特殊标签,比如:标题党, 推广, 无聊, 忽略, 已阅, hide, 隐藏, 不再显示, 热门, 收藏, 关注, 稍后阅读
    • 修改 www.v2ex.com 匹配规则,支持更多页面,比如:提醒系统、账户余额等
  • 0.1.4
  • 0.1.2
    • 解决 Firefox 浏览器不支持 'sb', 'block' 等标签的特殊功能的问题
  • See more

Development

This extension/userscript is built from Browser Extension Starter and Userscript Starter

Features

  • One codebase for Chrome extesions, Firefox addons, Userscripts, Bookmarklets and simple JavaScript modules
  • Live-reload and React HMR
  • Plasmo - The Browser Extension Framework
  • esbuild - Bundler
  • React
  • TypeScript
  • Prettier - Code Formatter
  • XO - JavaScript/TypeScript linter

Showcases

  • 🏷️ UTags - Add usertags to links - Allow users to add custom tags to links.
  • 🔗 Links Helper - Open external links in a new tab, open internal links matching the specified rules in a new tab, convert text to hyperlinks, convert image links to image tags, parse Markdown style links and image tags, parse BBCode style links and image tags

How To Make A New Extension

  1. Fork this starter repo, and rename repo to your extension name

  2. Clone your repo

  3. Install dependencies

pnpm install
# or
npm install

Getting Started

First, run the development server:

pnpm dev
# or
npm run dev

Open your browser and load the appropriate development build. For example, if you are developing for the chrome browser, using manifest v3, use: build/chrome-mv3-dev.

You can start editing the popup by modifying popup.tsx. It should auto-update as you make changes. To add an options page, simply add a options.tsx file to the root of the project, with a react component default exported. Likewise to add a content page, add a content.ts file to the root of the project, importing some module and do some logic, then reload the extension on your browser.

For further guidance, visit our Documentation

Making production build

Run the following:

pnpm build
# or
npm run build

This should create a production bundle for your extension, ready to be zipped and published to the stores.

Submit to the webstores

The easiest way to deploy your Plasmo extension is to use the built-in bpp GitHub action. Prior to using this action however, make sure to build your extension and upload the first version to the store to establish the basic credentials. Then, simply follow this setup instruction and you should be on your way for automated submission!

License

Copyright (c) 2023 Pipecraft. Licensed under the MIT License.

>_

Pipecraft UTags