こんにちは！ふるのーと（fullnote）です！(*^^*)
本日はワードプレスでブログを運営していて、Cocoonをテーマとして使っている音楽ブロガーさん向けのカスタマイズをご紹介します。
Cocoonについてはこちらもどうぞ
⇒【爆速】WordPressテーマをSimplicity⇒Cocoonに移行したのでレビュー！
Cocoonの商品リンクボタン
Cocoonには、Amazonや楽天、YahooショッピングといったECサイトで販売されている商品を対象としてアフィリエイトリンクを自動生成する機能が標準でついています。
当初Cocoonにはこの機能はなかったのですが、のちにプラグイン不要で利用できる機能が実装されました。
似たような機能にRinkerというプラグインがありますね。
⇒【報告】Cocoonにカエレバ代替Rinkerプラグインを導入してみたよ！
Cocoonの商品リンクボタンの設定と使い方法
Cocoonの商品リンクボタンを利用するには初期設定が必要になります。
詳しくは公式サイトを参考にしてください。
⇒Amazon商品リンクの初期設定方法と使い方
もしもアフィリエイトに登録したり、Cocoon設定画面でそのidを入力したりします。
Cocoonの商品リンクボタンの使い方も、ここでは詳しくは説明しませんが、ブックマークレットというおすすめの方法があるので是非一度利用してみてください。
⇒Amazon商品リンクブックマークレットの使い方
このブックマークレットという方法を使うとワンクリックで以下のようなショートコードが作成できます。
[amazon asin="B000CZ0R42" kw="SHURE ダイナミックマイク SM58 スイッチ無し SM58-LCE 【国内正規品】"]
あとはコレを投稿画面にコピペすれば以下のような商品リンクが作成できます。
サウンドハウスなどのAmazon・楽天以外の商品リンクボタンの追加したい
さて、今回の本題ですが、音楽ブログを行っていると、楽器の紹介が多くなってくると思います。
そうなるとサウンドハウスのリンクも追加しておきたくなりますよね。
ただし、普通にショートコードを貼るだけでは、サウンドハウスのリンクは生成できません。
ボタンを追加したかったので、Cocoonのフォーラムで要望を出したところ、「すでにカスタマイズ機能はあるぞ！」と怒られました（；^ω^）
さすがわいひらさんですね。
こちらのページの一番下に詳しく載っていました。
⇒Amazon商品リンクショートコードの使い方。サンプルコード満載で解説。
要はショートコードの最後に「 btn2_url=”リンクURL” btn2_text=”サウンドハウス” 」と追加すればOKです。
なお、btn1は先頭にボタンが設置され、btn2とすると最後尾にボタンが設置されるようになります。
でも私はCocoonサイトのマニュアルを見て思ったんですよね。
サウンドハウスのボタンは紫にしたい。。
btn1は紺色だし、btn2は緑色なんですよね。
裏メニュー？紫色のbtn3が存在した。。。
どうせサウンドハウスのリンクボタン作るなら紫のボタン作りたいじゃないですか。
そう思ったら、公式サイトのマニュアルには載っていないbtn3というオプションが存在しました。
先程と同様にショートコードの最後に「 btn3_url=”リンクURL” btn3_text=”サウンドハウス” 」または「btn3_tag=’アフィリンクタグ’」と追記するだけで紫色のボタンが生成されます。
まじかー！わいひらさんすごすぎやろー！
ちなみに生成したリンク表示はこちら↓
ショートコードはこちら↓
[amazon asin="B000UPEJCU" kw="SONY 密閉型スタジオモニターヘッドホン MDR-CD900ST" btn3_tag='<a href="http://h.accesstrade.net/sp/cc?rk=01001xqc00hsxk&url=https%3A%2F%2Fwww.soundhouse.co.jp%2Fproducts%2Fdetail%2Fitem%2F71265%2F" rel="nofollow" target="_blank">サウンドハウス<img src="http://h.accesstrade.net/sp/rr?rk=01001xqc00hsxk" width="1" height="1" border="0" alt="" /></a>']
cssでリンクボタンの色は変えられる
今回、btn3が存在したので紫はそちらを使うことができます。
ただ、他の色を使いたいときはどうしたらよいか？
そんなときはcssをいじると色を変えることができます。
ただし、全部変わってしまうので変更には十分注意しましょう。
実は商品リンクボタンの色の変更方法は前に記事にしていますのでこちらを参考にしてみてください。
⇒【カスタマイズ】Cocoonの商品リンクボタンを管理プラグインRinkerの色にしてみた
ちなみにサウンドハウスのボタンの色も少しだけ変えていて以下をcssを小テーマに追加しています。
.shoplinkbtn3 a {
background: #955F91;
}
デフォルトから少しだけ薄い紫にしています。
良かったら参考にしてみてください。
【登録必須】サウンドハウスを取り扱っているASPはアクセストレード
ちなみにサウンドハウスのアフィリエイトを扱っているのは現状アクセストレードのみとなっています。
音楽ブロガーの皆さんはこの機会に必ず登録しておきましょう。
もちろん登録無料です。
【追記】サウンドハウスの一発リンクつくるブックマークレット作ったよ。
サウンドハウスの一発リンクつくるブックマークレット作ったのでよかったらワンコインお願いします！！
内容は同じです⇒【Cocoon】サウンドハウス＆アクセストレードの商品リンク用ブックマークレットを作ったよ！
内容は同じです⇒https://note.com/fullnote/n/ncb6544245702
まとめ：音楽ブロガーはCocoonの商品リンクをカスタマイズしてサウンドハウスのリンクを追加しよう
音楽系ブロガーのみなさんはサウンドハウスのリンクを追加すると収益が増えるという説があるので是非アクセストレードに登録してリンクを追加しておきましょう。
無料でこんな機能まで提供してくれるCocoonの製作者わいひらさんには頭があがりませんね。
それでは今日はこの辺で！ ふるのーと（fullnote）でした！(*^^*)
ブログ初心者のかたは色々なツールがあるので一度以下に記載のあるようなツール類は目を通しておくと良いかもしれません。
⇒【完全版】ブロガー必見！おすすめサイト/サービスツール比較まとめ【メモ】
あくまで自分の備忘録用にメモしているだけのページですが参考になるものが見つかるかもしれません。
