Kanamii

伝えたい想いを自分らしく・・・

kanamii-889-1

スポンサーリンク

STINGERカスタマイズ

WordPressサイトにPush7を導入する方法と設定手順を簡単4ステップで♪

2016/11/17

Webプッシュ通知サービス「Push7」は、更新情報を購読者のブラウザに自動的に送ることができる便利なサービス。
実は私もつい最近知ったばかりです。

購読したいサイトの購読ボタンを押して通知を許可するだけの手軽さなので、今後は利用されるユーザーさんがどんどん増えるかもしれません。
Push7の詳細については、下記公式サイトをご参照ください。

▶Push7 | Webサイト運営者のための、Webプッシュ通知サービス

ここでは、WordPressサイトにPush7を導入し、自動プッシュ通知を行うための手順を説明します。

流れとしては、

  1. Push7サイトでアカウント登録
  2. 自動プッシュ設定
  3. WordPressへのプラグイン導入と設定
  4. サイトへの購読ボタンの設置

以上の4ステップでとても簡単です。
なので、事前準備と注意事項などにポイントを置きつつ、ササ~っとな♪

スポンサーリンク

Push7 サイトアイコン画像の推奨サイズは?

Push7にアカウント登録する際の事前準備として、サイトアイコンに使用する画像が必要となります。
こんな感じで登録されるアイコンですね。

kanamii-889-2

登録時のアイコンをアップロードする画面を見ると、薄い色の枠が約180px×180px、濃い色の枠が350px×350px。350px以上の画像はトリミングされて表示されるようですので「180px以上の大きすぎない正方形の画像」を準備されるとよいかと思います。
サイトのロゴ画像がない場合は、プロフィール画像などお好きなもので大丈夫です。

kanamii-889-3

ステップ1:Push7サイトでアカウント登録

  • Push7へアクセスして「新規登録」をクリック
  • メールアドレスを入力して仮登録をします。
  • すぐにメールが届くので、「本登録用のURL」をクリック
  • 仮登録時と同じメールアドレスとパスワードを入力して「新規会員登録」をクリック
  • アプリケーション登録画面にて、「サイト名」「サイトURL」「サイトアイコン」「アプリケーションURL(購読ボタンをクリックしたときに表示される購読用ぺージのアドレス)」をそれぞれ入力、設定して「登録」をクリックして完了です。

ステップ2:自動プッシュ設定

手動でのプッシュ通知は、画面左側のサイト名→プッシュ通知→「新規プッシュ通知」で行います。

以下は、WordPressで自動プッシュ通知を行うための手順です。

  • 画面左側のサイト名→アプリケーション設定→自動プッシュ設定→「WordPress」をクリック
  • プラグイン導入の案内と、設定に必要となるAPPNOとAPIKEYが表示されている画面が表示されますので、このまま開いておいてください。

ステップ3:WordPressへのプラグイン導入と設定

ブラウザの別タブを開いて、WordPressダッシュボード→プラグイン→新規追加→「Push7」で検索して表示されるプラグインをインストールして有効化してください。

kanamii-889-4

WordPressダッシュボード→設定→「Push7設定」を開きます。

kanamii-889-5

  • APPNO・APIKEY:開いたままのPush7のページからコピーしてペーストします。
  • SSLの検証を無効化する:私の環境では「する」にチェックをしないと正常に通知されませんでした。「しない」のままで一度テストされるとよいかと思います。
  • 残りの項目は、任意でチェックを入れて「変更を保存」で完了です。

※プラグインを有効化すると投稿の編集画面の右側下の方にチェックボックスが表示されるようになりますが、更新ボタンのすぐ下にドラッグ&ドロップして配置しておくと便利です。

kanamii-889-6

ステップ4:サイトへの購読ボタンの設置

再びPush7サイトへ戻ります。

  • 表示したままだった「自動プッシュ」タブの左横の「導入方法」をクリック
  • 特にこだわりがなければ「かんたん設置方法」で、使いたいボタンにチェックを入れてコードをコピー。
    サイト内の設置したい場所にペーストして完了です。

kanamii-889-as-2

※WordPress無料テーマ、STINGER PLUS+ のカウント付きオリジナルソーシャルボタンへのPush7ボタンの追加方法は下記ページをご参照ください。

STINGER PLUS カウント付きオリジナルソーシャルボタンにRSS・Feedly・Push7を追加する方法

以上、WordPressサイトへのPush7導入方法と設定手順をササ~っとな♪
・・ササ~っとだったかな・・?

最後までお付き合い下さりありがとうございます。

▶STINGER PLUS・STINGER8・AFFINGER4 カスタマイズ全記事一覧へ

この記事が気に入ったら
いいね!しよう

Twitter で

Facebook・Twitterへ最新記事をお届けします

-STINGERカスタマイズ