アフィリエイトリンクをボタン化する方法。無料ツールまとめホームアフィリエイトの基礎知識アフィリエイトリンクをボタン化する方法。2016.01.30以前コメントで質問があったので、今回は「アフィリエイトリンクをボタン化する方法。2つ横並びボタンのやり方も紹介」を解説してみたいと思います。注意点もあるので、一緒に解説していきます。アフィリエイトリンクでなくて普通のリンクもボタンにする事は可能です。Amazonや楽天のアフィリエイトは「もしもアフィリエイト経由」がおすすめの理由Amazonや楽天のアフィリエイトは認知度も高いので初心者におすすめのアフィリエイトです。一般的なアフィリエイトサイトでよく見かける「公式サイトへ」みたいなボタンですね。ボタンの画像を用意して作成する方法と、CSSで作っちゃうパターンがあるんですが、今回作成するのはこのCSSのボタンです。アフィリエイトリンクを以下のようにボタン化する事が可能です。公式サイトはこちらもしくは2つ横並びとか(スマホでは縦2列)。詳細を見る公式サイトはこちらこんな感じでリンクをボタン化できます。一応前提でWordPress。全部ではないですが、ほとんどの無料ブログでも多分できるかなと思います。スタイルシートでボタン作成まずはスタイルシート(CSS)へ次の記述を追加します。スタイルシートは下に書いた物が優先的に反映されますので、一番下に追加でOKです。背景色や文字の色、太さなどちょっとした事でクリック率も違ってくるのでカラーや文字色、文字の大きさなどはお好みで変更してみて下さい。15px;}}数カ所「!important」というのを付けている部分があります。これを付けるとその記述が優先的に反映されますので、後で確認した時に反映されない部分がある場合にはその部分の記述に「!important」を付けてみて下さい。上記スタイルシートを追加できたら保存します。これで準備はOKです。記事投稿画面でボタンを呼び出すスタイルシートの記述が保存できたら今度は記事を書く画面(投稿画面)で記事を書いていきます。アフィリエイトリンクのボタン化したい部分に次の記述をします。class="red-btn">ココにテキストリンク</div>※ボタン内のテキスト部分はリンクにして下さい。class="right-btn">リンク2</div></div>※ボタン内のテキスト部分はリンクにして下さい。コードが面倒なのでWordPressならプラグイン「AddQuicktag」で1つボタン、2つボタンのコードをそれぞれ登録しておけば投稿画面ですぐに呼び出せます。今回CSSで作るボタンを紹介しましたが今回のやり方だとボタン内はリンクにしてないと装飾されませんのでボタン内のテキストは必ずリンクにして下さい。画像のボタンと違ってCSSで作成したボタンはボタン内の文字(テキスト)を自由に変更できます。CSSで作成したボタンはボタン内のテキストが長くなると2列になります。2列になるとその分ボタンも分厚くなるので注意です(特にスマホページ)。↑こんな感じでテキストが長いと2列になってボタンが厚くなります。以上アフィリエイトリンクをボタン化する方法。2つ横並びボタンのやり方も紹介でした!↓私がメインで利用しているASPはこちら↓アフィリエイトのASPとは?初心者におすすめのアフィリエイトASPと選び方アフィリエイトを始めるにあたって必要になるのが広告なんですが、その広告を扱うためにはASPへの無料会員登録が必要になります。今回はアフィリエイトに必要な...affiliate150.com2020.02.03↓アフィリエイトで使える無料ツールはこちら↓アフィリエイト専業で8年間生き残っている私が使っている無料ツールたち今回は私がアフィリエイトのサイト作成に利用しているツールを紹介していきます。現在アフィリエイトで法人化しているのですが、個人でやっていた時も法人になって...affiliate150.com2019.12.09スポンサーリンクスポンサーリンクアフィリエイトの基礎知識シェアするTwitter9Facebook0はてブ14Pocket35LINEコピーサイトのアクセスアップや稼ぐためにおすすめの無料レポート個人的にアクセスアップや検索上位表示に役立った無料レポートです。登録にメールアドレスが必要ですが、フリーメールでもOKです。お礼の返信が遅くなりまして大変申し訳ございませんでした。この度は初心者の無礼な質問に親切・丁寧に回答をいただき本当にありがとうございます。教えていただいたとおりにいろいろ試してみましたら、ちゃんと表示されるようになりました。わからないことがでてくると思いますので、そのときには是非教えていただきたくお願い申し上げます。AMたーちゃん様コメントありがとうございます。今私も同じデザインで試してみたのですが反映されました。注意点がいくつかあります。1.トップページでは反映されないトップページ(抜粋の記事一覧)が表示されるページでは記事中の装飾(CSS)が反映されません(見た目がテキストリンクのまま)。個別ページであれば反映されていると思います。2.設定によっては余計な改行が入るEnterで改行という設定にしていると余計な改行が入ってボタンの上に余計な余白ができます。これは見た目はボタンですが余計な余白が入ります。divから/divまでをEnterの改行なしでつなげると余計なスペースが入りません。3.ブラウザにキャッシュ(以前のデータが残っている)これはありがちなんですが、ブラウザに以前のデータが残っててCSSが反映されない場合があります。その時はブログを表示させてリロード。一度コードを削除して保存し、再度追加して保存。別のブラウザで反映されていないか確認をしてみて下さい。上記でもし解決しない場合にはお手数ですが、ブログのURLを教えてもらえると助かります。URLはコメント公開時には削除しますのでどうぞよろしくお願い致します。コメントをキャンセルメールアドレスが公開されることはありません。コメント名前メールアドレスサイト上に表示された文字を入力してください。【図解】Amazonプライム会員の友達紹介のやり方と手順。友達紹介キャンペーンは無料の会員登録でも報酬発生!Googleアドセンスの始め方。【初心者向け】WordPress(ワードプレス)でのブログの始め方と使い方まとめ!【初心者向け】CocoonでWordPressを始めるなら最低限やっておきたい設定13項目WordPressテーマ「Cocoon」を使うなら最低限入れておきたいプラグイン12選+1【図解】Cocoonのダウンロードとインストールの手順。Wing(コノハウイング)へ移転する方法と注意点まとめ【保存版】エックスサーバーのWordPress簡単移行機能の使い方と注意点まとめ【保存版】ロリポップの簡単引っ越し機能の使い方と注意点まとめ。設定方法は思っていたより簡単ですね~楽天アフィリエイトの紹介料は楽天ポイント。報酬を現金振り込みでもらう方法は2通り。博2020.02.04現在、楽天カード会員ですがゴールドカード会員に切り替えたい。【図解】楽天カードから楽天ゴールドカードに切り替えをする流れと注意点。返信ありがとうございます。シンプリシティだったんですね。質問1.試す記事は実際に投稿済みのものが良いです。下書きのものだと試せないと思います。早々にご連絡を頂きまして、ありがとうございました。スラッグの変更を試してみたのですが、うまくいきませんでした。コメントありがとうございます。サイトもサボっておりまして、すっかり情報も古くなってきてます、すみません。検索トップタイトルとURLをコピーしました。