コピペするだけ!Webサイトの更新情報をリアルタイムでプッシュ通知「Push7」

ブログ

どうも!アットホームギーク(@drying)です。

Webサイトの更新情報をiPhoneやAndroidのスマホ端末やChromeやFirfoxなどのブラウザにリアルタイムにプッシュ通知することができる「Push7」を導入しました!

当ブログの更新情報を受け取る方法として、RSS、TwitterやFacebookがありますしこれ以上選択肢を増やすのは「シンプルイズベスト」を志すものとしてどうかなと思って躊躇していましたが新しいモノには目がないしまたそれが Webサービスだったらとりあえず試したくなりますし。今回もそんな感じでサクッと導入してみました。

Webプッシュ通知サービス「Push7」とは

160401

「Push7」はタイトル通りWebサイトの更新情報をリアルタイムでプッシュ通知することができるWebサービスです。しかも面倒なシステムなどはいらずコードをコピペするだけでかんたんに導入することができます。しかも無料です!

現在のところ直接プッシュ通知を受け取れるのはAndroid、ChromeとFirefoxです。iPhoneはプッシュを受け取るための専用のアプリを別途導入しないといけません。SafariとiOS(iPhone)のプッシュ通知は現在開発中とのこと。

Push7

Push7
開発元:GNEX Ltd.
無料
posted with アプリーチ

「Push7」を導入する手順

「Push7」の導入方法はサクッとこんな感じです。

Webサイト管理人側

  1. 会員登録
  2. ウェブサイトやプッシュ通知の設定
  3. WordPressプラグインインストール

プッシュ通知受け取る側

  1. Androidやパソコンの場合
  2. iPhoneの場合

どちらともめっちゃカンタンです。上にある目次より必要なところから読むことも出来ます。プッシュ通知を受け取る方法を知りたいだけだったらササッと飛ばして下の方へ。

「Push7」導入方法(Webサイト管理人側)

まずは「Push7」のウェブサイトにいき会員登録しましょう。

ウェブサイトへのアクセスはこちらから
Push7 | Webサイト運営者のための、Webプッシュ通知サービス

新規登録をクリックするとメールアドレスを入力する画面に移動します。お使いのメールアドレスを入力して仮登録。すると登録したメールアドレスに本登録のURLが届くのでそちらをクリック。
160401-1

メールアドレスと任意のパスワードを入力し、新規会員登録をクリック。
160401-2

これで会員登録完了です!ここからはウェブサイトの設定をしていきます。
160401-3

ウェブサイトやプッシュ通知の設定

サイト名やURLを入力していきます。
160401-4

アプリケーションURLは「athomegeek」にしました。「アプリケーションごとのアドレスです。購読URLに使われます」とのことなのでお使いのドメインでいいと思います。まったく関係ないけどそろそろアイコンそろそろ変えたいなと思ってます。

これで設定が完了しました。けどこれだけではプッシュ通知できないのでもう少しいろいろやります。
160401-5

アプリケーション設定より「導入方法」へ。設置方法が3種類ありますが「かんたん」だとコピペすればできるのでこれを選ぶのが無難ですね。
160401-6

「かんたん」の設置方法はこんな感じ。ボタンの表示形式を選んでコードを貼り付けるだけ。
160401-9

あとは自動でプッシュ通知を送るためにWordpressプラグインをインストールしてウェブサイトを「Push7」に対応させてしまいましょう。

WordPressプラグインインストール

WordPress管理画面より、プラグイン>新規追加。

「Push7」で検索してでてきたプラグインをインストールします。「Push7 Subscribe button」も気になるなー
160401-8

インストールしてプラグインを有効化し、Wordpress管理画面よりPush7設定へ。ここに「APPNO」と「APIKEY」を入力します。
160401-11

「APPNO」と「APIKEY」はPush7のアプリケーション設定の「自動プッシュ設定」に記載されているのでそれをコピペしましょう。
160401-10

コピペして「新規投稿時自動プッシュ通知する」の「Post」にチェックを入れて「変更を保存」をクリックします。その他カテゴリ別に自動更新を設定することもできるみたいです。
160401-18

これでWebサイト側の設定は完了しました。またWordpress以外のウェブサイトではRSSを使って自動更新することができますよ。こっちもカンタンですね。
160401-13

「Push7」導入方法(プッシュ通知受け取る側)

次はプッシュ通知を受け取る側の設定です。AndroidやパソコンとiPhoneではやり方がことなります。

Androidやパソコンの場合

AndroidやパソコンのChromeもしくはFirefoxのブラウザでAT HOME GEEKのPush7ページもしくはボタンを開いて許可をクリックするだけです。今回はChromeで試してみました。
160401-15

AT HOME GEEKの更新情報をプッシュ通知で受け取るにはこちらから

AT HOME GEEKのPush7ページ

許可を押せば新しい記事が更新されるたびにプッシュ通知されます。
160401-16

iPhoneの場合

まずは「Push7」のiPhoneアプリをインストールしましょう。

Push7

Push7
開発元:GNEX Ltd.
無料
posted with アプリーチ

アプリのインストールができたらiPhoneのブラウザでAT HOME GEEKのPush7ページを開くかボタンを押します。
IMG_7608

AT HOME GEEKの更新情報をプッシュ通知で受け取るにはこちらから
AT HOME GEEKのPush7ページ

「Pushアプリで購読」をタップし、Push7アプリへ移動します。
IMG_7609

最後に「このサイトを購読」をタップすれば終了です。
IMG_7610

これでウェブサイトの更新情報をプッシュ通知するウェブサービス「Push7」が導入できました。

当ブログもスマホからの閲覧が半分以上を超えているところを見ると今後はよりいっそうパソコンよりスマホやタブレットからの閲覧が多くなってくると思いますしいつも持っているスマホに自分の好きなウェブサイトのプッシュ通知が来るなんて便利でしかないですよね。RSSを知らない人もいると思いますし。

ではまた!

AT HOME GEEKの更新情報をプッシュ通知で受け取るにはこちらから

AT HOME GEEKのPush7ページ

タイトルとURLをコピーしました