このページでは、ブログ投稿に共有ボタンを追加する方法をご紹介します。共有ボタンを追加すると、読者がコンテンツを Twitter、Facebook、Tumblr、LinkedIn などさまざまなサービスで簡単に共有できるため、メッセージをネットで広められるようになります。
一般的な機能とよくある質問については、情報ページをご覧ください。
![](https://cdn.statically.io/img/jetpackme.files.wordpress.com/2021/08/jetpack-sharing-buttons-example.png?w=1024)
読者は共有機能を使い、投稿やページの一番下からコンテンツを自分のネットワークに投稿できます。各サービスをアイコンかテキスト、またはその両方として表示されるよう設定できます。一部のサービスでは、投稿の共有回数も表示されます。表示される回数はサービスからのレポートに基づきます。
共有ボタンを有効にする
![](https://cdn.statically.io/img/jetpackme.files.wordpress.com/2021/08/jetpack-sharing-buttons-activate-feature.png?w=1024)
共有ボタンを有効にするには、次の手順を実行します。
- WP 管理画面で、「Jetpack」→「設定」→「共有」の順に移動します。
- 「共有ボタン」の「投稿とページに共有ボタンを追加」オプションを有効にします。
共有ボタンを追加・設定する
共有機能が有効になると、4つの簡単なステップに従うだけで共有ボタンをサイトに追加できます。
- サイトの WP 管理画面
* の「設定」→「共有」に移動するか、以下の URL をドメインの横に貼り付けます。
yoursite.com/wp-admin/options-general.php?page=sharing
- 「共有ボタン」の「有効化済みのサービス」エリアに、使用したいサービスを任意の順にドラッグ & ドロップします。また、サービスを「有効化済みのサービス」エリアのボックスにドラッグすると、サービスを共有ボタンの後ろに隠すこともできます。
- お好みのボタンのスタイルと、ボタンを表示する場所を選択します。
- 「変更を保存」をクリックします。
*「共有ボタン」は、WordPress.com の「ツール」→「マーケティング」→「共有ボタン」でも管理できます。
他のサービスも、「有効化済みのサービス」エリアにボタンをドラッグするだけでいつでも追加できます。
共有ボタンのオプション
共有ボタンには、カスタマイズできるオプションが複数あります。
- ボタンのスタイル: ボタンの表示方法を、「アイコンとテキスト」、「アイコンのみ」、「テキストのみ」、サービスの公式の共有ボタンから選択できます。
- 共有ラベル: 共有ボタンの上に表示するメッセージをカスタマイズできます。
- ボタン表示: 共有ボタンの表示場所を、「フロントページ、アーカイブページ、検索結果ページ」、「投稿」、「ページ」、「メディア」から選択できます (複数可)。
- Twitter サイトタグ: このフィールドに Twitter ユーザー名を追加すると、共有されたツイートの最後にカスタムメッセージ「@TwitterUsername さんから」が追加されます。
- CSS と JavaScript を無効化: 高度な設定です。このオプションがチェックされている場合、共有リンクを動作させるためにはテーマに手動でこれらのファイルを追加する必要があります。
共有機能を使用できるサービス
現在、次のサービスをサポートしています。
- メール *
- 印刷
- Skype
- Telegram
- Tumblr
* 注意: メール���有は、Akismet のスパムフィルタリングプラグインを使用してスパム行為を防止している場合、または functions.php ファイルまたは機能プラグインに以下を追加し、メール共有を明���的に有効にしている場合のみ利用できます。
add_filter( 'sharing_services_email', '__return_true' );
トラブルシューティング
ボタンに共有や「いいね」の回数が表示されない
すべてのサービスで共有数を表示できるわけではありません。Twitter は共有数を表示しません。Facebook は Facebook での共有数、「いいね」の数、コメント数の合計を共有します。
共有数は特定のサービスの「公式ボタン」にのみ表示されます。共有数が表示されない場合は、「ボタンのスタイル」ドロップダウンから公式ボタンを選択してみてください。Pinterest の「ピン」ボタンは、「公式ボタン」スタイルを使用している場合のみ画像に表示されます。
共有ボタンが表示されない
「設定」→「共有」の「共有設定」で、共有ボタンを表示したい投稿タイプの共有ボタンが有効になっているか確認してください。
![](https://cdn.statically.io/img/jetpackme.files.wordpress.com/2019/05/sharing-settings.png)
共有数がゼロにリセットされてしまった
公式共有ボタンで表示される合計数は、Facebook、Twitter など当該のサービスがレポートした数字です。各サービスは合計数を計算する際に、投稿が共有された当初の正確な URL を使用します。
サイトの URL が何らかの理由で変更されると (http から https に変更した場合やパーマリンク構造を変更した場合など)、投稿の正確な URL も変わるため、カウント数がゼロにリセットされます。
また、カウント数のデータは WordPress.com や Jetpack ではなく、各サービスが管理しています。WordPress.com や Jetpack は、合計数の合算や更新を行えません。
WordPress.com のダッシュボードに「共有」セクションが表示されない
「共有」が有効になっている場合、WordPress.com のダッシュボードの「ツール」→「マーケティング」に「共有ボタン」セクションが表示されます。表示されていない場合は、こちらのガイドに従い、共有機能が無効になっていないことを確認してください。
Google+ と共有できない
Google+ は共有ボタンの対象外となりました。サイトに Google+ ボタンを追加したことがない場合、Google+ ボタンを追加するオプションは今後表示されません。「設定」 > 「共有」に Google+ のオプションは表示されません。
過去に Google+ ボタンをサイトに追加したことがある場合、管理者アカウントにログインすると新しいボタンが代わりに表示されます。このボタンは、サポート対象から外れた Google+ をサイトから削除するためのものです。サイトの読者には何も表示されません。
![](https://cdn.statically.io/img/jetpackme.files.wordpress.com/2013/11/gplusremoved.png?w=788)
他にご不明な点がある場合は、お気軽にお問い合わせください。
カスタマイズ
カスタム共有ボタンを作成する
- ダッシュボードで「設定」→「共有」に移動します。
- 「利用可能なサービス」セクションの「新サービスを追加」リンクをクリックします。
![](https://cdn.statically.io/img/jetpackme.files.wordpress.com/2013/11/add-new-services.png?w=788)
- 共有サービスで使用する「サービス名」を入力します。入力したサービス名は、サービスへのリンクとブログ共有統計情報に表示されます。
- 「共有 URL」を入力します。これは、共有サービスの URL アドレスです。URL には、変数
%post_title%
%post_url%
(短縮 URL)、%post_full_url%
、%post_excerpt%
を使用できます (例:http://www.google.com/buzz/post?url=%post_url%)。 - 「アイコン URL」を入力します。これは、このサービスで表示するアイコン画像の URL アドレスです (例: https://www.someserver.com/images/buzz.png)。ただし、入力したリンクから画像をオンラインで利用できる必要があります。
- 「共有ボタンを作成」ボタンをクリックします。
- 新しいサービスが「利用可能なサービス」セクションに表示されます。これで、サービスを「有効化済みのサービス」セクションに追加してサイトで使用できるようになりました。
共有サービスをカスタマイズする際に、「ライブプレビュー」セクションでサービスの表示順序を確認できます。
メール共有ボタンに Captcha を追加する
メールボタンだけでも便利ですが、送信フォームに Captcha を追加することでさらに機能を向上できます。
![](https://cdn.statically.io/img/jetpackme.files.wordpress.com/2013/04/screen-shot-2018-03-19-at-4-56-06-pm.png)
Captcha をサイトに追加するには、次の手順を実行します。
- こちらのサイトでアカウントを登録します。登録が完了すると、公開鍵と秘密鍵が届きます。
- お好みのテキストエディターで、サイトの
wp-config.php
ファイルを開きます。次の定数に reCaptcha キーを両方入力し、/ * That's all, stop editing! Happy blogging. */
の直前に追加します。define( 'RECAPTCHA_PUBLIC_KEY', 'XXXXXXX' ); define( 'RECAPTCHA_PRIVATE_KEY', 'XXXXXXX' );
wp-config.php
ファイルを保存してサイトを更新します。
これで完了です。メール共有ボタンがスパムから保護されました。
共有アイコンの表示位置を変更する
デフォルトでは、共有アイコンは投稿コンテンツの一番下に表示されますが、コンテンツの直前など、投稿の別の位置に移動させることもできます。
共有アイコンを移動するには、functions.php ファイルに次のコードを追加します。
function jptweak_remove_share() { remove_filter( 'the_content', 'sharing_display', 19 ); remove_filter( 'the_excerpt', 'sharing_display', 19 ); if ( class_exists( 'Jetpack_Likes' ) ) { remove_filter( 'the_content', array( Jetpack_Likes::init(), 'post_likes' ), 30, 1 ); } } add_action( 'loop_start', 'jptweak_remove_share' );
次に、共有アイコンを表示する場所のファイルを探します。共有ボタンまたは「いいね」ボタンを表示するエリアに、次のコードを挿入します。
if ( function_exists( 'sharing_display' ) ) { sharing_display( '', true ); } if ( class_exists( 'Jetpack_Likes' ) ) { $custom_likes = new Jetpack_Likes; echo $custom_likes->post_likes( '' ); } add_action( 'loop_start', 'jptweak_remove_share' );
注意: 上記のコードはあくまでも参考情報です。Jetpack では、カスタムコードの実装や編集に関するサポートは提供していません。
共有ボタンをモバイルで非表示にする
次のコードを functions.php ファイルに挿入します。
// モバイルかどうか��確認する function jetpack_developer_is_mobile() { // Are Jetpack Mobile functions available? if ( ! function_exists( 'jetpack_is_mobile' ) ) { return false; } // モバイルのテーマは表示されているか ? if ( isset( $_COOKIE['akm_mobile'] ) && $_COOKIE['akm_mobile'] == 'false' ) { return false; } return jetpack_is_mobile(); } // モバイルには共有ボタンを非表示にする function jetpack_developer_maybe_add_filter() { // On mobile? if ( jetpack_developer_is_mobile() ) { add_filter( 'sharing_show', '__return_false' ); } } add_action( 'wp_head', 'jetpack_developer_maybe_add_filter' ); add_action( 'loop_start', 'jptweak_remove_share' );
Jetpack のデフォルトの共有機能向け CSS ファイルや JS ファイルの代わりに、独自のリソースを使う
共有機能には、上級者向けのオプションが用意されています。このオプションを使用すると、Jetpack がデフォルトで追加したファイルではなく、独自の Javascript ファイルや CSS ファイルを使用できます。
まずダッシュボードで「設定」→「共有」に移動し、ページの一番下の「高度な設定です」チェックボックスにチェックマークを入れます。
次に、機能プラグインまたはテーマの functions.php ファイルに次のコードを追加すると、独自のライブラリを追加できるようになります。
function tweakjp_add_sharing_js() { wp_enqueue_script( 'sharing-js', WP_SHARING_PLUGIN_URL . 'sharing.js', array( ), 4 ); $sharing_js_options = array( 'lang' => get_base_recaptcha_lang_code(), 'counts' => apply_filters( 'jetpack_sharing_counts', true ) ); wp_localize_script( 'sharing-js', 'sharing_js_options', $sharing_js_options ); } add_action( 'wp_enqueue_scripts', 'tweakjp_add_sharing_js' ); function tweakjp_add_sharing_css() { wp_enqueue_style( 'sharing', WP_SHARING_PLUGIN_URL. 'sharing.css', false, JETPACK__VERSION ); } add_action( 'wp_enqueue_scripts', 'tweakjp_add_sharing_css' );
Twitter ボタンで送信されたツイートに「@username さんから」を追加する
ツイートの最後に Twitter アカウントを追加する方法は2つあります。
- 「設定」→「共有」の「Twitter サイトタグ」オプションに入力します。
- パブリサイズ機能を使っていて Twitter アカウントと連携している場合は、このアカウントが Twitter 共有ボタンにも使用されます。
プライバシーに関する情報
この機能はデフォルトでは無効になっています。ダッシュボードの「Jetpack」→「設定」→「共有」に移動し、「共有ボタン」セクションの「投稿とページに共有ボタンを追加」設定を切り替えることで、いつでも有効にできます。
サイトのデータ使用に関する詳細情報
使用されるデータ | |
---|---|
サイト所有者 / ユーザー
「共有」設定に Twitter ユーザー名を追加すると、コンテンツを共有しているツイートに掲載されます。投稿タイトルとパーマリンクも当該のサービスで共有されます。また、サイトで Akismet が有効になっている場合、訪問者が投稿をメールで共有しようとすると、スパムチェックのため、サイトのホームページ URL と投稿のパーマリンクが API コールで Akismet に送信されます。なお、アクティビティをトラッキングするため、次の情報も送信されます (詳細については以下を参照): IP アドレス、WordPress.com ユーザー ID、WordPress.com ユーザー名、WordPress.com に接続されるサイトの ID と URL、Jetpack バージョン、ユーザーエージェント、訪問先の URL、参照元 URL、イベントのタイムスタンプ、ブラウザー言語、国コード。 |
サイト訪問者
サイトで公式共有ボタンが有効になっている場合、各ボタンでサービスからコンテンツを直接読み込むことで、ボタンのほかに共有する側向けの情報やツールを表示します。これにより、各サービスは共有する側についての情報を収集できます。サイトで Facebook または Pinterest の非公式の共有ボタンが有効になっている場合、共有数をボタン横に表示するため、各サービスはページ URL のほか、共有する側の IP アドレスを入手できます。 コンテンツをメールで共有する場合 (このオプションは Akismet がサイトで有効な場合のみ利用可能) に使用される情報は、共有する側の名前およびメールアドレス (ユーザーがログインしている場合、この情報はアカウントから直接取得されます)、IP アドレス (スパムチェック用)、ユーザーエージェント (スパムチェック��)、メールの本文とコンテンツです。このコンテンツは、スパムチェックを行うため Akismet (Automattic 提供) に送信されます。また、サイト所有者が reCAPTCHA (Google 提供) を有効にしている場合、共有する側の IP アドレスが reCAPTCHA と共有されます。Google のプライバシーポリシーはこちらからご確認いただけます。 |
トラッキングされるアクティビティ | |
サイト所有者 / ユーザー
機能がいつ、どのユーザーによって有効化および無効化されたかをトラッキングします。どの構成設定がいつ (およびどのユーザーによって) 変更されたかもトラッキングします。 |
サイト訪問者
メール共有は Akismet (Automattic 提供) に送信され、記録されます。Akismet に送信される具体的なデータについては、上記を参照してください。 |
同期対象データ (詳細) | |
サイト所有者 / ユーザー
機能が有効になっているかどうか、その機能の設定がどのように構成されているかを識別するオプションを同期します。 |
サイト訪問者
なし。 |