個人のSNS活用法

SNSシェアボタンを簡単に設置！ブログやサイトに追加する方法

※注意！この記事では最初から各SNSにログインしている状態というのが前提です。

SNSのボタンには2種類あって

・タイムランやニュースフィードに投稿するタイプ

 

 

 

・facebookページやTwitterアカウントなどをフォロー(いいね)するタイプ

タイムランやニュースフィードに投稿するタイプをブログやサイトに載せたい場合は忍者おまとめがオススメ

 

 

忍者おまとめ

 

 

 

 

忍者おまとめの使い方

 

忍者おまとめで好きなデザインのボタンを選んでhtmlコードをブログやサイトにコピペするだけです。

(null)

この拡散用のボタンもまあまあ使えますがブログのアクセスアップを確実なものにするなら。

フォローボタン、facebookページいいねボタンをゲットしなくていけません！

 

 

 

このボタンがあればドンドン読者を増やす事ができるからです。

拡散ボタンは所詮一回の付き合いですが
フォローボタンはその後何回でもブログやサイトの更新情報を流す事ができます。

 

 

 

この記事で紹介するSNSのフォローボタンは

・twitter

・facebookページ

・Google+ページ（サービス終了）

・tsu(オリジナルボタン)

 

1.Twitter

Twitterにツイートするだけのボタンを紹介します。

 

まずはTwitterボタンaboutにアクセス

 

 

 

好きなボタンを選ぶ。
今回はフォローするを選ぶ。

(null)

【フォローする】にチェックを入れるとこんな画面がでる↓↓↓
(null)

ユーザー名と言語設定を変更して右にあるhtmlコードをコピーしてブログに貼れば完成。

 

 

追記：2019年現在のやり方

Twitterボタンaboutにアクセス

 

入力欄に自分のブログリンクを貼り付けて右にある【→】をクリック

 

好きなボタンのタイプを選びます。

 

 

最後にCorp CodeをクリックしてHTMLコードをコピー

コピーしたコードをブログに貼り付けて完成です。

 

 

 

 

2.facebookページ

まずはFacebook Developers「Like Box　ページプラグイン」にアクセスします。

(null)

①facebookページのURLを入力

②好みでチェックを外す、チェックを外すとタイムランなどが消えてボタンが小さくなる。

③Get Codeをクリックしてコードをコピーする。

これでfacebookページのいいねボタンを貼れば完成。

 

 

 

 

3.Google+ページ（サービス終了）

まずはGoogle+ Follow Buttonにアクセス。

(null)

これもコードをコピーして終わりです。
複数のGoogle+ページがある場合は切り替えが必要。

 

 

 

4.tsu(オリジナルボタン)サービス終了

 

まだまだ日本ではマイナーなSNS
自分のURLから登録者が増えるとお得な事が！

とは言えtsuはフォローボタンがまだないのでオリジナルボタンを作ります。

と言っても適当な画像を作ってプロフィール画面にリンクさせるだけです。

他のSNSでもできますよ。

 

 

 

はちま起稿とかハム速とかオレ的ゲーム速報なんかもこの方法でボタンを設置しています。

tsuのプロフィール画面用のURLはアプリの左にあるメニューの一番下からゲットできる、

(null)

ブログやサイトにボタンを貼って読者がガンガン増えるといいですね。

 

 

取得したHTMLコードをWordPressに貼り付ける。

HTMLのコードを取得する方法を紹介しましたが

次にWordPressへ貼り付ける方法を紹介します。

管理画面の左サイドバーにある外観をクリックします。

 

  • 外観→ウィジェット

この順番にクリック

 

サイドバーや記事下にブログパーツを挿入できる管理画面にアクセスします。

 

 

いろいろなブログパーツを追加する事ができます。

今回はテキストを選んで追加します。

 

 

好きな場所を選んでウィジェットを作成をクリック。

テキストと書かれているタブをクリックしてテキストモードにして

HTMLコードを貼り付け、保存ボタンをクリックすればシェアボタンの設置完了です。

 

ワードプレス用、SNSのシェアボタン

WordPressにSNSシェアボタンを追加する方法は、以下のように プラグインを使う方法 と 手動でコードを追加する方法 の2通りがあります。

ここでは初心者でも簡単にできる プラグインを使う方法 を中心に説明します。

✅ 方法1：プラグインを使う（初心者におすすめ）

ステップ1：プラグインをインストール

  1. WordPress管理画面にログイン
  2. 左メニューから「プラグイン」→「新規追加」
  3. 検索バーに以下のいずれかを入力：
    • Shared Counts
    • Social Warfare
    • AddToAny Share Buttons
  4. 好みのプラグインの「今すぐインストール」→「有効化」をクリック

ステップ2：SNSボタンを設定

プラグインによって異なりますが、たとえば「AddToAny」の場合：

  1. 「設定」→「AddToAny」を開く
  2. 表示させたいSNS（Twitter, Facebook, LINEなど）を選択
  3. 表示位置（記事上・下・サイドバーなど）を選択
  4. 保存して完了

方法2：テーマにコードを直接追加（中級者向け）

使用しているテーマがカスタマイズ可能な場合（例：子テーマを使っている）

  1. 外観 → テーマファイルエディター
  2. single.php または content-single.php に以下のようなHTMLコードを追加：
<div class="sns-share">
  <a href="https://twitter.com/intent/tweet?url=<?php the_permalink(); ?>&text=<?php the_title(); ?>" target="_blank">Twitterでシェア</a> |
  <a href="https://www.facebook.com/sharer/sharer.php?u=<?php the_permalink(); ?>" target="_blank">Facebookでシェア</a>
</div>

※必要に応じて LINE や Pinterest も追加可能です。

補足：表示デザインを整えたい場合

  • プラグインによってはCSSカスタマイズも可能
  • 自作コードの場合はCSSを追加して見た目を整えます
.sns-share a {
  margin-right: 10px;
  text-decoration: none;
  color: #0077cc;
}

 

まとめ

忍者おまとめボタンなどで無料ブログに追加できます。

Word Pressならプラグインで追加する事ができます。

プラグイン名特徴
Shared Counts軽量でシンプル、カスタマイズしやすい
AddToAny Share Buttons簡単設置、対応SNSが豊富
Social Warfareシェア数の表示が可能（有料機能もあり）
Sassy Social Shareデザイン豊富で初心者に優しい

 

無料ブログであってもとりあえずサイドバー設定までいって、テキストモードとかHTMLモードがあるのでそういうモードにしてから

HTMLコードを貼り付ければシェアボタンを設置する事ができますよ。

 

ではでは(^○^)ノシ

 

 

 

 

 

 

 

 

 

ブログ検索

-個人のSNS活用法
-,