稼いでいるブログを公開します >>

AddToAny Share Buttonsの設定と使い方|WordPressにシェアボタンを実装しよう

WordPressテーマによっては、TwitterやFacebookなどのシェアボタンがないテーマも存在します。

だかと言って、使い慣れたテーマを変更するのも大変ですよね。

そこで便利なのが、WordPressにシェアボタンを簡単に実装できるAddToAny Share Buttonsプラグインです。

AddToAny Share Buttonsでは100種類以上のボタンが予め用意されていますので、自分のお好みのシェアボタンを簡単にWordPressに設置することが可能です。

このページでは、そんなAddToAny Share Buttonsの設定と使い方を見ていきましょう。

今だけ限定!!

WordPressにシェアボタンを実装しよう

AddToAny Share Buttonsを使えば、以下のようなシェアボタンが実装できます。

 

設置できるアイコンの種類も100種類以上あり、自分の好きなアイコンを好きな場所に設置できます。

 

それでは、早速WordPressにシェアボタンを設置していきましょう。

まずは、AddToAny Share Buttonsプラグインをインストール&有効化させます。

AddToAny Share Buttons

WordPressのプラグインのインストール方法|手動&FTPのやり方も解説
このページでは、WordPressのプラグインのインストール方法を紹介しています。 プラグインのインストールはWordPressを使っていく上で必須のスキルですので、是非この機会に色々なプラグインのインストール方法があることを覚えてお...

 

プラグインの有効化が完了したら、ダッシュボードのAddToAnyをクリックします。

 

標準Floatingという2つのメニューがありますので、それぞれの設定項目を見ていきましょう。

AddToAny Share Buttonsの設定/標準

アフィ
アフィ

まずは、標準の設定項目から見ていきましょう。

Icon Style

Icon Styleでは、アイコンのデザイン設定が行なえます。

  • アイコンのサイズ
  • アイコンの背景色
  • アイコンの色

を変更したい場合には、ここをカスタマイズしましょう。

Share Buttons

Share Buttonsでは、表示するアイコンの設定が行えます。

デフォルトで「Facebook」「Twitter」「メール」アイコンが表示されていますが、更にアイコンを追加したい場合にはサービスの追加/削除をクリックします。

 

100種類以上のアイコンが一覧表示されますので、この中から使用したいアイコンを選択しましょう。

 

アイコンの下にあるShow countにチェックを付けると、そのアイコンサービスでシェアされた回数が表示されるようになります。

ユニバーサルボタン

ユニバーサルボタンでは、メインのシェアボタン以外を表示するボタンデザインを変更することができます。

デフォルトだとユニバーサルボタンは青い「+」のアイコンとなっていますが、このアイコン自体を変更したい場合にはここでカスタマイズします。

 

ユニバーサルボタンをカスタマイズするにはをクリックします。

 

「+」アイコン以外のアイコンにしたい場合には、予めメディアに画像をアップロードして画像のパスを画像のURL:に入力します。

テキストリンクにしたい場合にはText only:にチェックを入れ、文言を設定します。

シェア・ヘッダー

シェア・ヘッダーは、シェアボタンの上に何かしらのタイトルを表示させたい場合に使用します。

 

ここに入力した文字がシェアボタンの上に表示されます。

例えば、入力したタイトルが表示されますと入力すれば画像のように表示されます。

ブックマークボタンの場所

ブックマークボタンの場所では、シェアボタンを設置する場所を設定します。

お好みの設置場所を指定するといいでしょう。

メニューのオプション

メニューのオプションは、ユニバーサルボタン内のアイコンをマウスホバーだけで表示するか、クリックして初めて表示するかを設定します。

メニューのオプションにチェックを付けることで、クリックしないとユニバーサルボタンのシェアボタンは表示されなくなります。

追加 JavaScript

追加 JavaScriptでは、AddToAny Share ButtonsプラグインにJavaScriptを追加する際にここにコードを記述します。

追加 CSS

追加 CSSでは、AddToAny Share ButtonsプラグインにCSSを追加する際にここにコードを記述します。

追加オプション

追加オプションでは、カスタムアイコンを使用する場合や、キャッシュの設定を行うことができます。

 


 

お好みの設定に変更できたら、変更を保存をクリックします。

変更を保存

AddToAny Share Buttonsの設定/Floating

アフィ
アフィ

次は、Floatingのタブに移ります。

ブックマークボタンの場所

ブックマークボタンの場所では、シェアボタンの位置を調整することができます。

 

例えば、左にドッキングを選択するとこのように画面の左側にシェアボタンが表示されるようになります。

 

お使いのテーマや設定によっては画像のように文字に被ることがあるので、ユーザービリティが低下しないように表示設定を行う必要があります。

レスポンシブ化

レスポンシブ化では、シェアボタンを表示する条件を指定します。

デフォルトでは980という値が設定されていますが、これは画面幅が980px以上の場合にシェアボタンを表示するという意味です。

 

0px指定にすることでどのような場合でもシェアボタンを表示することが可能となりますが、本文などのコンテンツと被りやすくなるので、ここも実際の画面を見ながら調整したほうがいいでしょう。

位置

位置では、シェアボタンの縦の位置を変更することができます。

 

縦の位置とは、画像のこの部分のことです。

オフセット

オフセットでは、シェアボタンの横の位置を変更することができます。

 

横の位置とは、画像のこの部分のことです。

アイコンサイズ

アイコンサイズでは、アイコンの大きさを調整することができます。

Background

Backgroundでは、シェアボタンの背景色を設定することができます。

 


 

お好みの設定に変更できたら、変更を保存をクリックします。

変更を保存

AddToAny Share Buttonsの使い方

AddToAny Share Buttonsプラグインは、ここまでの設定を完了させていれば自動でシェアボタンが表示されます。

WordPressの表示を確認してみてください。

指定した場所に、指定したシェアボタンが表示されているはずです。

実際に稼いでいるブログを見てみませんか?

現在、アフィが実際に収益を上げているブログメルマガ読者さんに無料で公開しています。

公開するブログは○○ジャンルの特化型ブログとなっており、記事数は30記事ほど、月間PV数はたったの50PVほどしかありません。

ですが、その特化型ブログからは毎月数万円の収益が発生しています。

アフィ
アフィ

どんなブログなのか興味がある人は、今すぐメルマガに登録してチェックしてみてください。

アフィ公式メルマガ

 

届かないというお問い合わせが増えています
『@maekawa-seo.com』のメールアドレスからメルマガを配信します。メールが届かない方は迷惑メールフォルダを確認するか、受信設定を見直してください。
アフィ

携帯ショップ店員など社会人として6年間勤務。
人に使われ続けることに疑問をもち、社会人6年目に輸入会社を設立し独立。
2017年からブログもスタートし、特化型ブログを運営。
時間にとらわれない働き方にシフトして妻との自由な時間を満喫中♪
自分の力で稼ぎ、人に雇われない働き方をしたい方はぜひ当ブログの情報を参考にしてみてください。

【仕事内容】

輸入会社経営
コンテンツ販売
ホームページ制作
ブログ収益化コンサルタント

【実績】

◯特化型ブログ◯
特化型ブログで累計収益1,000万達成

◯輸入販売◯
独立初年度から6,000万の売上達成

◯コンサル生実績(複数名)◯
月収10万円~44万円

メルマガ登録はこちら >>

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

アフィをフォローする
プラグインの使い方
アフィブログ

コメント