astro-cta-injector

Astro CTA Injector スキル

目的

このスキルは、Astro サイトのコンテンツに行動喚起（CTA）ブロックを挿入します。以下をサポートします。

• 複数の CTA タイプ（ニュースレター、製品、カスタム）
• インテリジェントな配置戦略
• コンテンツに基づく関連性スコアリング
• プレビュー付きの一括処理

このスキルを使用する場面

• ユーザーが「ブログ記事に CTA を追加して」と依頼した場合
• ユーザーがコンテンツに「ニュースレター登録を挿入したい」と希望した場合
• ユーザーが投稿に「製品プロモーションを追加したい」と話した場合
• ユーザーが投稿にあらゆる種類のコンテンツブロックを一括追加したい場合
• ユーザーが Astro サイトに「行動喚起を追加したい」と希望した場合

前提条件

• .astro または .md ファイルにコンテンツがある Astro サイト
• Python 3.10+
• HTML 解析用の BeautifulSoup4

設定

スキルディレクトリに config.json を作成します。

{
  "content_path": "./src/content/blog",
  "file_patterns": ["*.astro", "*.md"],
  "cta_types": {
    "newsletter": {
      "template": "newsletter.html",
      "default_placement": "after-paragraph-50%",
      "keywords": ["tip", "guide", "learn", "strategy"]
    },
    "product": {
      "template": "product.html",
      "default_placement": "end",
      "keywords": ["productivity", "task", "habit", "goal"]
    }
  },
  "output": {
    "state_file": "./state/cta_injection_progress.json",
    "backup_dir": "./backups",
    "report_file": "./reports/cta_injection_report.md"
  },
  "dry_run": true
}

配置戦略

戦略	説明	最適な用途
end	すべてのコンテンツの後	目立ちにくい CTA
after-paragraph-50%	段落の 50% の後	コンテンツ中盤でのエンゲージメント
after-paragraph-60%	段落の 60% の後	コンテンツ後半でのエンゲージメント
after-heading	最初の H2 の後	早い段階でのエンゲージメント
before-conclusion	最後の段落の前	力強い締めくくり

CTA テンプレート

テンプレートは templates/ ディレクトリ内の HTML ファイルです。

<aside class="cta-newsletter" data-cta-type="newsletter">
  <h3>{{title}}</h3>
  <p>{{description}}</p>
  <form action="{{form_url}}" method="post">
    <input type="email" placeholder="Your email" required />
    <button type="submit">Subscribe</button>
  </form>
</aside>

変数：

• {{title}} - CTA の見出し
• {{description}} - CTA の本文
• {{form_url}} - フォーム送信 URL
• {{product_url}} - 製品リンク
• {{image_url}} - 画像ソース

ワークフロー

ステップ 1：関連性に基づいて投稿をスコアリングする

python scripts/score_posts.py --content-path ./src/content/blog --cta-type newsletter

ステップ 2：挿入内容をプレビューする

python scripts/preview_injection.py --input scored_posts.json --cta-type newsletter

ステップ 3：挿入を適用する

python scripts/inject_ctas.py --input scored_posts.json --cta-type newsletter

入力形式

スコアリング済み投稿の JSON：

{
  "posts": [
    {
      "file_path": "./src/content/blog/my-post.astro",
      "title": "My Blog Post",
      "relevance_score": 8.5,
      "cta_type": "newsletter",
      "placement": "after-paragraph-50%",
      "cta_data": {
        "title": "Get More Tips Like This",
        "description": "Subscribe to my weekly newsletter"
      }
    }
  ]
}

スコアリングアルゴリズム

投稿は、CTA との関連性に基づいて次の項目でスコアリングされます。

1. キーワード密度 - 関連キーワードがいくつ含まれているか
2. コンテンツの長さ - 投稿が長いほど候補として適しています
3. トピックの一致度 - タイトルとコンテンツのトピックの一致
4. 既存の CTA - すでに CTA がある投稿はスキップ

スコアの範囲は 0～10 です。デフォルトのしきい値：5.0

安全機能

• デフォルトでドライランモード
• 変更前にバックアップを作成
• 重複検出 - CTA がすでに存在する場合は挿入しません
• ロールバック機能 - バックアップから復元
• 差分プレビュー - 変更内容を正確に確認

使用例

ユーザー：「生産性に関するブログ記事すべてに、ニュースレター登録 CTA を追加して」

Claude は次の処理を行います。

1. コンテンツディレクトリをスキャンして投稿を検索
2. 生産性に関するキーワードを使って、「ニュースレター」との関連性をスコアリング
3. テンプレートから CTA HTML を生成
4. 変更内容のプレビューを表示
5. 確認を求める
6. 一致する投稿に CTA を挿入
7. 結果を報告