【Coccon】カテゴリー系のアーカイブページにAmazonと楽天市場のアフィリエイトリンクを表示してみた
WordPressテーマ「Cocoon」のカテゴリーページにAmazonと楽天市場のアフィリエイトリンクを設置した作業メモです。
Cocoonでは記事一覧が表示されるカテゴリーやタグといったアーカイブページには、記事ページへのリンクのみ設定されています。標準では外部サイトへのリンクを付ける機能はありません。
アフィリエイトブログを運営している場合、いかにアフィリエイトリンクをクリックしてもらうかは重要な課題ですよね？
記事を読んで離脱するブログ訪問者とは違い、わざわざカテゴリーページに移動してくれるブログ訪問者は期待感を持ってブログに滞在しています。
＜期待感＞
欲しい商品が見つかりそうな気がする。
この人のブログをもっと読みたい。
この人のおススメする商品が気になる
ここで今回のカスタマイズの出番です。
ブログ訪問者が記事ページに移動しなくてもアフィエイトリンクをクリックできるボタンを用意しブログの売り上げアップを狙うという仕組みです。
サンプルサイト
今回のカスタマイズを実装したサンプルサイトです↓
絞り込み検索機能のあるアフィリエイトサイトを作っている時に、「直接Amazonのリンク置いたほうが便利だよな？」と思い、今回カスタマイズしてみました。
サンプルサイトの構成
【バージョン】
WordPress：6.2.1
Cocoon：2.6.0.3
Advanced Custom Fieldsプラグイン：6.1.6
WordPress、テーマともに記事執筆時に利用可能な最新バージョンです。
【Anazonと楽天のアフィリエイトリンク】
アーカイブページのアフィリエイトリンクは、商品ページに設定したカスタムフィールドを表示する仕様です↓
ブログ運営時には商品ページごとに個別のアフィリエイトリンクを入力するというシンプルな運用です。
【カスタムフィールドの設定】
無料プラグインのAdvanced Custom Fieldsを利用しています。プラグインの管理ページからカスタムフィールドを２つ作成しています↓
アマゾン：amazon
楽天：rakuten
【表示設定】
下記画像の通り、トップページと投稿一覧ページに固定ページを指定しています↓
【Cocoon設定：インデックス】
下記画像の通り、カードタイプで「縦型カード2列」を選択しています↓
カスタマイズの概要
対象のPHPテンプレートを直接編集しないカスタマイズです。
テンプレートを編集してしまうと、Cocoonのテーマアップデート時に面倒なことが多いので直接テンプレートに手を加えることはしません。
子テーマも不要です（子テーマ化してあっても構いません）。
以下、どちらでも今回のカスタマイズは対応しています。
Code Snippetsなどのコード管理系プラグインを利用する
子テーマのfunctions.phpにコードを追加する
子テーマにファイルを移したりするのが面倒なので、サンプルサイトではCode Snippetsプラグインを使ったカスタマイズです。
更新履歴
2023年6月 記事公開
ここから先は
¥ 9,890
この記事が気に入ったらサポートをしてみませんか？