マウスホバーでニョキッと出てくるソーシャルアイコンが設置できるWordPressプラグイン「Sliding Social Icons」

マウスホバーでニョキッと出てくるソーシャルアイコンが設置できるWordPressプラグイン「Sliding Social Icons」

マウスホバーでニョキッと出てくるソーシャルアイコンが設置できるWordPressプラグイン「Sliding Social Icons」
  • シェアしてね♪
  • このエントリーをはてなブックマークに追加


  • Youtube動画変換・ダウンロードおk!
  • このエントリーをはてなブックマークに追加
※2015/11/15追記
Sliding Social Iconsは公式ディレクトリから削除されました。

Sliding Social Iconsは、マウスカーソルを合わせると、ニョキッとスライドして出てくるソーシャルアイコンを設置することができるWordPressプラグインです。

どういうアイコンなのかは、デモページを見ていただくのがわかりやすいと思います。左上に表示されているソーシャルアイコンが、Sliding Social Iconsで設置されたものなので、マウスホバーしてみてください。

スポンサードリンク

Sliding Social Iconsのインストール

インストール手順は以下の通りです。

  1. Sliding Social Iconsをダウンロードします。
  2. ダウンロードしたファイルを展開し wp-content/plugins にアップロードします。
  3. 管理画面の[プラグイン]ページで、Sliding Social Iconsプラグインを有効化します。

対応しているソーシャルメディア

Sliding Social Iconsが対応しているSNSは、以下の通りです。

  • Facebook
  • Google+
  • YouTube
  • Linkedin
  • Twitter
  • Instagram
  • Pinterest
  • Skype
  • foursquare
  • GitHub
  • Tumblr

Sliding Social Iconsの設定

Sliding Social Iconsプラグインを有効化すると、管理画面に[Sliding Social Icons]というメニューが追加されます。そこで各ソーシャルページへのリンクやボタンの色などが設定できます。

Sliding Social Iconsの設定

Facebook url:FacebookページもしくはプロフィールのURLを入力します。
Google Plus URL:Google+ページもしくはプロフィールのURLを入力します。
Youtube url:YouTubeアカウントのURLを入力します。
LinkedIn URL:LinkedInのURLを入力します。
Contact Us Page URL:お問い合わせページのURLもしくはメールアドレスを入力します。
Contact Form Shortcode:お問い合わせ用のショートコードを入力します。
Twitter URL:TwitterアカウントのURLを入力します。
Instagram URL:InstagramのURLを入力します。
Phone Number:電話番号を入力します。
Pinterest url:PinterestのURLを入力します。
Skype url:SkypeのURLを入力します。
foursquare url:foursquareのURLを入力します。
GitHub url:GitHubのURLを入力します。
Tumblr url:TumblrのURLを入力します。
Store url:ネットショップのURLを入力します。
Position:ボタンを表示する場所を指定します。ただし、rightは有料版しか選択できません。
Top:画面上部からどれくらいの位置にボタンを表示するか指定します。デフォルトは100px
Background color:ボタンの背景色を指定します。デフォルトは#3b94e3
Text color:ボタンの文字色を指定します。デフォルトは#ffffff
Disable/Hide:チェックを入れるとボタンが表示されません。

設定では、必要な項目だけ入力しましょう。入力したものだけ、ソーシャルアイコンが表示されます。

あとがき

動きのある洒落たアイコンを簡単に設置することができて便利ですね。

常に左上にアイコンが表示されるので、クリックしてもらえる確率が上がると思われます。ソーシャルメディアやお問い合わせページへの流入を増やしたい方は、ぜひお試しください。

この記事が気に入ったら
いいね!してね♪

Twitter で
スポンサードリンク

関連記事

コメントを残す

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