Webチャットツール「Drift」の導入メモ

フランクな問い合わせを増やそうと思って、DriftというWebチャットルームを導入してみました。

その時の導入メモです。

導入効果等については、こちらの記事などご参考にどうぞ。

チャットツールDriftを５ヶ月間運用した振り返り

1 導入の仕方
2 気になった点のメモ
3 おわりに

導入の仕方

参考にしたのは、

プログラミングなしで超簡単！Webサイトやブログに「チャット機能」を組み込める「Drift」を使ってみた！

が大変参考になりました。ありがとうございます。導入する先は、本ブログなどWordpressサイトももちろんOKです。

Drift基本英語なので、英語がどうしてもヤダという人は諦めましょう。日本語でチャットとかはもちろん出来ますが、設定等全て英語です。

手順としては、

Drift公式サイトで登録する（CreateFreeAcount）
チャットのデザイン設定をする
コードを挿入する

でいけます。

以下細かい説明は省いて気になったところ、はまりそうななったところだけのメモです。

気になった点のメモ

インストール時のコード挿入

挿入コード自体は、Settings→App Settings→Chat Widget→InstallでJavascriptにあります。

インストール時のコード挿入をheader.phpにする点ですが、おそらくWordPress用のDriftを入れてコードを入れてもいいし、直接header.phpに入れてもいいはずと思ったのですが、今回はDriftプラグインを入れてやってみました。

ちゃんと検証していませんが、Driftプラグインの説明に

Enter your Drift JS code snippet. You can find your Drift JS code snippet here. A Free Drift account is required to use this plugin.

フリーアカウントを使っているだとプラグイン使ってねということだと理解しました。

ちなみにロリポップだとWAF設定が効いていて、Driftアプリで「Save Changes」で保存しようとするとうまくいきません。WAF設定自体はセキュリティ的に良いわけで、WAFの除外ルールをSiteGuardでしようとしてもシグネチャが「xss-tag-1」とかでいかにも攻撃を受けそうなもので除外するとリスクが高いと感じてやっていません。

一時的にWAFを無効にして、Save Changesしたら、WAFを有効にするという手間がかかりますが、それで対応しました。有効にするのをお忘れなく。