【サービス紹介】「忍者おまとめボタン」
こんにちは、発狂ねこです(^ ・∀・^)
今回は、ブログに設置するSNSボタンの見栄えを合わせるサービス「忍者おまとめボタン」を紹介いたします。
どんな風にまとまるの?
私は「はてなブログ」というブログサービスを使ってこのブログを書いています。
はてなブログでは、[デザイン]→[カスタマイズ]→[記事]の項目から設定画面が開き、プルダウンボタンにチェックを入れることで各種SNSシェアボタンを表示させることができます。
ただこれにチェックを入れただけですと、実際の記事の下の表示は下記のようになります。
大きさや形がバラバラで、視認性が悪くストレスになりますね( ;∀;)
「忍者おまとめボタン」というサービスを使うことで、ボタンを整えて表示させることができます。
下記は一例です。
このように、大きさや形をまとめて表示させることができます。
それでは手順を見ていきましょう((((^ ・∀・^)
手順
「忍者おまとめボタン」からコードを作成
まず、下記URLから「忍者おまとめボタン」のページに入ります。
http://www.ninja.co.jp/omatome/
表示されるページで「選択したセットで作成」「自分でSNSボタンを選んで作成」のどちらかを選び、その後に遷移するページで設置するブログを選択しましょう。※「忍者ツールズ」サービスへの登録が必要です。
「自分でSNSボタンを選んで作成」を選択した場合は下記の画面に移り、設置するボタンを自分で選択することができます。
SNSボタン下の「+追加」を押すと、左下の「表示するボタン」に追加されます。
「表示するボタン」内ではボタンを選択してドラッグ&ドロップすることで位置移動が可能です。
設置するボタンを選択を終えたら、右下の「プレビュー&コードを取得する」を押して下さい。
「忍者おまとめボタン」トップ画面から「選択したセットで作成」した場合、もしくは「自分でSNSボタンを選んで作成」を選び「プレビュー&コードを取得する」を押した場合、「プレビュー画面」に遷移します。
この画面の下部に設置するボタンのコードが生成されていますので、このコードをブログのコード入力場所にコピペしていきます。
コードをブログに設置
※ここでは私は使用している「はてなブログ」について説明していきます。他のブログサービスをお使いの方は下記URLからご確認ください。
http://www.ninja.co.jp/omatome/help/faq/5394/
「はてなブログ」の場合について説明します。
[デザイン]→[カスタマイズ]→[記事]→[記事下]のスペースに、生成されたコードをコピペしてください。
一般的な記事の下に設置する前提で進めていますが、記事上にも表示させたい場合は[記事上]にも同様にコピペしてください。
なお、その際にプルダウンボタンでチェックを入れているSNSボタンは全てチェックを外して下さい(ボタンの重複表示を防ぐため)。
これでブログにSNSボタンが設置されます。
上記のボタンの並びを見ていると、それぞれのボタンがカラフルなのでパズドラを思い出しますね!
それではお後がよろしいようで((((^ ・∀・^)