article-exporter
ウェブ記事をObsidianで読みやすいMarkdown形式でローカルに保存し、画像もまとめてダウンロード、リンクを修正、必要に応じてAI翻訳も行い、READMEやナビゲーションファイルも作成して整理された状態で記事を保存するSkill。
📜 元の英語説明(参考)
Export any web article to a local Obsidian-ready Markdown directory. Fetches page content via actionbook CLI, downloads images locally, rewrites image references to relative paths, and optionally translates the article using AI. Produces a self-contained folder with README.md, images/, and an index.md navigation file.
🇯🇵 日本人クリエイター向け解説
ウェブ記事をObsidianで読みやすいMarkdown形式でローカルに保存し、画像もまとめてダウンロード、リンクを修正、必要に応じてAI翻訳も行い、READMEやナビゲーションファイルも作成して整理された状態で記事を保存するSkill。
※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。
下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o article-exporter.zip https://jpskill.com/download/15679.zip && unzip -o article-exporter.zip && rm article-exporter.zip
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/15679.zip -OutFile "$d\article-exporter.zip"; Expand-Archive "$d\article-exporter.zip" -DestinationPath $d -Force; ri "$d\article-exporter.zip"
完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。
💾 手動でダウンロードしたい(コマンドが難しい人向け)
- 1. 下の青いボタンを押して
article-exporter.zipをダウンロード - 2. ZIPファイルをダブルクリックで解凍 →
article-exporterフォルダができる - 3. そのフォルダを
C:\Users\あなたの名前\.claude\skills\(Win)または~/.claude/skills/(Mac)へ移動 - 4. Claude Code を再起動
⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。
🎯 このSkillでできること
下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。
📦 インストール方法 (3ステップ)
- 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
- 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
- 3. 展開してできたフォルダを、ホームフォルダの
.claude/skills/に置く- · macOS / Linux:
~/.claude/skills/ - · Windows:
%USERPROFILE%\.claude\skills\
- · macOS / Linux:
Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。
詳しい使い方ガイドを見る →- 最終更新
- 2026-05-18
- 取得日時
- 2026-05-18
- 同梱ファイル
- 6
📖 Skill本文(日本語訳)
※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。
Article Exporter - 記事をObsidianにエクスポート
バージョン: 0.5.0 | 最終更新日: 2026-03-13
あなたはウェブコンテンツのアーカイブとObsidianのワークフロー自動化のエキスパートです。
エクスポートの失敗から得られた教訓
これらのルールは、実際のエクスポートの失敗から抽出されました。それぞれが特定の種類のエラーを防ぎます。
- Twitter/XはAIによる再フォーマットが必要 —
fetchはセマンティックHTMLのないカスタムUIを使用しているため、Twitterはフラットなテキストを返します。AIによる再フォーマットのステップでは、見出し、リスト、コードブロックを再構築します。references/twitter-handling.mdを参照してください。 - 最初に出力パスを尋ねる — ユーザーは異なるvaultの場所を持っています。デフォルトを想定すると、間違った場所にファイルが作成され、移動に時間がかかります。
- actionbookのバージョンが0.9.1以上であることを確認 —
--wait-hintパラメータは0.9.1で追加されました。これがないと、動的なコンテンツ(SPA、遅延ロードされたページ)は空または部分的な結果を返します。 - ナビゲーション後に待機 — Twitter、Medium、その他の動的なサイトには
--wait-hint heavyを使用します。これがないと、コンテンツが抽出されるときにページがまだレンダリングを完了していません。 - バッチエクスポートのレート制限 — リクエスト間に3〜5秒の遅延を入れることで、ボットとしてフラグが立てられるのを防ぎます(ToS準拠)。
クイックリファレンス
| タスク | コマンド | 成功基準 |
|---|---|---|
| 依存関係の確認 | actionbook --version |
バージョンが0.9.1以上を表示 |
| 記事の取得 | actionbook browser fetch <url> --wait-hint heavy |
プレーンテキストを返す(ステップ1bでAIがMarkdownに再フォーマット) |
| 翻訳 | AIセッションで直接 | README_CN.mdが作成される |
| Obsidianで開く | obsidian-cli open "path/index.md" |
ファイルがObsidianで開く |
完全なエクスポートワークフロー
目標: ウェブ記事を画像とオプションの翻訳とともにObsidianディレクトリにエクスポートする
成功基準:
- README.mdを含む記事ディレクトリが作成される
- すべての画像がimages/にダウンロードされる
- index.mdナビゲーションファイルが作成される
- オプション: README_CN.md翻訳
- Obsidianで開く(obsidian-cliが利用可能な場合)
ステップ1: 記事コンテンツの取得
実行: 直接(Bash)
# 記事を可読性テキストとして取得(ログのクリーンアップ付き)
actionbook browser fetch "$URL" --wait-hint heavy 2>/dev/null | \
sed '/^[[:space:]]*$/d;/^\x1b\[/d;/^INFO/d' > /tmp/article_raw.txt
成功基準:
/tmp/article_raw.txtが存在し、サイズが0バイトより大きい- コンテンツに記事のメインテキストが含まれている
fetchコマンドは、可読性抽出されたプレーンテキスト(Markdownではない)を返します。
適切なMarkdownを生成するには、ステップ1bでのAIによる再フォーマットが常に必要です。
ルール:
- Twitter、Medium、動的なコンテンツには
--wait-hint heavyを使用する - 静的なブログには
--wait-hint lightを使用する 2>/dev/nullはstderrログを抑制するsedはANSIコード、INFO行、空行を削除する
Twitter/Xの特別な扱い
Twitterは非セマンティックHTMLを使用しているため、fetchの出力はすべての構造を失います(見出しはフラットなテキストになり、コードブロックは消えます)。URLにx.comまたはtwitter.comが含まれている場合は、ステップ1bでの構造の再構築に特に注意してください。references/twitter-handling.mdを参照してください。
ステップ1b: AIによるMarkdownへの再フォーマット
実行: 直接(AIセッション)
/tmp/article_raw.txtを読み込み、プレーンテキストを構造化されたMarkdownに変換します。結果を/tmp/article.mdに保存します。
再フォーマットのルール:
- テキスト構造から見出し(
#、##、###)を再構築する - 元の画像URLを
参照として保持する - コードブロック、リスト、テーブル、引用符をフォーマットする
- 元の記事タイトルを最初の
# H1見出しとして保持する
成功基準:
/tmp/article.mdが存在し、# <Title>で始まる- 画像URLがMarkdown画像構文として保持されている
ステップ2: メタデータの抽出
実行: 直接(Bash)
# タイトルを抽出(AIで再フォーマットされたmarkdownの最初のH1見出し)
TITLE=$(grep -m 1 "^# " /tmp/article.md | sed 's/^# //')
# 画像URLを抽出(data: URLを除外)
IMAGE_URLS=$(grep -o '!\[[^]]*\]([^)]*)' /tmp/article.md | \
sed -E 's/!\[[^]]*\]\(([^)]*)\)/\1/' | \
grep -v '^data:')
成功基準:
$TITLEが空でない$IMAGE_URLSの数が予想と一致する(wc -lを使用)
ステップ3: 出力ディレクトリの確認
実行: [人間] 人間のチェックポイント: ファイルを作成する前に出力場所を確認する
ユーザーに尋ねる: "エクスポートされた記事をどこに保存しますか?"
推奨されるパス:
~/Work/Write/Articles(デフォルト)~/Documents/Obsidian/Articles~/Notes/Imported- (または
$output_dir引数からのカスタムパス)
成功基準: ユーザーが出力ディレクトリを確認する
成果物: $OUTPUT_DIR変数が設定される
ステップ4: ディレクトリ構造の作成
実行: 直接(Bash)
# 引数が提供されている場合はそれを使用し、それ以外の場合は確認されたパスを使用する
OUTPUT_DIR="${output_dir:-$USER_CONFIRMED_PATH}"
# ディレクトリ名のためにタイトルをサニタイズする
SAFE_TITLE=$(echo "$TITLE" | sed 's/[/:*?"<>|]//g' | cut -c1-100 | sed 's/^[[:space:]]*//;s/[[:space:]]*$//')
# 出力ディレクトリを作成する
ARTICLE_DIR="$OUTPUT_DIR/$SAFE_TITLE"
mkdir -p "$ARTICLE_DIR/images"
成功基準:
- ディレクトリ
$ARTICLE_DIRが存在する - サブディレクトリ
images/が存在する - ディレクトリが書き込み可能である
ルール:
- 特殊文字を削除する:
/ : * ? " < > | - タイトルの長さを100文字に制限する
- 先頭/末尾の空白をトリムする
ステップ5: 画像のダウンロード(可能な場合は並列)
実行: 直接(Bash)
counter=1
for url in $IMAGE_URLS; do
ext=$(echo "$url" | grep -oE '\.(jpg|jpeg|png|gif|webp|svg)' || echo ".jpg")
curl -L -s "$url" -o "$ARTICLE_DIR/images/image_${counter}${ext}"
# ファイルサイズを確認(0バイトの失敗を検出)
if [ ! -s "$ARTICLE_DIR/images/image_${counter}${ext}" ]; then
# 代替フォーマットを試す(Twitter)
curl -L -s "${url}?format=jpg&name=orig" -o "$ARTICLE_DIR/images/image_${counter}.jpg"
fi
counter=$((counter + 1))
done
成功基準:
- すべての画像ファイルが存在し、サイズが0バイトより大きい
- ファイル数が
$IMAGE_URLSの数と一致する
ルール:
- リダイレクトに従うために
curl -Lを使用する - ダウンロード後にファイルサイズを確認する
- Twitter imの代替フォーマットを試す
(原文はここで切り詰められています)
📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開
Article Exporter - Export Articles to Obsidian
Version: 0.5.0 | Last Updated: 2026-03-13
You are an expert at web content archiving and Obsidian workflow automation.
Lessons from Failed Exports
These rules were extracted from real export failures. Each one prevents a specific class of error:
- Twitter/X needs AI reformatting —
fetchreturns flat text because Twitter uses custom UI without semantic HTML. The AI reformatting step reconstructs headings, lists, and code blocks. Seereferences/twitter-handling.md. - Ask for output path first — users have different vault locations. Assuming a default creates files in the wrong place and wastes time moving them.
- Check actionbook version >= 0.9.1 — the
--wait-hintparameter was added in 0.9.1. Without it, dynamic content (SPAs, lazy-loaded pages) returns empty or partial results. - Wait after navigation — use
--wait-hint heavyfor Twitter, Medium, and other dynamic sites. Without it, the page hasn't finished rendering when content is extracted. - Rate limit batch exports — 3-5s delay between requests prevents being flagged as a bot (ToS compliance).
Quick Reference
| Task | Command | Success Criteria |
|---|---|---|
| Check deps | actionbook --version |
Shows version >= 0.9.1 |
| Fetch article | actionbook browser fetch <url> --wait-hint heavy |
Returns plain text (AI reformats to Markdown in Step 1b) |
| Translate | AI session directly | README_CN.md created |
| Open in Obsidian | obsidian-cli open "path/index.md" |
File opens in Obsidian |
Complete Export Workflow
Goal: Export web article to Obsidian directory with images and optional translation
Success criteria:
- Article directory created with README.md
- All images downloaded to images/
- index.md navigation file created
- Optional: README_CN.md translation
- Opened in Obsidian (if obsidian-cli available)
Step 1: Fetch Article Content
Execution: Direct (Bash)
# Fetch article as readability text (with log cleaning)
actionbook browser fetch "$URL" --wait-hint heavy 2>/dev/null | \
sed '/^[[:space:]]*$/d;/^\x1b\[/d;/^INFO/d' > /tmp/article_raw.txt
Success criteria:
/tmp/article_raw.txtexists and size > 0 bytes- Content contains the article's main text
The fetch command returns readability-extracted plain text (not Markdown). AI reformatting in Step 1b is always needed to produce proper Markdown.
Rules:
- Use
--wait-hint heavyfor Twitter, Medium, dynamic content - Use
--wait-hint lightfor static blogs 2>/dev/nullsuppresses stderr logssedremoves ANSI codes, INFO lines, empty lines
Twitter/X Special Handling
Twitter uses non-semantic HTML, so fetch output loses all structure (headings become flat text, code blocks disappear). If the URL contains x.com or twitter.com, pay extra attention to structure reconstruction in Step 1b. See references/twitter-handling.md.
Step 1b: AI Reformat to Markdown
Execution: Direct (AI session)
Read /tmp/article_raw.txt and convert the plain text into well-structured Markdown. Save the result to /tmp/article.md.
Reformatting rules:
- Reconstruct headings (
#,##,###) from the text structure - Preserve original image URLs as
references - Format code blocks, lists, tables, and blockquotes
- Keep the original article title as the first
# H1heading
Success criteria:
/tmp/article.mdexists and starts with# <Title>- Image URLs are preserved as Markdown image syntax
Step 2: Extract Metadata
Execution: Direct (Bash)
# Extract title (first H1 heading from AI-reformatted markdown)
TITLE=$(grep -m 1 "^# " /tmp/article.md | sed 's/^# //')
# Extract image URLs (filter out data: URLs)
IMAGE_URLS=$(grep -o '!\[[^]]*\]([^)]*)' /tmp/article.md | \
sed -E 's/!\[[^]]*\]\(([^)]*)\)/\1/' | \
grep -v '^data:')
Success criteria:
$TITLEis non-empty$IMAGE_URLScount matches expected (usewc -l)
Step 3: Ask Output Directory
Execution: [human] Human checkpoint: Confirm output location before creating files
Ask user: "Where should I save the exported article?"
Suggested paths:
~/Work/Write/Articles(default)~/Documents/Obsidian/Articles~/Notes/Imported- (or custom path from
$output_dirargument)
Success criteria: User confirms output directory
Artifacts: $OUTPUT_DIR variable set
Step 4: Create Directory Structure
Execution: Direct (Bash)
# Use argument if provided, otherwise use confirmed path
OUTPUT_DIR="${output_dir:-$USER_CONFIRMED_PATH}"
# Sanitize title for directory name
SAFE_TITLE=$(echo "$TITLE" | sed 's/[/:*?"<>|]//g' | cut -c1-100 | sed 's/^[[:space:]]*//;s/[[:space:]]*$//')
# Create output directory
ARTICLE_DIR="$OUTPUT_DIR/$SAFE_TITLE"
mkdir -p "$ARTICLE_DIR/images"
Success criteria:
- Directory
$ARTICLE_DIRexists - Subdirectory
images/exists - Directory is writable
Rules:
- Remove special characters:
/ : * ? " < > | - Limit title length to 100 characters
- Trim leading/trailing whitespace
Step 5: Download Images (Parallel if possible)
Execution: Direct (Bash)
counter=1
for url in $IMAGE_URLS; do
ext=$(echo "$url" | grep -oE '\.(jpg|jpeg|png|gif|webp|svg)' || echo ".jpg")
curl -L -s "$url" -o "$ARTICLE_DIR/images/image_${counter}${ext}"
# Check file size (detect 0-byte failures)
if [ ! -s "$ARTICLE_DIR/images/image_${counter}${ext}" ]; then
# Try alternative format (Twitter)
curl -L -s "${url}?format=jpg&name=orig" -o "$ARTICLE_DIR/images/image_${counter}.jpg"
fi
counter=$((counter + 1))
done
Success criteria:
- All image files exist and size > 0 bytes
- File count matches
$IMAGE_URLScount
Rules:
- Use
curl -Lto follow redirects - Check file size after download
- Try alternative formats for Twitter images
Step 6: Update Image References
Execution: Direct (Bash)
# Replace remote URLs with local paths
counter=1
for url in $IMAGE_URLS; do
ext=$(echo "$url" | grep -oE '\.(jpg|jpeg|png|gif|webp|svg)' || echo ".jpg")
sed -i.bak "s|$url|./images/image_${counter}${ext}|g" /tmp/article.md
counter=$((counter + 1))
done
# Save updated markdown
cp /tmp/article.md "$ARTICLE_DIR/README.md"
rm /tmp/article.md.bak
Success criteria:
README.mdcontains./images/image_N.*references- No remote URLs remain in image links
Step 7: AI Translation (Optional)
Execution: Direct (AI session)
Human checkpoint: Ask user: "Do you want to translate the article? (y/n)"
If yes:
- Read
$ARTICLE_DIR/README.md - Translate using AI capabilities (no external API)
- Write to
$ARTICLE_DIR/README_CN.md(or other language code)
Translation Prompt Template:
Translate the following Markdown article to [LANGUAGE] while preserving:
- All Markdown formatting (headings, lists, code blocks, tables)
- Image references exactly as-is: 
- Links and URLs unchanged
- Code blocks and technical terms in original language
Only output the translated Markdown content.
---
[Paste README.md content]
Success criteria: Translation file exists and size ≈ original ± 20%
Supported languages: en, zh, es, fr, de, ja, ko
Step 8: Create Navigation Index
Execution: Direct (Bash)
# Auto-detect source from URL
case "$URL" in
*x.com*|*twitter.com*) SOURCE="X" ;;
*medium.com*) SOURCE="Medium" ;;
*dev.to*) SOURCE="Dev.to" ;;
*openai.com*) SOURCE="OpenAI Blog" ;;
*substack.com*) SOURCE="Substack" ;;
*github.com*) SOURCE="GitHub" ;;
*) SOURCE=$(echo "$URL" | sed 's|https\?://||' | cut -d/ -f1) ;;
esac
# Create index.md
cat > "$ARTICLE_DIR/index.md" <<EOF
# $TITLE
> **Export Date**: $(date +%Y-%m-%d)
> **Original URL**: $URL
> **Source**: $SOURCE
## 📚 Language Versions
- 🇬🇧 **English**: [[README]]
- 🇨🇳 **Chinese**: [[README_CN]] <!-- if translated -->
## 📊 Metadata
| Property | Value |
|----------|-------|
| **Source** | $SOURCE |
| **Images** | $(ls images/ 2>/dev/null | wc -l) images |
| **Export Tool** | actionbook CLI |
| **Export Date** | $(date +%Y-%m-%d) |
---
**Exported using**: actionbook browser automation + AI assistant
EOF
Success criteria: index.md exists with metadata table
Step 9: Open in Obsidian
Execution: Direct (Bash)
if command -v obsidian-cli &> /dev/null; then
VAULT_ROOT="$OUTPUT_DIR"
REL_PATH=$(echo "$ARTICLE_DIR" | sed "s|$VAULT_ROOT/||")
obsidian-cli open "$REL_PATH/index.md"
echo "✓ Opened in Obsidian: $REL_PATH/index.md"
else
# Fallback: Open in file manager
case "$(uname)" in
Darwin) open "$ARTICLE_DIR" ;;
Linux) xdg-open "$ARTICLE_DIR" ;;
CYGWIN*|MINGW*|MSYS*) start "$ARTICLE_DIR" ;;
esac
echo "⚠️ Install obsidian-cli for automatic opening: npm install -g obsidian-cli"
fi
Success criteria:
- File opens in Obsidian OR directory opens in file manager
- User sees success message
Step 10: Report Success
Execution: Direct (Output)
echo ""
echo "════════════════════════════════════════════"
echo "✓ Article exported successfully!"
echo ""
echo "📁 Location: $ARTICLE_DIR"
echo "📄 Files:"
echo " - README.md (original)"
[ -f "$ARTICLE_DIR/README_CN.md" ] && echo " - README_CN.md (translation)"
echo " - index.md (navigation)"
echo "🖼️ Images: $(ls images/ 2>/dev/null | wc -l) files"
echo "════════════════════════════════════════════"
Common Issues
| Issue | Cause | Solution |
|---|---|---|
| "actionbook: command not found" | CLI not installed | npm install -g @actionbookdev/cli@latest |
| "unknown flag: --wait-hint" | Version < 0.9.1 | Upgrade: npm install -g @actionbookdev/cli@latest |
| Twitter format broken | fetch loses structure |
Use AI reformatting (see references/twitter-handling.md) |
| Images 0 bytes | URL expired | Try ?format=jpg&name=orig |
| obsidian-cli not found | Not installed | npm install -g obsidian-cli |
| Batch export blocked | Too fast, flagged as bot | Add 3-5s sleep between requests |
Detailed troubleshooting: See ./references/troubleshooting.md
Edge Cases Handled
- Long titles → Auto-truncate to 100 chars
- Special characters → Sanitized (
/ : * ? " < > |removed) - No images → Steps 5-6 skip gracefully
- 0-byte images → Auto-retry with alternative formats
- Data URLs → Filtered out in Step 2
When Using This Skill
- Check dependencies first —
actionbook --version >= 0.9.1 - Test with one article — Verify before batch processing
- Twitter/X requires special handling — See references/twitter-handling.md
- Respect ToS — Personal use only, rate limit batch exports
References (Progressive Disclosure)
For detailed documentation, see:
./references/twitter-handling.md— Twitter/X special handling (AI reformatting)./references/batch-export.md— Batch export with rate limiting./references/troubleshooting.md— Detailed troubleshooting guide./references/obsidian-setup.md— obsidian-cli setup and configuration./references/supported-websites.md— Complete website compatibility list
Last Updated: 2026-03-13 | Version: 0.5.0
同梱ファイル
※ ZIPに含まれるファイル一覧。`SKILL.md` 本体に加え、参考資料・サンプル・スクリプトが入っている場合があります。
- 📄 SKILL.md (12,639 bytes)
- 📎 references/batch-export.md (1,512 bytes)
- 📎 references/obsidian-setup.md (1,242 bytes)
- 📎 references/supported-websites.md (2,058 bytes)
- 📎 references/troubleshooting.md (2,613 bytes)
- 📎 references/twitter-handling.md (2,329 bytes)