Rinkerにマイクロコピーを追加する方法【Cocoon対応】

この記事は 約7 分で読めます。

今回はRinkerでマイクロコピーを追加する方法をご紹介します。

理系王子

無料のWordPressテーマ「Cocoon」にも対応していますので、CSSをコピーしてご利用ください。

Rinker：物販広告リンクを作成できるプラグイン

RInkerとは、Amazonや楽天などの物販広告リンクを簡単でカッコよく作成できるWordPressのプラグインです。

なつめ黒猫

こんな感じで商品リンクが作れるよ。

Google AdSense マネタイズの教科書[完全版]

created by Rinker

なつめ黒猫

以前はカエレバを使っていたけど、WorePressを使っている人はこっちの方が楽チンかも。

理系王子

Rinkerプラグインは他のプラグインとは違って、下記ページからダウンロードしてのインストールが必要になります。

Rinkerベーシック - rinker - BOOTH

商品管理プラグインRinkerのベーシック版です。利用規約など詳細はこちらをご確認くださいサポートについてはにて開発支援をくださった方にのみ行っています。 yyi-rinker-1.4.10.zipはtarget="_blank"を残したバージョンです。

マイクロコピーで集客アップ！

マイクロコピーとは、ボタンの文字やフォームまわり、キャプションなど、非常に細部の箇所のコピーのことです。

なつめ黒猫

例えば、こんな感じでボタンの周りや中に期間限定のお得情報を書くことを指すよ。

こまり猫

楽天スーパーセールやAmazonプライムデーなどのセール情報があると、ついついクリックしてみてみたくなっちゃうね！これならアフィリエイト収入もアップするかも！

理系王子

今回は、上で設定したAmazonタイムセール祭りのマイクロコピーを実践する方法をご紹介します。

Rinkerにマイクロコピーの適用する方法

WordPressの編集画面から、外観→CSS編集へと進み、追加CSSに下記のコードをコピーして追加で貼り付けます。

/* マイクロコピー */
div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a:before {
	position: absolute;
	display: inline-block;
	color: #ff5959;
	width: 100%;
	left: 0;
	text-align: center;
	top: -16px;
	font-weight: 600;
	line-height: 1;
	content: "＼Amazonタイムセール祭りのお知らせ／";
	font-size: 1em;
}

@media (max-width: 1239px) and (min-width: 320px){
	div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink {
		margin: 10px 0px 12px;
		height: 60px;
	}
	body div.yyi-rinker-contents ul.yyi-rinker-links li.amazonlink a {
		height: 70px;
	}
	li.amazonlink a:after{
		padding: 3px;
		border-radius: 0;
		margin-left: 0;
		border: none;
		display: block;
		line-height: 1;
		background: white;
		color: #3A4D66;
		width: 90%;
		margin: 0 auto;
		content: "Amazon タイムセール祭り中";
		bottom: 10px;
		top: auto;
		left: 0;
		box-sizing: border-box;
		text-align: center;
	}
}

理系王子

元のRinker用のCSSがある前提で、追記用のCSSとなっています。