Webサイトへのアンケートの埋め込み

Webサイトへのアンケートの埋め込み

お知らせ：当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

概要

アンケートをWebサイトに埋め込むと、訪問者は別のページやURLに移動することなく、Webページ上で直接アンケートに回答できます。Zoho Surveyで生成された短いコードをコピーしてWebサイトのHTMLに貼り付けることで、そのページを訪れたすべての人がアンケートを表示して回答できるようになります。
  1. アンケートを選択し、［公開］タブに移動します。
  2. ［新しい配信方法を追加］をクリックします。
  3. アンケートを公開するには、［公開アクセス］セクションの［公開リンク］欄で［作成］をクリックします。
  1. iFrameリンクが以下のように表示されます。［コピー］をクリックしてiFrameリンクをコピーし、WebサイトまたはWebページに埋め込みます。

アンケート終了ページまたはお礼ページの表示先をiFrameウィンドウから最上位ウィンドウに変更するには

アンケートをiFrameでWebサイトに埋め込んだ場合、アンケート終了ページまたはお礼ページは次のいずれかの方法で表示できます。
  1. iFrame内にお礼ページを表示します。
  2. お礼ページをウィンドウ全体（最上位ウィンドウ）に表示します。これを行うには、埋め込みiFrameコード内のアンケートURLの末尾に「?target=top」を追加します。

アンケート送信時の通知を受け取るには

Webサイト上でアンケートが送信されたときに通知を受け取るには、親Webサイトに次のイベントリスナーコードを追加します。アンケートが送信されると、通知が届きます。

Window.addEventListener('message', (message) => {
if (message.data && message.data['zohosurvey_respondentStatus'] === 'completed') {
// アンケートが完了しました
}
}) 

iFrameウィンドウのサイズを固定してスクロールを無効にするには

iFrame内でのスクロールを避けるには、現在のページに合わせてアンケートの高さと幅を調整する必要があります。そのため、サイズ変更に使用できるアンケートの実際の高さと幅が渡されます。形式は次のとおりです。
 

data = { zohosurvey: {

height : surveyHeight,

width : surveyWidth,

action : 'surveySize'

}}

Webページでメッセージを受信したら、ウィンドウ内に適切に収まるようにiFrameの高さと幅を調整する必要があります。iFrameのサイズを調整すると、一部の機能が想定どおりに動作しない場合があるため、同様の方法でスクロール位置を処理する必要があります。調整に使用できるスクリプトが、次の形式で送信されます。

data = { zohosurvey: { action : 'moveScroll' ,

position : position}}


サンプルコード

次のサンプルコードを使用して、iFrameのサイズを調整できます。
<iframe src='<survey link>' frameborder='0'
style='height:700px;width:100%;' marginwidth='0' marginheight='0' scrolling='auto'
allow='geolocation' id='iframe-id'></iframe>
<script>
var iframe = document.querySelector('#iframe-id'); // iFrameのIDに合わせてIDを変更します
function setIframeSize(data){
if(data.zohosurvey ){
if(data.zohosurvey.action == 'surveySize'){
iframe.style.height = data.zohosurvey.height + 'px';
iframe.style.width = data.zohosurvey.width + 'px'
}else if(data.zohosurvey.action == 'moveScroll'){
window.scrollTo(500, iframe.offsetTop + data.zohosurvey.position);} } }
window.addEventListener('message', function(e) {
setIframeSize(e.data);
} , false);
</script>