ハイリンクス

WordPressのプラグインやオススメツール・ソフト、その他実際に使ってみて「コレだ!」というものをご紹介

【Sharebar】ソーシャルメディアボタンがスクロール追従するWordPressプラグイン

      2014/12/07

131209_2011

Sharebarはサイトの左右や下辺りにソーシャルメディアボタンがカタマリになっていて、スクロールするとストーカーみたいにこれでもか!と付いてくるWordPressプラグインです。

基本的にはソーシャルメディアボタンは記事下にあることが一般的ですが、記事下と追従するソーシャルメディアボタンがあるとSNSで拡散する確率がかなり上がります。

スポンサーリンク

ちなみにボクのオススメのソーシャルメディアボタンの配置は、タイトル直下と記事下、そして画面左(追従タイプ)です。

1ヶ所だとクリックされる確率が少なく、2ヶ所だとちょっと心もとない、3箇所で安心する・・・という自分で勝手に思っています(笑)

使用しているWordPressテーマによっては若干SNSボタンが崩れてしまいます。上記のツイッターボタンは明らかに右側のスペースが広くなっています。どうやっても直りませんでした・・・orz

 

Sharebarのインストール

1, 管理画面「プラグイン」>「新規追加」

2, 「Sharebar」で検索

3, 「今すぐインストール」をクリック

4, 「プラグインを有効化」をクリック

 

Sharebarの設定方法

管理画面「設定」>「Sharebar」

インストールした状態だと下記のようにソーシャルメディアボタンがアメリカで主流のものとなっています。なので「ACTIONS」>「Delete」でいらないボタンを削除しておきましょう。

131209_1909 131209_1910

 

Sharebarの設定

サイトを確認しながら設定していきましょう。

131209_2013

Automatically … posts?・・・投稿ページで表示させるか。

Automatically … pages?・・・固定ページで表示させるか。

Display horizontal… ・・・ページが1000px以下になったらバーを表示させるか。

Display credit…・・・Sharebarプラグインへのリンク。不要。

Sharebar Position・・・Sharebarの位置。左か?右か?

Left Offset・・・左側に表示させるるときのカラムからの距離

Right Offset・・・右側に表示させるときのカラムからの距離

Minimum width…・・・横幅の長さ

Twitter Username・・・ツイッターのユーザーネーム

Sharebar Background Color・・・背景の色

Sharebar Border Color・・・囲っている線の色

 

SNSボタンの追加

SNSボタンを追加する場合は、管理画面「Add New Button 」をクリックします。

131209_2114

Name・・・ボタンの名前

Position・・・SNSボタンの順番。1が一番上。

Enable・・・必ずチェックを入れておきましょう。

Big Button・・・大きいボタン

Small Button・・・小さいボタン

 

設置するコードは公式サイトから取得できますが、面倒くさい!って方は下記のコードをコピペしてくださいね^^

Big ButtonとSmall Buttonの2種類がありますけど、両方入れておくと自動的にBig Buttonが反映されます。

 

Twitterボタン

Big Button

 

Small Button

 

Twitter公式サイト
https://about.twitter.com/resources/buttons#tweet

 

facebookボタン

Big Button

 

Small Button

 

facebook公式サイト
https://developers.facebook.com/docs/plugins/like-button/

 

Google+ボタン

Big Button

 

Small Button

 

Google+公式サイト
https://developers.google.com/+/web/+1button/?hl=ja

 

はてなブックマーク

Big Button

 

Small Button

 

はてなブックマーク公式サイト
http://b.hatena.ne.jp/guide/bbutton

※1ページ中に複数のはてなブックマークボタンを設置する場合、script要素は1回分の記述で問題ありません。

 

Pocketボタン

Big Button

 

Small Button

 

まとめ

ソーシャルメディアボックスがスクロールすると追従してくるので視覚的にうっとうしい?かなと思う人もいますが、それ以上にボタンをクリックしてくれる感じがするのでSharebarは導入したほうがオススメかと思います。

ただ、Sharebarはスマホには適応されないので、スマホでもソーシャルメディアボックスをしっかり表示して記事の拡散を狙って行きましょう。

ちなみに当サイトにあるソーシャルボタンはsharebarを使用していません。
Sharebar不要!スクロール追従するソーシャルメディアボタンを実装する方法

 - SNS, WordPress Plugins


  • このエントリーをはてなブックマークに追加

Message

メールアドレスが公開されることはありません。

関連記事

medium_155554663
【spam-byebye】日本語以外のコメントスパムを高確率で排除するWordPressプラグイン

spam-byebyeは日本語以外のコメントスパムを高確率で排除するWordPr …

medium_5000124976
【001 Prime Strategy Translate Accelerator】日本語翻訳ファイルをキャッシュ/高速化するWordPressプラグイン

001 Prime Strategy Translate Accelerator …

131120_2001
【Master Post Advert】moreタグの後に広告を自動で挿入できるWordPressプラグイン

Master Post Advertはあらかじめ設定しておいた広告タグをmore …

131113_2201
【Contact Form 7】お問い合わせフォームを設置できるWordPressプラグイン

WordPressを初めてインストールした段階では、ブログ・サイトにはお問い合わ …

140407_2101
【Code Snippets】functions.phpをコード毎に管理可能なWordPressプラグイン

Code Snippetsはfunctions.phpをコード毎に管理可能なWo …

140309_1901
【TablePress】HTMLの知識がなくてもサクッと表が作成できるWordPressプラグイン

TablePressはHTMLの知識がなくてもサクッと表が作成できるWordPr …

131114_2301
【EWWW Image Optimizer】画像を圧縮・最適化するWordPressプラグイン

「EWWW Image Optimizer」はサイトで使用している画像を圧縮して …

131225_2101
【Akismet】ウザいコメントスパムを遮断するWordPressプラグイン

Akismetはコメントスパムを遮断するWordPress初期設定時にプリインス …

medium_4431233741
【WP Hyper Response】サイトの表示速度を高速化するWordPressプラグイン

WP Hyper Responseはサイトの表示速度を高速化するWordPres …

131126_2105
【Wordbooker】更新記事を自動でfacebookページに投稿するWordPressプラグイン

WordbookerはWordPressで更新した記事をfacebookページに …