Matsubo Tech Blog 
Cocoon用Amazon短縮リンク生成Chrome拡張機能を作ってみた
3行まとめ
- Cocoon テーマ用の Amazon アフィリエイトリンクを簡単に生成する Chrome 拡張機能を開発
- ワンクリックで商品 ASIN とキーワードを含むショートコードを生成
- 除外キーワード機能で、不要な文字列を自動的に削除可能
背景
WordPress の Cocoon テーマを使用している方々にとって、Amazon の商品リンクを記事に挿入するのは日常的な作業です。しかし、この作業は意外と手間がかかり、特に多くの商品リンクを扱う場合は生産性の低下につながります。
問題
従来の方法では、以下のような手順を踏む必要がありました：
- Amazon 商品ページを開く
- ASIN を確認
- 商品タイトルをコピー
- WordPress の投稿画面に戻る
- ショートコードを手動で入力
この過程は時間がかかるだけでなく、人為的ミスも発生しやすいです。
目的
この問題を解決するため、以下の目標を掲げて開発に取り組みました
- ワンクリックで Amazon アフィリエイトリンクを生成する
- Cocoon テーマの仕様に合わせたショートコードを自動生成する
- 不要なキーワードを自動的に除外する機能を実装する
アプローチ
1. Chrome拡張機能の開発
Chrome 拡張機能を開発することで、Amazon の商品ページ上で直接操作できるようにしました。これにより、ユーザーはタブの切り替えなしでリンクを生成できます。
2. ASINと商品タイトルの自動取得
JavaScript を使用して、商品ページから ASIN と商品タイトルを自動的に抽出するロジックを実装しました。これにより、手動でのコピー&ペーストの必要がなくなりました。
3. ショートコード生成ロジック
Cocoon テーマで使用される以下のフォーマットに従ってショートコードを生成します：
[amazon asin="<ASIN>" kw="<商品名>"]このショートコードを Cocoon を利用している WordPress にそのまま貼り付けると以下のように展開されます。
4. 除外キーワード機能
ユーザーが指定した除外キーワードを商品タイトルから自動的に削除する機能を実装しました。これにより、「Amazon 限定」や「送料無料」などの不要な文字列を簡単に除去できます。
5. クリップボードへの自動コピー
生成されたショートコードは自動的にクリップボードにコピーされます。ユーザーは WordPress の投稿画面に戻って直接ペーストするだけで済みます。
まとめ
この Chrome 拡張機能を使用することで、Cocoon テーマを使用している WordPress ブロガーの作業効率が大幅に向上します。特に以下の点で有用です：
- 作業時間の短縮
- 人為的ミスの削減
- 一貫性のあるリンク生成
今後も、ユーザーフィードバックを基に機能を改善・拡張していく予定です。皆さんもぜひ試してみてください！
