スタンダードプラン以上では、更新情報をタイムリーに閲覧者に届けるWebプッシュ通知機能が利用できます。実際に導入する方法はこちらをご確認ください。
この方法の場合、設置したブログを対象に購読することになりますが、カスタマイズをすると特定のブログの購読やウェブサイト配下のすべてのブログを登録することができます。
![]()
特定のブログを指定する方法
<a href="javascript:void(0)" class="webpush" onclick="MT.PushNotification.openSubscriptionModal({rootDir: 'blog'})">
<section class="side-webpush">Webプッシュ通知の購読</section>
</a>
特定のブログを1つ指定する場合は、このソースで購読ボタンを設置し rootDir: 'blog' のblogの部分を指定したいブログのフォルダ名を記述します。
例えば、example.com/staffblog/といったようにウェブサイトの配下にスタッフブログを作ったけど、トップページなどのウェブサイト上でも購読させたい、といった場合に利用できます。
ウェブサイトも含む配下のブログでオンになっているブログをすべて購読させる方法
対象が1つであれば先述のようにシンプルに対応が可能でしたが、ウェブサイトも含む配下のブログもまとめて購読する、という場合は追加コードが必要です。
ただ、これが実現できれば閲覧者は1度購読するだけでそのサイト内のWebプッシュ通知を利用しているすべての更新情報を受け取ることができるので便利です。
まずは購読ボタンの方のソースコードはこちらです。
<a href="javascript:void(0)" class="webpush" onclick="MT.PushNotification.openSubscriptionModal({rootDir:'/'})">
<span>Webプッシュ通知の購読</span>
</a>
こちらも rootDir:'/' といったように指定するのがポイントです。
続いて、必要なスクリプトを出力させる mt:ServiceWorkerSnippet にもその下に追加でスクリプトを追加します。
<$mt:ServiceWorkerSnippet pn_auto_spawn="0"$>
<script id="subscribe-all-blogs" data-blog-dirs='<mt:Blogs><mt:If tag="PushNotificationEnabled"><mt:BlogDirname>,</mt:If></mt:Blogs>'>
if (MT.PushNotification.isSupportEnvironment()) {
MT.PushNotification.ready.then(function() {
var service = MT.PushNotification.PushNotificationService.getInstance();
var siteUrl = (function() {
var aElement = document.createElement("a");
aElement.href = "/";
return aElement.href;
})();
service.on("scriptionstatuschange", function(data) {
if (!(siteUrl in data)) {
return;
}
var siteIsSubscribed = data[siteUrl];
document
.getElementById("subscribe-all-blogs")
.dataset["blogDirs"].slice(0, -1)
.split(",")
.forEach(function(dir) {
MT.PushNotification.isSubscribed({ rootDir: dir }).then(function(
blogIsSubscribed
) {
if (siteIsSubscribed && !blogIsSubscribed) {
service.subscribe({ rootDir: dir });
} else if (!siteIsSubscribed && blogIsSubscribed) {
service.unsubscribe({ rootDir: dir });
}
});
});
});
});
}
</script>
これにより、Webプッシュ通知がオンになっているブログすべてをまとめて購読させることができます。
※購読は裏側で1つ1つ行っているため購読ブログ数が多い場合は、登録に時間がかかる場合があります。極端に多い場合はブラウザを閉じないようメッセージ等を表示してください。
タイムリーな情報発信に便利なWebプッシュ通知機能、ぜひご活用ください。
