無料チャットツール(HTMLサイト向け)
| ツール名 | 無料プランの主な制限 | 日本語対応 | おすすめ用途 |
| Tawk.to | 制限なし(広告なし) | ◎ | シンプルで高機能な対応 |
| Crisp Chat | オペレーター数2人まで | △(設定で可能) | 小規模なサイト |
| Tidio | 月100会話まで | ◎ | ボット+チャットを試したい |
| チャネルトーク | 機能・人数制限あり | ◎(日本製) | 中小企業・EC向け |
| JivoChat | オペレーター1人まで | ◎ | 複数チャネルで対応したい |
1. Tawk.to(トーク・トゥ) – 完全無料・広告なし
特徴:
•コード1行貼るだけで導入完了
•ダッシュボードから営業時間や自動応答など設定可能
•完全無料なのに高機能(チャット履歴・訪問者追跡など)
設置手順:
1.公式サイト に無料登録
2.サイト名やURLを入力
3.表示される「スクリプトタグ」をコピー
4.あなたのHTMLファイルの</body>直前に以下のように貼り付け:
<!--Start of Tawk.to Script-->
<script type="text/javascript"> var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){ var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true; s1.src='https://embed.tawk.to/あなたのID/1h〇〇〇〇〇〇〇〇〇';
s1.charset='UTF-8'; s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0); })();
</script> <!--End of Tawk.to Script--> ※「あなたのID」は登録後に発行されます。
Tawk.toの設置手順
- Tawk.toにサインアップ
まず、Tawk.toの公式サイトにアクセスして無料登録を行います。
「SIGN UP FREE」ボタンをクリックして、メールアドレス・パスワードを入力します。
GoogleアカウントやFacebookでもサインイン可能です。 - ウェブサイトを設定
サインイン後、ダッシュボードが表示されます。
「Add your first site」または「+Add Site」ボタンをクリックします。
次に、あなたのウェブサイト名やURLを入力します。
設定が完了すると、Tawk.toからチャットウィジェットの設定が表示されます。 - ウィジェットのコードをコピー
「Get the embed code」ボタンをクリックします。
すると、Tawk.toが生成した埋め込みコード(JavaScript)が表示されます。
このコードをコピーします。 - HTMLファイルにコードを追加
Tawk.toのコードを、あなたのHTMLサイトのタグの直前に貼り付けます。 - 例:html
- コピーする。
- 編集する。
<!-- あなたのページの内容 -->
<!-- Tawk.toのチャットコードをここに追加 -->
<script type="text/javascript">
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true;
s1.src='https://embed.tawk.to/あなたのID/1h〇〇〇〇〇〇〇〇〇';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
</script>
</body>
</html>- 保存してアップロード
コードをHTMLファイルに追加したら、保存してウェブサーバーにアップロードします。
ローカルでテストする場合は、ブラウザで直接ファイルを開いて動作確認します。
サーバーにアップロードする場合は、FTPソフトやサーバー管理ツールを使って更新します。 - チャット機能の動作確認
サイトをブラウザで開き、ページをリロードします。
画面の右下にTawk.toのチャットウィジェットが表示されているはずです。
訪問者として自分でメッセージを送って、正しくチャット機能が動作するか確認します。 - カスタマイズと設定
ウィジェットのデザイン変更:Tawk.toのダッシュボードから、チャットウィジェットの色やメッセージの内容、表示タイミングをカスタマイズできます。
オペレーターの設定:オペレーター(スタッフ)を追加して、営業時間や自動応答を設定できます。
自動応答メッセージの設定方法
自動応答メッセージは、訪問者がチャットを開始した際に、自動的にメッセージを送信する設定です。これを使うことで、オペレーターがリアルタイムで対応できない場合でも、スムーズに対応できます。
手順:
Tawk.to ダッシュボードにログイン
ログイン後、ダッシュボードにアクセスします。
「管理」→「チャット設定」
左側メニューの「管理」をクリックし、その中の「チャット設定」を選びます。
「自動応答設定」
チャット設定ページで、「自動応答メッセージ」や「不在時メッセージ」の設定ができます。
「自動応答メッセージ」を有効にして、メッセージ内容を編集します。
メッセージ内容の編集
例えば、営業時間外に「現在、オペレーターが不在です。後ほどご連絡いたします。」というメッセージを表示させることができます。
保存
設定を保存して、変更を反映します。