README.en.md

Fork-specific changes

This fork differs from the official Obsidian Web Clipper main version by improving Chinese-language content archiving. It normalizes lazy-loaded images in WeChat official account articles so Obsidian's local image saving can download the original article images, adds one-click clipping support for Bilibili, Douyin, and YouTube video pages, and can automatically start a local yt-dlp download through a native helper after clipping. Video clips save the title, creator, publish time, cover image, description, summary, video link, and captions or transcripts when they are available. This fork uses the Simplified Chinese README as the default and keeps this English README available separately.

Languages: Simplified Chinese | English

Problems this fork solves

This fork is intended for users searching for issues like these:

• Obsidian Web Clipper does not save images locally when clipping WeChat official account articles.
• Images from WeChat articles become placeholders, blank images, duplicate images, or incorrect Markdown image URLs.
• WeChat lazy-loading keeps the original image URLs in data-src or data-srcset, while clipping captures runtime URLs with wx_lazy, #imgIndex, or tp=webp.
• Articles clipped from mp.weixin.qq.com include mmbiz.qpic.cn images that Obsidian cannot reliably download or archive.
• You want Obsidian's local image saving to capture the original WeChat article images without manually scrolling, refreshing images, or running a second pass inside Obsidian.
• Obsidian Web Clipper clips Bilibili, Douyin, or YouTube video pages as plain web pages and misses the title, creator, cover image, publish time, description, captions, or transcript.
• You want to archive videos in Obsidian with a ready-made video note, summary, transcript, source link, and default download command.
• You want one clip action to also download Bilibili, Douyin, or YouTube video files locally without copying a yt-dlp command by hand.
• You want video downloads to run through an auditable native helper instead of bundling a downloader inside the browser extension.

Obsidian Web Clipper helps you highlight and capture the web in your favorite browser. Anything you save is stored as durable Markdown files that you can read offline, and preserve for the long term.

• Download Web Clipper
• Documentation
• Troubleshooting

Get started

Install the extension by downloading it from the official directory for your browser:

• Chrome Web Store for Chrome, Brave, Arc, Orion, and other Chromium-based browsers.
• Firefox Add-Ons for Firefox and Firefox Mobile.
• Safari Extensions for macOS, iOS, and iPadOS.
• Edge Add-Ons for Microsoft Edge.

Use the extension

Documentation is available on the Obsidian Help site, which covers how to use highlighting, templates, variables, filters, and more.

Web Clipper also normalizes lazy-loaded images before extracting content. This helps pages that keep their real image URLs in attributes such as data-src or data-srcset, including WeChat official account articles, so image capture and Obsidian's local image saving use the original image URLs instead of placeholders or runtime lazy-load URLs.

For Bilibili, Douyin, and YouTube video pages, Web Clipper automatically selects the built-in Video clipping template and injects variables such as {{videoTitle}}, {{videoAuthor}}, {{videoPublished}}, {{videoCover}}, {{videoDescription}}, {{videoSummary}}, {{videoTranscript}}, {{videoPlatform}}, {{videoUrl}}, {{videoDownloadCommand}}, and {{videoDownloadCommandInstallGuide}}. The default summary is generated from the description or the beginning of the transcript and does not call an external AI provider. If you already use the interpreter, you can still add prompt variables to your own video templates for AI summaries.

Automatic video download is enabled by default. Browser extensions cannot directly start local programs, so this fork includes a native-downloader helper. After you install the helper once and install yt-dlp, clipping a video page sends a download job while saving the note, and the helper starts yt-dlp in the background. The default folder template is {{vaultRoot}}/99-Assets/{{path}}. The native helper resolves vaultRoot from the local Obsidian config; for example, if the vault path is /Users/admin/Documents/Obsidian Vault and the note path is Clippings/Videos, the video is saved under /Users/admin/Documents/Obsidian Vault/99-Assets/Clippings/Videos. Video notes still keep a command such as yt-dlp "{{url}}" -o "{{videoTitle}}.%(ext)s" for auditing and manual retries.

Enable automatic video download

1. Install yt-dlp; on macOS:

brew install yt-dlp

2. After building or unpacking the extension package, install the native helper from the native-downloader folder:

./native-downloader/install-macos.sh chrome <chrome-extension-id>
./native-downloader/install-macos.sh edge <edge-extension-id>
./native-downloader/install-macos.sh firefox

Chromium browsers require the current extension ID from the browser extensions page. Restart the browser after installation, then clip a video page to start a local download automatically. Downloads still depend on platform login state, region, paid-access rules, and yt-dlp support. This project does not bundle a downloader and does not bypass platform restrictions.

Contribute

Translations

You can help translate Web Clipper into your language. Submit your translation via pull request using the format found in the /_locales folder.

Features and bug fixes

See the help wanted tag for issues where contributions are welcome.

Roadmap

In no particular order:

• A separate icon for Web Clipper
• Annotate highlights
• Template directory
• Sync settings across browsers
• One-click clipping for video platforms such as Bilibili, Douyin, and YouTube, including title, creator, publish time, cover image, description, video link, captions or transcripts, and other metadata useful for Obsidian archives
• Automatically start local yt-dlp video downloads through a native helper after clipping
• Continue improving video clipping with more reliable transcript capture, mobile share-link handling, short-video page support, template examples, and manual acceptance checks
• Template validation
• Template logic (if/for)
• Save images locally, added in Obsidian 1.8.0
• Translate UI into more languages — help is welcomed

Developers

To build the extension:

npm run build

This will create three directories:

• dist/ for the Chromium version
• dist_firefox/ for the Firefox version
• dist_safari/ for the Safari version

Install the extension locally

For Chromium browsers, such as Chrome, Brave, Edge, and Arc:

1. Open your browser and navigate to chrome://extensions
2. Enable Developer mode
3. Click Load unpacked and select the dist directory

For Firefox:

1. Open Firefox and navigate to about:debugging#/runtime/this-firefox
2. Click Load Temporary Add-on
3. Navigate to the dist_firefox directory and select the manifest.json file

If you want to run the extension permanently you can do so with the Nightly or Developer versions of Firefox.

1. Type about:config in the URL bar
2. In the Search box type xpinstall.signatures.required
3. Double-click the preference, or right-click and select "Toggle", to set it to false.
4. Go to about:addons > gear icon > Install Add-on From File…

For iOS Simulator testing on macOS:

1. Run npm run build to build the extension
2. Open xcode/Obsidian Web Clipper/Obsidian Web Clipper.xcodeproj in Xcode
3. Select the Obsidian Web Clipper (iOS) scheme from the scheme selector
4. Choose an iOS Simulator device and click Run to build and launch the app
5. Once the app is running on the simulator, open Safari
6. Navigate to a webpage and tap the Extensions button in Safari to access the Web Clipper extension

Run tests

npm test

Or run in watch mode during development:

npm run test:watch

When changing content extraction or image handling, run the focused regression tests:

npx vitest run src/api.test.ts src/utils/lazy-images.test.ts src/utils/filters/image.test.ts

When changing video clipping logic, run:

npx vitest run src/utils/video-download-request.test.ts src/utils/video-clipping.test.ts src/api.test.ts

Third-party libraries

• webextension-polyfill for browser compatibility
• defuddle for content extraction and Markdown conversion
• dayjs for date parsing and formatting
• lz-string to compress templates to reduce storage space
• lucide for icons
• dompurify for sanitizing HTML

License

Obsidian Web Clipper source code is open source under the MIT License. All trademarks, icons, marketing copy, and other marketing assets are excluded from that license.