楽天アファリエイトの画像が表示されない！→Cocoonで簡単解決！

Cocoon

2022.02.092022.04.25

皆さんはアファリエイトを使っていますか？

私はたま～～～に使いますが、いまいち使い方がわからず、

画像が極端に小さくなってしまったり、

まったく表示されず、楽天へのリンクだけが表示される状態になっていました。

これじゃなにかわからない！

しばらく放置してしまっていましたが、時間ができたのでちょこっと調べてみたところ、

あ～ら、簡単！解決できました。

contents

事象の詳細

たとえば、これ。

実際に、皆さんに公開していた記事ですが、

左に表示するよう設定したはずの写真が表示されていません。

A8.netを利用して、リンクを作っていますが、

もちろんそちらでは写真付きで表示されています。

テキストに商品リンクコードを貼り付け、ビジュアル画面（編集画面）で見た時にも、正しく表示されています。

ですが、公開記事では見えない💦

以下記事でご紹介したように、

chromeブラウザでは画像が小さく表示されてしまうことがあるため、それが原因？！

上記でご紹介したように、CSSで画像サイズを調整することは、

商品リンクコードに手を加えてしまうことになるため、違反になってしまいます。

じゃぁどうすれば…。

カスタムHTMLにリンクを貼ることで解決できるようです。

これを使うには、ブロックエディタ（Gutenbergエディター）を使う必要がありますが、

私はいまいちブロックエディタが使いこなせず、

ビジュアルエディター形式を使っているため、このためだけに切り替えるのは面倒💦

Cocoonをテーマとしてお使いの方には当たり前の機能なんでしょうけど、

今の今まで気づいていませんでした💦

それは、Cocoonのアフィリエイトタグ管理を使う方法！

次のようにして使うことができます。

WordPress上の入力方法からご紹介します。
事前に商品コードを作成し、コピーしておいてください。

アフィリエイトタグ利用方法

Step3

必要事項を入力し、保存ボタンをクリックする。

項目	説明
①タイトル	管理画面に表示するタイトル
②内容	コピーした商品コードの貼り付け場所
③ビジュアルエディターのリストに表示	ビジュアルエディター上部のドロップダウンリスト（下部写真ご参照）に表示したい場合にチェックを入れる