Skip to main content

Amazon リンクを作成する → Bookmarklet を使う

やりたいこと​

  • react / docusaurus で自分用 Amazon リンク作成用のタグを作った
    • 👍️
  • しかし、それすら毎回コピペするのがめんどくさい
    • 🙆 たぶんエンジニアとして正しい姿勢
  • Chrome プラグインなどで良いものないか？ または作るべき？
    • 🙅 このケースはそこまでする必要なかった

答え​

  • Bookmarklet を作ればよい

手順​

1. 以下を「Amazonリンク作成」などの名前でブックマークに登録 (初回のみ)​

js
javascript:(function(){
  const asin = location.pathname.match(/\/dp\/([A-Z0-9]{10})/)[1];
  const title = document.title.replace(/（.+?）/, '').replace(/:.*$/, '').trim();
  const md = `<AmazonLink product="${asin}" title="${title}" type="gear" />`;
  navigator.clipboard.writeText(md).then(() => alert('コピーしました:\n' + md));
})();

2. Amazon で商品リンクを開いた状態で、登録したブックマーク(「Amazonリンク作成」)を選択​

→ 「コピーしました」とダイアログが出れば OK

3. 以下のような タグがコピーされるので、サイトに貼り付け​

html
<AmazonLink product="B0XXXXXX" title="Amazon | 〇〇商品" type="gear" />

↓

🙆 なんて簡単・・・！

Last updated on