サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2018-10-08 22:06
Amazonと楽天市場の商品リンクコードを利用させていただいています。
ほとんどの場合は、Amazon、楽天、Yahoo！で事足りますが、商品によっては、任意のサイトへのリンクもあって欲しいな、と思うことがあります。
Amazon、楽天、Yahoo!のようにAPIで自動でリンクを作成してくれることろまでは望んでいませんが、何とかして手動で生成したリンクボタンを横並びにすることはできないでしょうか？
Amazonボタン（商品リンク） 楽天ボタン Yahoo!ボタン 手動設定リンクの囲みボタン
と言った具合に４つのボタンが一列に表示されてくれると良いのですが、何か手は無いでしょうか？
見た目が一列になっていれば良いので、手動で設定したリンクの囲みボタンまでも商品コードで呼び出す必要は全然ありません。
素人考えで、２カラムの左側に商品リンクコード、右側に手動で設定したリンクの囲みボタン、をそれぞれ挿入してみましたが、残念ながら左右でデザインが全く揃いませんでした。
以上よろしくお願いします。
Topic starter
2018-10-08 23:56
２カラム（２：１）の左側に楽天の商品リンクコード、右側にリンクの囲みボタンを挿入してみました。
Topic starter
2018-10-08 23:59
囲いボタンが違う場所に表示されるので、４つのボタンを一列に表示させたいです。
囲いボタンだけ移動しても商品リンクコードのグレーの外枠に掛かってしまうので、可能なら外枠を消したり、広げたりできたらよいのですが。
Topic starter
2018-10-09 00:14
＞わいひら様
私の素人考えで、２カラムと囲みボタンで何とかならないかと思ってやってみましたが、商品リンクに４つめのボタンを追加したいという要望が叶えば、やり方としては何でも良いと思っています。
すごく難しいことを質問してさせていただいているように自分でも思うのですが、どうぞよろしくお願いします。
2018-10-09 20:09
カラムレイアウトを使った方法では、おそらく出来ないと思います（できる事はできるけれどかなりトリッキーなCSSを書く必要がある。逆にかなり難しい）。
やるにしても、PHPの知識と、テキスト置換の知識は必要になります。
サポート対象外のものにもあるように、高度なPHPのカスタマイズ方法は、サポート外となるのでやり方のヒントだけ書きます。
やり方の1つの手順としては、こちら。
- lib/shortcodes.phpのget_search_buttons_tag関数全体をコピーする
- 子テーマのfunctions.phpにペーストしてオーバーライドする形で関数を書き換える
もう一つはフックを使う方法があります。
- lib/shortcodes.phpのget_search_buttons_tagをフックする
- ボタンを追加する形の置換をして返り値として返す
いずれにせよPHPの知識は必要になります。
2018-10-10 09:08
カスタマイズするよりプラグイン「Rinker」使うのが無難ですね
自由ボタンが２つも作れます
直販サイトの方が多くのコミッションを得られるので
追加ボタン欲しいですよね
2018-10-10 19:55
なるほど。そういう意図か。
この記事の中盤のボタン追加みたいなやつですね。
https://affiliate150.com/how-to-use-rinker#AmazonYahoo2ASP
URLとキャプション追加だけで良いのであれば、ショートコードオプションという形で実装できるかも。
Topic starter
2018-10-10 22:23
＞かうたっくさん、わいひらさん
ありがとうございます。わいひらさんのアドバイスを元にやってみましたが、うまくはいきませんでした。
ボタン追加までは出来ました。
しかし、ショートコードのオプションに任意のリンクアドレス指定が出来る項目を追加して、ボタンのURLに指定するのは残念ながらうまくは行きませんでした。
＞サニーさん
なるほど、Rinkerならボタン追加できるのですね。やりたいことは正しくそれなので、Rinker良さそうです。
＞わいひらさん
はい、ショートコードオプションに例えば、” https://www.sony.jp ”と追加したら、ソニーのボタンが追加されるようなイメージでおりました。
リンクアドレスやボタンのインプレッションはその都度ショートコードで指定するイメージです。Amazonや楽天のようなAPIは一切使用せず、URLは毎回直打ちで問題ありません。
Rinkerのボタン追加機能がまさしくそれです。
Topic starter
2018-10-11 21:49
わいひらさま
ありがとうござます。実装されるのを楽しみに待ちたいと思います。
よろしくお願いします。
Topic starter
2018-10-11 23:10
＞わいひらさん
わいひらさんばかりに無理を言って申し訳ないと思って、色々いじってみたところ、なんとなく出来たようです。
URLをコードオプションで指定すると、自動で４つめのボタンが出現するようにしてみました。
2018-10-12 20:37
関数かフックの方法で実装されたんですね。
ただ一応、実装したものをアップしておきます。
https://github.com/yhira/cocoon/archive/master.zip
こんな感じでURLを入力すると、前後に「公式ページ」というキャプションで表示されます。
[amazon asin="B07B4CVMW3" kw="OSS ILCE-7M3K" btn1_url="https://www.sony.jp/ichigan/products/ILCE-7M3/" btn2_url="https://www.sony.jp/ichigan/products/ILCE-7M3/"]
[rakuten id="emedama:10126462" kw="ILCE-7M3K" btn1_url="https://www.sony.jp/ichigan/products/ILCE-7M3/" btn2_url="https://www.sony.jp/ichigan/products/ILCE-7M3/"]
テキストの入力すると、ボタンのキャプションとして表示されます。
[amazon asin="B07B4CVMW3" kw="OSS ILCE-7M3K" btn1_url="https://www.sony.jp/ichigan/products/ILCE-7M3/" btn1_text="ソニー公式" btn2_url="https://www.sony.jp/ichigan/products/ILCE-7M3/" btn2_text="詳細"]
[rakuten id="emedama:10126462" kw="ILCE-7M3K" btn1_url="https://www.sony.jp/ichigan/products/ILCE-7M3/" btn1_text="ソニー公式" btn2_url="https://www.sony.jp/ichigan/products/ILCE-7M3/" btn2_text="詳細"]
アフィリエイトリンクもタグを改変しないで利用できるように、タグで挿入できるようにもしました。
[amazon asin="B07B4CVMW3" kw="OSS ILCE-7M3K" btn1_tag='<a href="https://www.sony.jp/ichigan/products/ILCE-7M3/">公式ページ</a>' btn2_tag='<a href="https://www.sony.jp/ichigan/products/ILCE-7M3/">製品ページ</a>']
[rakuten id="emedama:10126462" kw="ILCE-7M3K" btn1_tag='<a href="https://www.sony.jp/ichigan/products/ILCE-7M3/">公式ページ</a>' btn2_tag='<a href="https://www.sony.jp/ichigan/products/ILCE-7M3/">製品ページ</a>']
ただし、タグで入力する場合は、オプション値を囲む場合「'（シングルコーテーション）」にする必要があります。
もしくは、タグの方の囲みを「'（シングルコーテーション）」にするか。
[amazon asin="B07B4CVMW3" kw="OSS ILCE-7M3K" btn1_tag="<a href='https://www.sony.jp/ichigan/products/ILCE-7M3/'>公式ページ</a>" btn2_tag="<a href='https://www.sony.jp/ichigan/products/ILCE-7M3/'>製品ページ</a>"]
[rakuten id="emedama:10126462" kw="ILCE-7M3K" btn1_tag="<a href='https://www.sony.jp/ichigan/products/ILCE-7M3/'>公式ページ</a>" btn2_tag="<a href='https://www.sony.jp/ichigan/products/ILCE-7M3/'>製品ページ</a>"]
Topic starter
2018-10-13 00:21
わいひらさん
ありがとうございます。早速インストールしてみましたが、残念ながら出来ませんでした。先のわいひらさんのコメント中の商品コードを全種類をそのままコピペしてみましたが、いずれも商品ボタンは追加されませんでした。
shortcord.phpを見てみたところ、”btn1_tag”や”btn2_tag”といった関数が見当たらなかったのですが、アップいただいたcocoon-master.zipファイルが実装前のバージョンという可能性はないでしょうか？
とんちんかんなことを言っていたらすみません。
あるいは私のやり方が間違っているか、、、
以上よろしくお願いします。
Topic starter
2018-10-13 00:36
shortcodes.phpでした。失礼しました。
ちなみに、アップいただいたcocoon-masterをインストール後の親テーマのバージョン:は、1.2.9.1です。
以上よろしくお願いします。
Topic starter
2018-10-13 22:40
わいひらさん
再度ダウンロードしてみたところ、無事ボタンが追加されていました。
自分でもボタン追加までは出来ましたが、タグ改変なしでアフィリエイトリンク追加は難しそうだったので、わいひらさんのバージョンを有難く使わせていただきます！
cocoonは神テーマですね。
ありがとうございました。
わいひら reacted
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。