はじめましての方はこちらをどうぞ
ブログ運営

『Rinker(リンカー)』カスタマイズ!ブログに合うデザインに変更する方法

Haru
Haru
『Rinker』を初めて使ったときは快適過ぎて、感動して泣けました

こんにちはHaru(@yurupura_haru)です。

やよいさん(@oyayoi19)が開発した商品管理プラグイン『Rinker』を使う事で、ブログの作業時間が短縮する事が出来ました!

Rinkerの必要性については、アフィリエイト初心者はこれだけ押さえよう!3つのASPと&プラグイン!にも書いた通りで”ブログを収益化したいブロガーさんにとっては最強のプラグイン”です。

Haru
Haru
でも…もっと自分のブログに馴染むデザインに変更したいんだよー!

今回は、そんな私が試行錯誤して『Rinker』のデザインを”もっと自分のブログに馴染ませるために行ったカスタマイズ”の方法についてまとめてみました!

途中にすごく長いコードが登場しますが、全てコピペで対応可能です。色やテキスト変更についても記載したので是非最後までご確認をお願いします!

わんこず
わんこず
途中でまじで超長いコードが出てくるけどびっくりしないで最後まで読むんだぞ!

Rinker(リンカー)カスタマイズ前の注意点

わんこず
わんこず
カスタマイズする前に2点確認を頼むぞ!

このカスタムは、既にRinkerを導入済で、各リンクの設定が完了している前提を過程しています。

Rinker公式HPを見る

今回のカスタマイズは、CSS部分に触れるため必ずバックアップを取ってからの作業をお願いします!

③テーマを使用している場合は『子テーマ』を編集してください!

Haru
Haru
カスタマイズは何が起きても自己責任で何卒よろしくお願いします。

コードを参考にさせていただきました☟

Rinker(リンカー)のデザインを変更する方法

下記のCSSコードをCSS編集画面に追加するだけです!

RinkerカスタマイズのBefore/Afterを掲載します。

まずは、①と②どちらかのパターンにするか決めて基本となるコードを選んでください。

Before

PC・タブレット表示☟

スマホ表示☟

After①

PC・タブレット表示☟

スマホ表示☟

基本コード

 

After②

PC・タブレット表示※ほぼ差異が無いので割愛

スマホ表示☟

基本コード

Haru
Haru
『JIN』ユーザーは=外観▷CSS編集 から設定出来るよ
わんこず
わんこず
『JIN』じゃない場合はCSS編集プラグインを使用すると安心だぞ

Rinker(リンカー)カスタマイズの詳細設定

あわせて下記の3点も変更する事が出来ます。順番に説明してゆきます。

  1. リンクボタンの色と文字色を変更
  2. リンクの表記変更(Amazonで探すの部分)
  3. 商品タイトルの変更

リンクボタンの色と文字色を変更

追加コード

 

変更したいボタンのカラーコード(#から始まる)番号を変更してください。

背景色と文字色を指定する事が出来ます。

リンクの表記変更

追加コード

 

記事内にRinkerを使ってアイテムリンクを表示させます。

そのアイテムリンクのおしりの部分にalabel=Amazonで探す rlabel=楽天市場で探す ylabel=Yahoo!ショッピングで探す と記入します。

『で探す』の部分を違う文言に変更する事が出来ます。

Haru
Haru
《7/23・更新》Yahoo!ショッピングに文字を変更したため、After①のボタン内の文字サイズを変更しました!

商品タイトルの変更

追加コード

《例》

記事内にRinkerを使ってアイテムリンクを表示させます▷

そのアイテムリンクのおしりの部分に title=▲▲▲▲] と記入します。

《例》の場合は title=iPad芸人になりたいから買う♡] となります。

title= の後に文字を記入すると強制的にタイトルを上書きする事が出来ます。

Haru
Haru
もっと変更したい方は、やよいさん(@oyayoi19)のnoteをcheck♪

まとめ

お疲れ様でした!以上でRinkerのデザイン変更は終了です。

アイテムリンクのおしりに付けるコードを毎回追加するのは大変なので、プラグインの『Addquicktag』を使うと便利ですよ。

気が付いたらブログのデザインをカスタマイズする事が大好きになってきましたw

他にもカスタマイズのリクエストがあったらtwitterからご連絡よろしくお願いします!

わんこず
わんこず
最後まで読んでくれてありがとな!ブログの更新情報はtwitterで発信しているからフォロー(@yurupura_haru)してくれたら嬉しいぞ♪
『ゆるりとぷらす+』は  こんなブログです
アラフォー主婦が模索しながら『家族と一緒に過ごすゆるい幸せ』を目指すブログです♪

Haru
Haru
素敵な40代を目指して『在宅ワークで稼ぐこと・生活を向上させること』に挑戦しています!

Haru
Haru
ジャンルはライフスタイル中心の雑記ブログです!30代、アラフォーの方に読んでいただけると嬉しいです♪

詳しいプロフィールはこちら