こんにちは、三上つかさです。当サイトは、何か月か前にAmazonアソシエイトに登録しましたが、現状まったくその機能を使っていません。もったいないかなぁと思いつつも、紹介する商品が思いつかず、放置しています。
また、当サイトのほかに、TwitterアカウントもAmazonアソシエイトに見事承認されまおりまして、Twitterでの活動もできることになっています。そちらも例のごとく使用していなかったのですが、つい先日思い立って、ついにTwitterでリンクを張ってみることにしたのです。
私は当サイトのほかに「漫画らぶ」というサイトを運営しておりまして、漫画の紹介文とともに、リンクを貼ってみました。
しかし、ここで問題が発生しました。それは、
AmazonアソシエイトのリンクがTwitterカードにならない
ということです。
あれこれ悩んだ結果、Twitterカードを表示させることに成功したので、備忘録をここに書き残しておきます。
・AmazonアソシエイトのリンクをTwitterで掲載するとき、Twitterカードが表示されない原因
・どうすればTwitterカードを表示できるか
Twitterカードとは
まずはTwitterカードとは何かを軽く説明していきます。
Twitterカードとは、リンクに応じて、サムネイルやディスクリプションを表示してくれるありがたい機能です。上述した私のサイトの場合、「All in One SEO」を使用し、カードの情報を作っています。
Twitterの表示(PCの場合)は以下のようになっています。
実際のツイートはこちら
魔法使いの嫁(11巻)-最新刊の発売日と既刊のあらすじhttps://t.co/uSKEYT0a2Z
— 漫画らぶ (@comilove_com) 2018年9月18日
Twitterでの表示は問題ありませんが、このようにサイトに埋め込むとリンクが二重に表示されることがあります。
サムネイルと概要を枠線で囲んだ部分すべてがリンクとなっており、画像とリンクを別々に貼るよりも、サイトへ流入させやすいのがTwitterカードの特徴です。
ただし、すべてのリンクに対して自動的にカードが作られるわけではなく、
<meta name=”twitter:title” content=”xxxx” />
<meta name=”twitter:description” content=”xxxx” />
<meta name=”twitter:image” content=”xxxx” />
このように、HTMLにメタタグを記載する必要があります。WordPressでは「All in One SEO」で自動的にメタタグを挿入してくれるので、それほど手間はかかりません。
では、Amazonの場合はどうでしょうか。
AmazonアソシエイトのリンクでTwitterカードを表示させる方法を説明していきます。
Amazonアソシエイトのリンクの場合
AmazonアソシエイトのリンクでTwitterカードを表示させるために、いくつかの試行錯誤を行いました。
いくつかのパターンを検証し、「これなら表示される!」というものを見つけることができました。検証結果を少し紹介します。
①短縮URLと通常URLで表示の差異はない
まず気になるのが、「短縮URLと通常URL」の違いです。いつからか忘れましたが、短縮URLを表示してくれるようになって、文字数をかなり省略できるようになりました。
「短縮URLだからTwitterカードが表示されないのか?」
と思うこともありましたが、結論から言うと、短縮URLでも通常URLでもTwitterカードは表示されます。問題を起こしているのは、短縮URLではないようです。
②リンクの形式の問題
Googleで「Amazonアソシエイト Twitterカード」と検索して上位に出てくるような記事では、
・「dp」が入っていることが必要!
・「https://www.amazon.co.jp/exec/obidos/asin/商品ID/アソシエイトID/」とすればいける!
といったことが書いてあります。たしかに「dp」が入っている方が成功率が高いかもしれませんが、2つ目のurlではうまくいきません。
表示されない原因と解決策
私が1日悩んでいろいろ試した結論は、
「運が良ければTwitterカードが現れる」です。
無責任かもしれませんが、現状、AmazonのリンクでTwitterカードを100%出す方法はありません。(あったら教えてください。お願いします)
ただ、こんな回答では納得いかないと思います。せっかく記事をつくっているのだから、なんでそんなことになっているのかという原因と、がんばってTwitterカードを表示させる方法をお教えします。
まず、なぜTwitterカードが表示されないかというと、上述したメタタグが見つからないからです。
Card validatorという、Twitterカードが正常に見えるかどうかを確かめる機能があるので、そちらで検証します。
まず、正常に表示されるURL「https://amzn.to/2xxz2H0」の場合、
INFO: 14 metatags were found
INFO: twitter:card = summary_large_image tag found
INFO: Card loaded successfully
メタタグが発見され、カード情報の読み出しに成功したという意味のLOGが表示されます。
しかし、正常に表示されないURL「https://amzn.to/2PPPzxr」の場合、
WARN: No metatags found
メタタグが発見できなかったという意味のLOGが表示されます。
どちらのリンクも同じページから、アソシエイトバーでリンクを作成しています。なのに、片方はTwitterカードが作成されて、もう一方は作成されない。残念ながら、これは運ゲーです。法則性を見つけ出そうとしましたが、無理でした。
どうやら、Amaoznのページが作成されたときにメタタグがうまく作成されない不具合があるか、Twitterがうまく読み取れないことがあるようです。これは1ユーザーがどうすることもできない範疇の問題です。ソースに直接記述があればまだ原因がわかったかもしれませんが、メタデータの直接的な記述もなく、プログラミングを少しかじった程度の私では、読み取ることはできませんでした。
「どうしてもTwitterカードを出したい」思う方は、Card validatorでURLをかたっぱしから入力していき、うまくいったものをツイートすればTwitterカードを表示させることができます。
しかし、数十回試してみてもうまくいかないものもあり、これに労力をかけるより、コンテンツにみがきをかける方がはるかに有意義な時間を過ごせると思います。ちなみに、「https://www.amazon.co.jp/dp/xxxxxxxxxx(商品ID)/」という形式のURLから作成したものが、一番成功率が高かったように感じます。
Amazonアソシエイトのお問い合わせから、この問題を報告してみたので、回答があればみなさんにシェアしたいと思います。
追記:回答が来ました!
1週間くらいかかるかと思いきや、数時間で回答が来て驚きました。おそらく、この質問の回答方法はすでにマニュアルにあるのでしょうね。
回答内容はというと、
せやからAmazonでは対応できへんのや。すまんな!
といったものでした。
今度はTwitterに聞いてみようかしら……。進展がありましたら、また追記します。