WEBページ・ブログにボットを表示させるには?(全体設定:WEBチャットタグの取得)

 

■WEBチャットボックス設定方法

左側メニュー「全体設定」をクリックし「WEBチャットタグの取得」を選択して下さい。

e382b9e382afe383aae383bce383b3e382b7e383a7e38383e38388-2020-08-03-16.01.06

「WEBチャットボックスタグの自動生成」設定欄が表示されますので、「WEBチャットボックスタグ」上(英数列上)で1回クリックをしてコピーして下さい。
※1回クリックすると、文字列を全て選択することが出来ます。

コピー後、ボットを表示させたい箇所(WEBページやブログパーツ)へ貼り付けて下さい。
初期設定時のまま編集されていない場合は、左下に「入力して下さい」と表示されたボックスが表示されますので、クリックして正しく動作するかご確認下さい。

2018-7-27_17-41-38_No-00

WEBチャットボックスは、細かな設定を行うことが出来ます。
「WEBチャットボックスタグ」の下の各種設定欄で行えますので、必要に応じてカスタマイズを行って下さい。

2018-7-30_16-59-39_No-00
<設置例>
初期設定時のまま「TEC29」ブログ内カスタムプラグインとして設置した場合
(使用ブラウザ:Google Chrome)

■チャットボックスを開いた時の表示設定を編集する場合
「WEBチャットボックスのタイトル」「WEBチャットボックスの副題」「初期メッセージ」「入力欄の背景文字」設定欄を編集して下さい。

①WEBチャットボックスのタイトル:チャットボックスを開いた時に、上部に表示されます
②WEBチャットボックスの副題:チャットボックスを開いた時に、上部に表示されます
③初期メッセージ:チャットボックスを開いた時、一番最初に表示される文言を設定出来ます
④入力欄の背景文字:チャットボックスを設置した際に表示される文言が設定出来ます

■チャットボックス設置時の表示設定を編集する場合
「高さ(画面に対する%)」「横幅(画面に対する%:PCのみ。モバイルは全幅)」「左端からの距離(px)」「右端からの距離(px)」「上端からの距離(px)」「下端からの距離(px)」「自動ポップアップまでの秒数」「会話内ボットアイコン画像URL」「未利用時のポップアップ用アイコン化」「ポップアップ用アイコン画像URL」設定欄を編集して下さい。

なお、表示設定のカスタマイズ(編集)を行いますと、即時「WEBチャットボックスタグ」が更新されます。
各設定を変更した後は、必ず「WEBチャットボックスタグ」をコピーして、貼り付けなおして下さい。

2018-7-30_17-45-43_No-00
<カスタマイズ後の設置例:Botbird for Business>

■注意事項

管理画面の「WEBチャットボックスタグの自動生成」欄は、タイトル等の設定をBotbird for Business内に記憶するものではなく、様々なWEBページに合わせて、多種多様なWEBチャット設定タグを一時的に動的生成するための欄です。
生成されたタグを都度WEBサイトに貼り付け(更新)して、ご利用ください。

■botbird-webchat-component.js / chatbox.jsの指定可能なパラメータ(ご参考)

title : タイトル
subtitle : サブタイトル
placeholder : 入力欄のメッセージ
inputHeight : 高さ
inputWidth : 横幅
inputLeft : 左からの距離
inputRight : 右からの距離
inputBottom : 下からの距離
inputTop : 上からの距離
initialMsg : 初期メッセージ
initialMsg2nd : 二度目の訪問以降の初期メッセージ
initialSubmitMsg : WEBチャットオープン時に背後で送るメッセージ(シナリオ開始タグなど)
botIconUrl : ボットメッセージに表示されるアイコン
popupSec : 自動ポップアップまでの時間(秒)
chatBoxIcon : 初期状態でアイコン画像化しておく場合は1
chatBoxIconImgUrl : 初期状態のアイコン画像URL
slidesPerView : 検索ボット結果のカルーセル表示時、可視領域に表示する枚数(デフォルトで1.25)
linkOpenTarget : URLリンクオープン時のTarget(デフォルトで_blank)
uname : 任意のユーザー名({name}で使われます)
uid : 任意のユーザーID(会話履歴に表示されます)

※文字列は、URLエンコードしてご指定ください

コメントを残す

コメントを投稿するには、以下のいずれかでログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中