PR

プラグイン不要!テーマ機能を使ったシェアボタン実装

プラグイン不要!テーマ機能を使ったシェアボタン実装【初心者向け】のサムネイル画像 SEO対策・集客の初歩

はじめに

「ブログ記事にシェアボタンを付けたいけど、プラグインはできるだけ使いたくない…」と悩んでいませんか?

本記事では、WordPress初心者でも簡単に実装できるシェアボタンの設置方法をランキング形式でご紹介します。

プラグイン不要で、テーマ機能を活用することでサイトの表示速度を維持しつつ、SNS共有機能を追加できます。

これにより、読者が簡単に記事をシェアでき、集客アップが期待できます。


シェアボタン実装方法ランキング【5選】

1️⃣ テーマカスタマイザーを使う

特徴: 多くのWordPressテーマに標準搭載。
メリット: コード不要で初心者向け。
デメリット: テーマによって対応SNSが限られる。
➡️ やり方:

  1. WordPress管理画面で「外観」→「カスタマイズ」を選択。
  2. 「SNS設定」または「シェアボタン設定」から有効化。
  3. 表示位置(記事上部・下部など)を選んで保存。
    ポイント: テーマのアップデートで設定が初期化される場合があるので注意しましょう。

2️⃣ functions.phpにコード追加

特徴: 柔軟なカスタマイズが可能。
メリット: ボタンのデザインや表示位置を自由に変更できる。
デメリット: コード編集のミスでサイトが表示されなくなるリスクがある。
➡️ やり方:

  1. 子テーマのfunctions.phpを開く。
  2. 以下のようなコードを追加:
function add_share_buttons() {
  echo '<div class="share-buttons">';
  echo '<a href="https://twitter.com/share" target="_blank" rel="noopener noreferrer">Twitter</a>';
  echo '<a href="https://www.facebook.com/sharer/sharer.php" target="_blank" rel="noopener noreferrer">Facebook</a>';
  echo '</div>';
}
add_action('the_content', 'add_share_buttons');
  1. 必要に応じてCSSでボタンのデザインを調整。
    ポイント: コード追加前に必ずバックアップを取りましょう。

3️⃣ ウィジェットを利用

特徴: サイドバーやフッターに簡単追加。
メリット: コード不要で直感的に操作可能。
デメリット: 記事内に直接表示できない。
➡️ やり方:

  1. WordPress管理画面で「外観」→「ウィジェット」へ移動。
  2. 「カスタムHTML」ウィジェットをサイドバーまたはフッターに追加。
  3. SNS共有用のHTMLコードを貼り付けて保存。
    ポイント: グローバルナビゲーションとして活用可能。

4️⃣ カスタムHTMLブロックで埋め込み

特徴: 特定の記事に個別でシェアボタンを設置できる。
メリット: 記事ごとにカスタマイズ可能。
デメリット: 毎回手動で挿入する手間がかかる。
➡️ やり方:

  1. 投稿作成画面で「ブロック追加」ボタンをクリック。
  2. 「カスタムHTML」ブロックを選択し、以下のコードを貼り付け。
<div class="share-buttons">
  <a href="https://twitter.com/share" target="_blank" rel="noopener noreferrer">Twitterでシェア</a>
  <a href="https://www.facebook.com/sharer/sharer.php" target="_blank" rel="noopener noreferrer">Facebookでシェア</a>
</div>
  1. プレビューで確認し、問題なければ公開。
    ポイント: 特別なキャンペーンや重要な記事に適しています。

5️⃣ 子テーマで実装

特徴: 長期的な運用に適した方法。
メリット: 親テーマのアップデートで変更が消えない。
デメリット: 初心者にはややハードルが高い。
➡️ やり方:

  1. 子テーマを作成する(すでにある場合はスキップ)。
  2. template-parts フォルダに share-buttons.php ファイルを作成。
  3. 以下のコードを記述:
<div class="share-buttons">
  <a href="https://twitter.com/share" target="_blank" rel="noopener noreferrer">Twitter</a>
  <a href="https://www.facebook.com/sharer/sharer.php" target="_blank" rel="noopener noreferrer">Facebook</a>
</div>
  1. single.php で以下のように呼び出し:
<?php get_template_part('template-parts/share-buttons'); ?>

ポイント: 子テーマを有効にした後、表示確認を忘れずに。


まとめ

プラグインを使わずにWordPressでシェアボタンを設置する方法は、初心者向けの「テーマカスタマイザー」から中級者向けの「functions.phpへのコード追加」「子テーマでの実装」まで多岐にわたります。

最初は簡単な方法から試し、必要に応じて他の方法にステップアップするのがオススメです。

シェアボタンを設置することで、読者が気軽に記事を共有でき、ブログのアクセスアップに繋がります!

コメント

タイトルとURLをコピーしました