My Web道

WEB制作科 受講記録 …とその後も続くWEB制作に関する活動・学習記録です。

忍者おまとめボタンを使ってみた

f:id:sntkk3:20170826140859p:plain

忍者ツールズでSNSボタンを作成

f:id:sntkk3:20170826132526p:plain
忍者ツールズ|ホームページ ブログ アクセス解析 カウンター メールフォーム :
http://www.ninja.co.jp/

「忍者ツールズ」というサービスはご存知でしょうか。
Webサイト用の便利ツール・パーツが揃っていて、無料登録だけで使えるとても便利なサービスです。

WordPressへのSNSシェアボタン設置にも、忍者ツールズは最適!
今回私も自身のWordPressサイト設置用に活用させていただきました。

以下、忍者ツールズをはじめて使う際の利用手順をご紹介します。

【手順】

1. 新規ユーザー登録
f:id:sntkk3:20170826132752p:plain

2. 次ページでは、
 ・パスワードの設定
 ・利用規約への同意
 ・個人情報の取り扱いに同意
 を行い、続行

 ⇒ 新規ユーザー登録完了です
 f:id:sntkk3:20170826133414p:plain

3.「サービス一覧へ」ボタンをクリックします
 f:id:sntkk3:20170826133616p:plain

4. サービス一覧画面から「忍者おまとめボタン」-「ツールを作成」をクリックします
f:id:sntkk3:20170826133825p:plain

5. 利用規約画面で「利用規約に同意して次へ」
f:id:sntkk3:20170826141105p:plain

6. 設置先の利用サービスを選択します
(ここではWordPressを選択します)
f:id:sntkk3:20170826141239p:plain

7. SNSシェアボタンの種類を選択します
f:id:sntkk3:20170826141337p:plain

 選択しているボタンのプレビュー
 f:id:sntkk3:20170826141435p:plain

 作成したボタンのスクリプトコード
 (このコードを設置場所にコピー・貼り付けで使用します)
 f:id:sntkk3:20170826141553p:plain


 (既成ボタンに変更を加える時)
ここからは、既成ボタンに変更を加える時の手順となります。

8. 作成したボタンは「ホーム(管理)」で編集もできます
f:id:sntkk3:20170826141515p:plain

9. ボタン管理画面から変更対象の作成済みボタン行の「編集」をクリックします。
f:id:sntkk3:20170826141619p:plain

9. ホーム(管理)画面で希望の編集(変更)を行います
「ホーム(管理)」のここでボタンの並び順変更、削除もできます
f:id:sntkk3:20170826141649p:plain

10. 編集が完了したら「プレビュー&コードを取得する」ボタンをクリックします
f:id:sntkk3:20170826141719p:plain

11. 生成されたコードをコピーし、設置したい場所に貼り付けたら作業完了です。


ちなみに、私の場合、
WordPressの以下プラグインを使用、
wordpress.org

Content Blocksに上記忍者ツールズ生成コードを貼り付け、
記事の編集画面で表示されるContent Blocksボタンでショートコードとして呼び出すことができるようになるので、そのショートコードを任意の場所に入れられるようにしています。


なお、今回はSNSシェアボタンが目的だったため、
忍者おまとめボタンについてのみのご紹介となりました。

他にもたくさんの便利ツールが揃っている模様。
これを機に、一通り使っていってみようと思います。


【関連リンク】
www.ninja.co.jp