Amazon、楽天、Yahooの商品リンクを簡単に記事に挿入できるプラグイン「Rinker」を使っている際に、記事ごとに表示するボタンをAmzonだけとかにしたいときの方法について覚書。
必要なプラグイン
表示したくないボタンをCSSでコントロールするので、まずは記事ごとにCSSを設定できるプラグインをインストールする必要があります。
その手のプラグインはいくつかありますが、とりあえず私は「Simple CSS」を使っています。
Simple CSS
Add CSS to your website through an admin editor, the Customizer or a metabox for page/post specific CSS.
「Simple CSS」でなくても構いません。
「Simple CSS」をインストールして有効化すると、記事の編集画面に以下のような「Simple CSS」という新しいボックスが表示されるようになるので、ここにCSSを記載します。
「Simple CSS」ボックスに記載したCSSは、その記事だけで有効になります。
ボタンを非表示にするCSS
ボタンを非表示にするCSSですが、「しょたすてーしょんさん」のサイトに詳細が記載されています。
Rinkerの特定のサイトリンクだけをCSSで非表示にする方法
特定のサイトのセール情報をඤ ...
詳細はそちらを見ていただければよいかと。
ただ、「しょたすてーしょんさん」の記事がなくなったりしたら困るので、控えで記載しておきます。
あくまで元は「しょたすてーしょんさん」の記事です。
以下に記載した非表示にしたいボタンのCSSを「Simple CSS」ボックスに記載すればOKです。
Amazonボタンを非表示
div.yyi-rinker-contents div.yyi-rinker-box ul.yyi-rinker-links li.amazonlink{
display: none;
}
楽天ボタンを非表示
div.yyi-rinker-contents div.yyi-rinker-box ul.yyi-rinker-links li.rakutenlink{
display: none;
}
Yahooショッピングボタンを非表示
div.yyi-rinker-contents div.yyi-rinker-box ul.yyi-rinker-links li.yahoolink{
display: none;
}
補足
一つの記事にRinkerで複数の商品リンクを貼っていたとして、そのそれぞれの商品リンクに表示するボタンの表示/非表示をコントロールすることはできないです。
例えば、Amazonボタンだけを表示するようにした場合、他の商品リンクも全部Amazonボタンだけになってしまいます。
コメント