顧客体験の声を創り出す
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
顧客の声(VOC)体験は、顧客のフィードバックを集め、彼らの期待や好み、懸念事項について洞察を提供する効果的なツールです。このデータを分析することで、全体的な顧客満足度を追跡し、ビジネス慣行を改善するための情報に基づいた意思決定が可能になります。
例えば、フライト予約ページにフィードバックボタンを埋め込むことで、顧客はフライト検索や予約の際に簡単に意見を入力できます。この種のフィードバック機能はVOC体験の重要な要素であり、ユーザーからのリアルタイムフィードバックを収集してサービス向上を支援します。
このウォークスルーでは、VOC体験の作成と、顧客フィードバックをキャプチャするためのストリームFEEDBACKイベント送信のプロセスを案内します。収集されたデータはVoice of the Customer Dashboardに反映され、Net Promoter Score(NPS)やCustomer Satisfaction Score(CSAT)などの指標を監視できます。
このウォークスルーでは、以下の方法を説明します:
カスタムウェブテンプレートを使ってVOC体験を作成する
この手順では、カスタムウェブテンプレートを作成し、HTML、CSS、JavaScriptコードを設定することでVOCのウェブ体験を作成する方法を示します。
カスタムウェブテンプレートを使ってVOC体験を作成するには:
-
ナビゲーションメニューで「 体験」をクリックします。
-
経験リストで「ウェブ作成」>クリックしてください。
-
「 体験名付け」 ダイアログで、顧客体験の声の名前を入力してください。Sitecore Personalize体験に名前を付けると 自動的にIDが作成され ます。
-
新しい体験を作成するには 「作成 」をクリックしてください。
-
エクスペリエンスタイルで「バリアントを作成」をクリックします。
-
カスタムコードを使って新しいウェブテンプレートを作成するには「テンプレートを作成」をクリックしてください。コードエディターはHTML、CSS、JavaScript、FreeMarkerを使ってテンプレートをカスタマイズできるように表示します。
-
以下のHTML、CSS、JavaScriptコードを該当するタブにコピー&ペーストし、**保存をクリックします。**VOCのウェブ体験をプレビューして、組織のウェブサイト上でどのように表示されるか確認できます。
HTMLThank you for your feedbackIf you have any questions or need help please visit our Resources or Contact us section.
CSS#bx-modal_overlay { display: none; justify-content: center; align-items: center; position: fixed; z-index: 999999; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; background-color: rgba(0,0,0,0.4); font-family: Arial,HelveticaNeue,Helvetica Neue,Helvetica,Lucida Grande,sans-serif; }
#bx-modal_overlay .bx-modal_content { display: flex; flex-direction: column; position
; background-color: #F6F6F6; margin: 0 auto; border-radius: 4px; box-shadow: 0 2px 10px 6px rgba(0,0,0,0.3); height: 100%; width: 100%; border: none; }@media screen and (min-width: 1024px) { #bx-modal_overlay .bx-modal_content { max-width: 1056px; height: auto; min-height: 100px; width: auto; } }
#bx-modal_overlay .bx-modal_button-wrapper { display: flex; margin-top: auto; }
#bx-modal_overlay .bx-modal_button { display: inline-block; border-radius: 4px; color: #fff; background-color: #00B377; padding: 10px 23px; }
.bx-hidden { display: none ; }
.bx-hidden_important { display: none !important; }
/* Options Screen */ .bx-options { display: flex; }
.bx-options .abper-112-text { flex-grow: 1; font-size: 14px; line-height: 1.5; margin: 16px 0 30px; padding-bottom: 0; }
.abper-112-link { cursor: pointer; }
/* Radio button modal */
.bx-modal_content h1 { font-size: 30px; line-height: 34px; font-family: Georgia,"Times New Roman",Times,serif !important; max-width: 90%; margin: auto; text-align: center; }
.bx-modal_content { text-align: center; }
.bx-comment > .bx-comment_textarea { height: 174px; width: 80%; border: 1px solid #666; border-radius: 3px; padding: 15px 18px 16px 20px; resize: none; margin: 10px auto 10px; font-family: HelveticaNeue-Light, Helvetica Neue Light, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif; font-size: 16px; font-weight: 300; }
.bx-comment > .bx-comment_warning { color: #999; text-align: left; width: 80%; margin: 10px auto 30px; font-family: HelveticaNeue-Light, Helvetica Neue Light, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif; font-size: 16px; font-style: italic; font-weight: 300; }
/* Rating screen */ .bx-modal_content > #bx-rating { padding: 30px 20px 20px; }
.bx-radio_label { display: none; }
@media screen and (min-width: 1024px) { .bx-radio_label { right: 0; left: 0; bottom: 10px; position: absolute; font-size: 14px; }
.rating .bx-star5
~ .bx-label5 { display: block; }.rating .bx-star4
~ .bx-label4 { display: block; }.rating .bx-star3
~ .bx-label3 { display: block; }.rating .bx-star2
~ .bx-label2 { display: block; }.rating .bx-star1
~ .bx-label1 { display: block; } }/* Rating Stars */ .rating { display: inline-block; border: none; height: 75px; }
/*
() is a filter, so that browsers that don’t support don’t follow these rules. Every browser that supports also supports (), so it doesn’t make the test unnecessarily selective */ .rating() > input { position; top:-9999px; clip(0,0,0,0); }.rating
() > label { float; padding.3em .1em; overflow; white-space; cursor; font-size%; line-height.2; color:#ddd; }.rating
() > label { content: url(https://c.ekstatic.net/ecl/iconography/e72585a018510638901dd029c05d0724\_40\_38.png); }.rating > input
~ label { content: url(https://c.ekstatic.net/ecl/iconography/27b9f781a94a8af00418bf50ea278016\_40\_38.png); }.rating
() > label, .rating() > label ~ label { content: url(https://c.ekstatic.net/ecl/iconography/27b9f781a94a8af00418bf50ea278016\_40\_38.png); }.rating > input
+ label, .rating > input + label ~ label, .rating > input ~ label, .rating > input ~ label ~ label, .rating > label ~ input ~ label { content: url(https://c.ekstatic.net/ecl/iconography/27b9f781a94a8af00418bf50ea278016\_40\_38.png); }.rating > label
{ position; top; left; }/* Comment Screen */ .bx-comment { padding: 30px 20px 20px; }
/* Thank You Screen */ .bx-thank_you { padding: 30px 20px 20px; }
/* close button */ .bx-modal__btn-close-icon { background: transparent; top: 0; right: 0; width: 30px; height: 30px; margin-top: 20px; margin-right: 25px; position: absolute; display: flex; justify-content: center; align-items: center; cursor: pointer; }
.bx-modal__btn-close-icon
{ content: ''; height: 30px; border-left: 2px solid #75808F; position: absolute; transform: rotate(45deg); }.bx-modal__btn-close-icon
{ content: ''; height: 30px; border-left: 2px solid #75808F; position: absolute; transform: rotate(-45deg); }/* Comment Screen */
/*font-family: HelveticaNeue-Light, Helvetica Neue Light, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif;*/
/* Mobile Web Feedback Button */ .abper-112-toggle .bx-mobile_web_feedback_button { padding: 15px 25px; }
@media screen and (min-width: 1024px) { .abper-112-toggle .bx-mobile_web_feedback_button { padding: 0; } }
/******* EK CSS *******/
@font-face { font-family: ek-font-icons; src: url(https://cdn.ek.aero/shared/fonts/ek-icons/ek-font-icons.eot); src: url(https://cdn.ek.aero/shared/fonts/ek-icons/ek-font-icons.eot?#iefix) format("embedded-opentype"), url(https://cdn.ek.aero/shared/fonts/ek-icons/ek-font-icons.woff) format("woff"), url(https://cdn.ek.aero/shared/fonts/ek-icons/ek-font-icons.ttf) format("truetype"), url(https://cdn.ek.aero/shared/fonts/ek-icons/ek-font-icons.svg#ek-font-icons) format("svg"); font-weight: 400; font-style: normal; }
@font-face { font-family: heroic-condensed-black-oblique; src: url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-black-oblique.eot); src: url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-black-oblique.eot?#iefix) format("embedded-opentype"), url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-black-oblique.woff) format("woff"), url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-black-oblique.ttf) format("truetype"), url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-black-oblique.svg#heroic-condensed-black-oblique) format("svg"); font-weight: 400; font-style: normal; }
@font-face { font-family: heroic-condensed-medium-oblique; src: url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-medium-oblique.eot); src: url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-medium-oblique.eot?#iefix) format("embedded-opentype"), url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-medium-oblique.woff) format("woff"), url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-medium-oblique.ttf) format("truetype"); font-weight: 400; font-style: normal; }
@font-face { font-family: heroic-condensed-light-oblique; src: url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-light-oblique.eot); src: url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-light-oblique.eot?#iefix) format("embedded-opentype"), url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-light-oblique.woff) format("woff"), url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-light-oblique.ttf) format("truetype"), url(https://cdn.ek.aero/shared/fonts/heroic/heroic-condensed-light-oblique.svg#heroic-condensed-light-oblique) format("svg"); font-weight: 400; font-style: normal; }
/*.abper-112-modal { tabindex
{ border: none; border-radius: 3px; box-shadow: none; outline: none; }*/a { text-decoration: underline; }
a
, a, a { text-decoration: none; }.abper-112-modal.qubit-AdvancedModal { align-items: normal; left: auto; padding: 0; right: auto; width: 100%; z-index: 9999; } @media screen and (min-width: 1024px) { .abper-112-modal.qubit-AdvancedModal { align-items: center; } } @media (max-width: 768px) { .abper-112-modal .qubit-AdvancedModal-body { height: 100%; } } .abper-112-modal .qubit-AdvancedModal-box { background-color: #f6f6f6; display: block; height: 100%; max-height: none; width: 100%; z-index: 9999; } @media screen and (min-width: 1024px) { .abper-112-modal .qubit-AdvancedModal-box { height: auto; width: auto; } } .abper-112-modal .qubit-AdvancedModal-Icon { color: #333; font-size: 10px; } .abper-112-modal .qubit-VisitorPulse { color: #333; display: flex; font-family: HelveticaNeue, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif; font-size: 16px; flex-grow: 1; margin: auto; } .abper-112-modal .qubit-VisitorPulse-content { display: flex; margin: 0 auto; overflow: auto; padding: 30px 20px 20px; width: 100%; } @media screen and (min-width: 768px) { .abper-112-modal .qubit-VisitorPulse-content { margin: auto; } } @media screen and (min-width: 1024px) { .abper-112-modal .qubit-VisitorPulse-content { display: block; margin: 0 auto; } } .abper-112-modal .qubit-VisitorPulse-titleContainer { display: none; } .abper-112-modal .qubit-VisitorPulse-question { border-bottom: none; margin-bottom: 0; max-width: 690px; padding-bottom: 0; text-align: center; } .abper-112-modal .qubit-VisitorPulse-question .qubit-VisitorPulse-questionName { color: #333; font-family: Helvetica, Arial, Lucida Grande, sans-serif !important; font-size: 20px; font-weight: 400; line-height: 24px; margin: 0 auto 20px; text-align: center; width: 80%; } @media screen and (min-width: 1024px) { .abper-112-modal .qubit-VisitorPulse-question .qubit-VisitorPulse-questionName { font-size: 30px; line-height: 34px; } } .abper-112-modal .qubit-VisitorPulse-question .qubit-VisitorPulse-radios { height: 75px; position: relative; width: 260px; } .abper-112-modal .qubit-VisitorPulse-question .qubit-VisitorPulse-radio input { display: none; } .abper-112-modal .qubit-VisitorPulse-question
.qubit-VisitorPulse-radio { display: inline-block; margin-bottom: 0; text-align: center; width: 20%; } .abper-112-modal .qubit-VisitorPulse-question .qubit-VisitorPulse-radio .qubit-VisitorPulse-radioOuter { background: url('https://c.ekstatic.net/ecl/iconography/e72585a018510638901dd029c05d0724\_40\_38.png'); background-repeat: no-repeat; height: 40px; margin: 0; width: 40px; } .abper-112-modal .qubit-VisitorPulse-question .qubit-VisitorPulse-radio.abper-112-active .qubit-VisitorPulse-radioOuter { background: url('https://c.ekstatic.net/ecl/iconography/27b9f781a94a8af00418bf50ea278016\_40\_38.png'); background-repeat: no-repeat; } .abper-112-modal .qubit-VisitorPulse-question .qubit-VisitorPulse-radio .qubit-VisitorPulse-radioInner { display: none; } .abper-112-modal .qubit-VisitorPulse-question .qubit-VisitorPulse-radio .qubit-VisitorPulse-radioText { bottom: 10px; display: none; font-family: HelveticaNeue, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif; font-size: 14px; font-weight: normal; left: 0; margin: 0 auto; position: absolute; right: 0; width: 100%; } .abper-112-modal .qubit-VisitorPulse-question .qubit-VisitorPulse-radio .qubit-VisitorPulse-radioText.abper-112-visible { display: inline-block; } .abper-112-modal .qubit-VisitorPulse-question(2) { display: none; } .abper-112-modal .qubit-VisitorPulse-question(2) .qubit-VisitorPulse-textarea { background: #fff; border: 1px solid #666; border-radius: 3px; box-shadow: inset 4px 4px 0 0 #f6f6f6; color: #333; display: block; font-family: HelveticaNeue-Light, Helvetica Neue Light, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif; font-size: 16px; font-weight: 300; height: 214px; margin: auto; padding: 20px 18px 16px 20px; } @media screen and (min-width: 1024px) { .abper-112-modal .qubit-VisitorPulse-question(2) .qubit-VisitorPulse-textarea { height: 174px; width: 80%; } } .abper-112-modal .qubit-VisitorPulse-question(2) .abper-112-optional { color: #999; font-family: HelveticaNeue-Light, Helvetica Neue Light, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif; font-size: 16px; font-style: italic; font-weight: 300; margin: 10px auto 30px; text-align: left; } @media screen and (min-width: 1024px) { .abper-112-modal .qubit-VisitorPulse-question(2) .abper-112-optional { width: 80%; } } .abper-112-modal .qubit-VisitorPulse-question.abper-112-visible { display: block; } .abper-112-modal .qubit-VisitorPulse-question.abper-112-hide { display: none; visibility: hidden; } .abper-112-modal .qubit-VisitorPulse-submit { background-color: #c60c30; border-color: #c60c30; color: #fff; display: inline-block; font-size: 14px; font-weight: bold; height: auto; line-height: normal; margin: auto 0 0; max-width: 690px; width: 100%; } @media screen and (min-width: 768px) { .abper-112-modal .qubit-VisitorPulse-submit { margin: 0 auto; } } @media screen and (min-width: 1024px) { .abper-112-modal .qubit-VisitorPulse-submit { width: 317px; } } .abper-112-modal .qubit-VisitorPulse-submit { background-color: #c60c30; border-color: #c60c30; box-shadow: 0 0 6px 0 #333; color: #fff; } .abper-112-modal .qubit-VisitorPulse-submit.abper-112-visible { display: inline-block; visibility: visible; } .abper-112-modal .qubit-VisitorPulse-thankYou { flex-direction: column; flex-grow: 1; margin: 0 auto; max-width: 690px; overflow: auto; padding: 40px 20px 20px; text-align: center; } @media screen and (min-width: 768px) { .abper-112-modal .qubit-VisitorPulse-thankYou { margin: auto; } } @media screen and (min-width: 1024px) { .abper-112-modal .qubit-VisitorPulse-thankYou { margin: 0 auto; overflow: hidden; } } .abper-112-modal .qubit-VisitorPulse-thankYou .abper-112-icon-check { border: 2px solid green; border-radius: 50px; box-sizing: border-box; height: 70px; margin: 0 auto 30px; width: 70px; } @media screen and (min-width: 1024px) { .abper-112-modal .qubit-VisitorPulse-thankYou .abper-112-icon-check { margin: 40px auto 20px; height: 60px; width: 60px; } } .abper-112-modal .qubit-VisitorPulse-thankYou .abper-112-icon-check::before { border-bottom: 2px solid green; border-right: 2px solid green; box-sizing: border-box; content: ''; display: inline-block; height: 30px; margin-top: -5px; position: relative; top: 50%; transform: rotate(45deg) translateX(-60%) translateY(-35%); width: 15px; } .abper-112-modal .qubit-VisitorPulse-thankYou .abper-112-text { flex-grow: 0; padding-left: 0; padding-right: 0; } @media screen and (min-width: 1024px) { .abper-112-modal .qubit-VisitorPulse-thankYou .abper-112-text { margin-bottom: 30px; } } .abper-112-modal .qubit-VisitorPulse-thankYou .abper-112-close-button { margin: auto 0 0; } @media screen and (min-width: 768px) { .abper-112-modal .qubit-VisitorPulse-thankYou .abper-112-close-button { margin: 0; } } .abper-112-modal .abper-112-tripadvisor { border-top: 2px solid #d8d8d8; flex-grow: 1; padding: 20px 0 0; } .abper-112-modal .abper-112-tripadvisor.abper-112-tripadvisor-hide { display: none; } .abper-112-modal .abper-112-tripadvisor-logo { background-position: center; background-repeat: no-repeat; background-size: cover; display: inline-block; height: 80px; margin: auto; width: 100px; } @media screen and (min-width: 1024px) { .abper-112-modal .abper-112-tripadvisor-logo { height: 50px; position: relative; top: -10px; width: 63px; vertical-align: middle; } } .abper-112-modal .abper-112-tripadvisor-copy { display: inline-block; } @media screen and (min-width: 1024px) { .abper-112-modal .abper-112-tripadvisor-copy { text-align: left; width: 70%; } } .abper-112-modal .abper-112-close-button { font-size: 16px; font-weight: 700; line-height: normal; margin-bottom: 20px; min-height: 40px; } @media screen and (min-width: 1024px) { .abper-112-modal .abper-112-close-button { width: 317px; } } .abper-112-modal .abper-112-text { flex-grow: 1; font-size: 14px; line-height: 1.5; margin: 16px 0 30px; padding-bottom: 0; } .abper-112-modal a, .abper-112-modal a { color: #333; } .abper-112-modal, .abper-112-modal, .abper-112-modal { outline: none !important; } .abper-112-modal * { outline: none !important; } .abper-112-toggle { border-top: 1px solid rgba(255, 255, 255, .13); margin-top: auto; } .abper-112-toggle, .abper-112-toggle, .abper-112-toggle { outline: none; } .abper-112-toggle+.country-selector-mobile { margin-top: 0; } .abper-112-toggle .abper-112-text { color: #fff; cursor: pointer; display: inline-block; font-family: HelveticaNeue, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif; font-size: 14px; position: relative; vertical-align: middle; } @media screen and (min-width: 1024px) { .abper-112-toggle .abper-112-text { color: #333; width: auto; } } @media screen and (min-width: 1024px) { .abper-112-toggle { background-color: #fff; border-radius: 3px 3px 0 0; box-shadow: 0 1px 4px 1px #666; color: #333; cursor: pointer; font-family: HelveticaNeue, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif; font-size: 14px; height: 40px; overflow: hidden; padding: 10px 15px 25px 25px; position: fixed; right: 0; top: calc(50% - 120px); transform: rotate(-90deg); transform-origin: 100% 100%; z-index: 99; } } @media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) { .abper-112-toggle { top: calc(25% - 120px); } } .abper-112-toggle .abper-112-toggle-container { position: relative; } .abper-112-toggle .abper-112-icon { background-image: url('https://c.ekstatic.net/ecl/iconography/4fb725e86a700af2f5a185035d78d864\_48\_42.png'); background-size: cover; display: inline-block; height: 22px; vertical-align: middle; width: 25px; } @media screen and (min-width: 1024px) { .abper-112-toggle .abper-112-icon { background-image: url('https://c.ekstatic.net/ecl/iconography/9a9731bdeeac7dabae8183d63729c015\_81\_68.png'); height: 20px; position: absolute; transform: rotate(90deg) translateY(15px); } } .abper-112-toggle .abper-112-text { display: none; line-height: 20px; padding: 0 0 0 15px; } .qubit-VisitorPulse-modal { display: none; } #abper-112-feedback-content { font-family: HelveticaNeue, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif; margin: 0 auto; max-width: 690px; padding: 70px 10px; text-align: center; width: 100%; } @media screen and (min-width: 768px) { #abper-112-feedback-content { margin: auto; } } @media screen and (min-width: 1024px) { #abper-112-feedback-content { display: flex; margin: 0 auto; max-width: 1056px; padding: 60px 40px; } } #abper-112-feedback-content .abper-112-feedback, #abper-112-feedback-content .abper-112-contact, #abper-112-feedback-content .abper-112-complaint { background-color: #fff; border-radius: 3px; box-shadow: 0 2px 4px 2px rgba(0, 0, 0, 0.19); display: block; margin-bottom: 20px; padding: 10px 10px 0; position: relative; text-decoration: none; } #abper-112-feedback-content .abper-112-feedback span.abper-112-button, #abper-112-feedback-content .abper-112-contact span.abper-112-button, #abper-112-feedback-content .abper-112-complaint span.abper-112-button { pointer-events: none; } @media screen and (min-width: 1024px) { #abper-112-feedback-content .abper-112-feedback, #abper-112-feedback-content .abper-112-contact, #abper-112-feedback-content .abper-112-complaint { background: none; border-radius: 0; box-shadow: none; display: flex; flex-basis: auto; flex-direction: column; margin: 0; padding: 30px; width: 33.3333%; }#abper-112-feedback-content .abper-112-feedback::after, #abper-112-feedback-content .abper-112-contact::after, #abper-112-feedback-content .abper-112-complaint::after { border-right: 1px solid #d8d8d8; content: ""; display: block; height: 100%; position: absolute; right: 0; top: 0; z-index: 1; } } #abper-112-feedback-content .abper-112-title { text-align: center; } #abper-112-feedback-content .abper-112-title, #abper-112-feedback-content .abper-112-hr, #abper-112-feedback-content .abper-112-text { display: none; } @media screen and (min-width: 1024px) { #abper-112-feedback-content .abper-112-title, #abper-112-feedback-content .abper-112-hr, #abper-112-feedback-content .abper-112-text { display: inline-block; } } #abper-112-feedback-content .abper-112-complaint::after { border: none; } @media screen and (max-width: 1023px) { #abper-112-feedback-content .abper-112-button, #abper-112-feedback-content .abper-112-button
{ background: none; border: none; box-shadow: none; color: #333; font-weight: bold; margin-bottom: 10px; padding: 6px; width: 100%; } } #abper-112-feedback-content .abper-112-icon { background-position: center; background-repeat: no-repeat; background-size: contain; display: inline-block; height: 55px; margin: 0 auto; width: 60px; } @media screen and (min-width: 1024px) { #abper-112-feedback-content .abper-112-icon { height: 68px; margin: 0 auto 20px; width: 80px; } } #abper-112-feedback-content .abper-112-icon-feedback { background-image: url('https://c.ekstatic.net/ecl/iconography/9a149a9f19b5506ca8a908f23f01c24f\_60\_60.png'); height: 34px; width: 34px; } @media screen and (min-width: 1024px) { #abper-112-feedback-content .abper-112-icon-feedback { background-image: url('https://c.ekstatic.net/ecl/iconography/9a9731bdeeac7dabae8183d63729c015\_81\_68.png'); height: 68px; width: 81px; } } #abper-112-feedback-content .abper-112-icon-contact { background-image: url('https://c.ekstatic.net/ecl/iconography/dcb2d20bb523a4d1b635194758896024\_60\_60.png'); height: 34px; width: 34px; } @media screen and (min-width: 1024px) { #abper-112-feedback-content .abper-112-icon-contact { background-image: url('https://c.ekstatic.net/ecl/iconography/c8be9d69c9aa7b9c193ce1049e616f36\_81\_68.png'); height: 68px; width: 81px; } } #abper-112-feedback-content .abper-112-icon-complaint { background-image: url('https://c.ekstatic.net/ecl/iconography/f633a3e3102979ba5c912a4b09c74c86\_60\_60.png'); height: 34px; width: 34px; } @media screen and (min-width: 1024px) { #abper-112-feedback-content .abper-112-icon-complaint { background-image: url('https://c.ekstatic.net/ecl/iconography/fbc91a6287d56b2f84607070934ba7d8\_81\_68.png'); height: 68px; width: 81px; } } #abper-112-feedback-content .abper-112-title, .abper-112-thank-you .qubit-VisitorPulse-thankYouText { color: #333; font-family: Helvetica, Arial, Lucida Grande, sans-serif !important; font-size: 20px; font-weight: 400; line-height: 24px; margin: 0; } @media screen and (min-width: 1024px) { #abper-112-feedback-content .abper-112-title, .abper-112-thank-you .qubit-VisitorPulse-thankYouText { font-size: 30px; line-height: 34px; } } .abper-112-modal .qubit-VisitorPulse-thankYouText { font-size: 30px; line-height: 1.25; margin: 0; } hr.abper-112-hr { background: none; border: none; border-top: 2px solid #c60c30; display: inline-block; margin: 0 auto; width: 60px; } .abper-112-button, .qubit-VisitorPulse-submit { background-color: #fff; border: 1px solid #333; border-radius: 3px; color: #333; cursor: pointer; display: inline-block; font-size: 14px; font-weight: bold; line-height: normal; margin-bottom: 20px; padding: 11px; text-align: center; text-decoration: none; width: 100%; } @media screen and (min-width: 1024px) { .abper-112-button, .qubit-VisitorPulse-submit { width: auto; } } .abper-112-button, .qubit-VisitorPulse-submit { box-shadow: 0 0 6px 0 #666; } .abper-112-button.abper-112-primary, .qubit-VisitorPulse-submit.abper-112-primary { background-color: #c60c30; border-color: #c60c30; color: #fff; font-family: HelveticaNeue, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif; font-size: 14px; font-weight: 700; } .abper-112-button.abper-112-primary, .qubit-VisitorPulse-submit.abper-112-primary { background-color: #c60c30; border-color: #c60c30; color: #fff; } .abper-112--focus { border-radius: 2px !important; box-shadow: 0 0 2px 1.5px #fff, 0 0 3px 3px #000, inset 0 0 0.5px 0.5px #fff, inset 0 0 0.5px 1.5px #000 !important; outline: 0 !important; } .qubit-VisitorPulse-hidden { visibility: hidden; } @media (max-width: 480px) { .ekglobal-navigation-megamenu-holder.menu--opened { overflow-y: scroll; } } @media (orientation: portrait) { .abper-112-modal .qubit-VisitorPulse { display: block; }.abper-112-modal .qubit-AdvancedModal-body { flex: none; height: 100%; }
.abper-112-modal .qubit-VisitorPulse { display: block; }
.abper-112-modal .qubit-VisitorPulse-content { height: 100%; position: relative; }
.abper-112-modal .qubit-VisitorPulse-submit.abper-112-visible { bottom: 30px; left: 20px; right: 20px; position: absolute; width: auto; }
.abper-112-modal .qubit-VisitorPulse-thankYou { height: 100%; position: relative; } } @media (orientation: portrait) and (min-width: 768px) { .abper-112-modal .qubit-VisitorPulse-submit.abper-112-visible { bottom: 60px; left: 30px; right: 30px; } } @media (orientation: portrait) and (min-width: 1024px) { .abper-112-modal .qubit-VisitorPulse-submit.abper-112-visible { bottom: auto; left: auto; position: relative; right: auto; width: 317px; } } @media (orientation: portrait) and (min-width: 768px) { .abper-112-modal .abper-112-button.abper-112-primary.abper-112-close-button { bottom: 60px; left: 0; max-width: 690px; position: absolute; } } @media (orientation: portrait) and (min-width: 1024px) { .abper-112-modal .abper-112-button.abper-112-primary.abper-112-close-button { bottom: auto; left: auto; position: relative; right: auto; } } .ek .abper-112-modal contentEditable=true
(tabindex='-1')(.panel-disabled), .ek .abper-112-modal tabindex(tabindex='-1')(.panel-disabled), .ek .abper-112-modal a(tabindex='-1')(.panel-disabled), .ek .abper-112-modal area(tabindex='-1')(.panel-disabled), .ek .abper-112-modal button(disabled)(tabindex='-1')(.panel-disabled), .ek .abper-112-modal iframe(tabindex='-1')(.panel-disabled), .ek .abper-112-modal input(disabled)(tabindex='-1')(.panel-disabled), .ek .abper-112-modal select(disabled)(tabindex='-1')(.panel-disabled), .ek .abper-112-modal textarea(disabled)(tabindex='-1')(.panel-disabled) { outline: none !important; } .ek .abper-112-modal p a { text-decoration: underline; } .ek .abper-112-modal p a { text-decoration: none; } @media screen and (min-width: 1024px) { .ek-global-navigation .abper-112-toggletabindex="0" { border-radius: 3px 3px 0 0 !important; box-shadow: 0 1px 4px 1px #666 !important; } } .abper-112-toggletabindex:focus(a)(button) { border-radius: 0; box-shadow: none; } @media screen and (min-width: 1024px) { .abper-112-toggletabindex:focus(a)(button) { border-radius: 3px 3px 0 0; box-shadow: 0 1px 4px 1px #666; } } .abper-112-modal a { border-radius: none; box-shadow: none; } .page-template.leaderboard-template .abper-112-toggle { height: 5px; } .ekglobal-navigation-megamenu-holder.menu--opened .abper-112-toggle { height: auto; } .abper-112-modal label.qubit-VisitorPulse-radio * { pointer-events: none; } .abper-112-modal * { -webkit-tap-highlight-color: transparent; } .abper-112-toggle { display: none; } @media screen and (min-width: 1024px) { .abper-112-toggle { display: block; } } .abper-112-toggle+.nav__lang-wrapper { margin-top: 0; } .nav--show .abper-112-toggle { display: block; } .ek-global-navigation .menu--opened .abper-112-toggle, .main-navigation__nav .nav--mobile .abper-112-toggle { display: block; } @media screen and (min-width: 1024px) { .ek-global-navigation .menu--opened .abper-112-toggle, .main-navigation__nav .nav--mobile .abper-112-toggle { display: none; } } .ek-global-navigation .menu--opened .abper-112-toggle+div, .main-navigation__nav .nav--mobile .abper-112-toggle+div { display: block; } .main-navigation__nav .nav--mobile .abper-112-toggle-container { padding: 15px; } .abper-112-hidden-mobile { display: none !important; } @media screen and (min-width: 1024px) { .abper-112-hidden-mobile { display: inline-block !important; } } .abper-112-hidden-desktop { display: inline-block !important; } @media screen and (min-width: 1024px) { .abper-112-hidden-desktop { display: none !important; } }JavaScriptinsertHTMLAfter('body');
/* Get all elements required */ var bxMobileWebFeedbackButton = document.getElementById('bx-mobile_web_feedback_button'); var bxModal = document.getElementById('bx-modal_overlay'); var bxFeedback = document.getElementById('bx-feedback_option'); var bxOptions = document.getElementById('bx-options'); var bxRating = document.getElementById('bx-rating'); var bxModalClose = bxModal.querySelector('.bx-modal__btn-close-icon'); var bxRatingButtons = document.getElementById('bx-rating_buttons'); var bxComment = document.getElementById('bx-comment'); var bxCommentTextarea = document.getElementById('bx-comment_textarea'); var bxSubmitFeedback = document.getElementById('bx-submit_feedback'); var bxThankYou = document.getElementById('bx-thank_you'); var bxCloseButton = document.getElementById('bx-close'); var bxModalOverlay = document.getElementById('bx-modal_overlay'); var ratingValue = 0;
function closeModal() { bxThankYou.style.display = 'none'; bxComment.style.display = 'none'; bxRating.style.display = 'none'; bxOptions.style.display = 'flex'; bxModal.style.display = 'none'; if (document.querySelector(".rating > input
")) { document.querySelector(".rating > input").checked = false; bxCommentTextarea.value = ""; } }function getPos() { var re = new RegExp('sitecore.com\/a-z{2}\/'); var matches = re.exec(window.location.href); if (matches && matches.length > 0) return matches0.substring(0, matches0.length - 1); else return "sitecore.com"; }
bxModal.style.display = 'flex';
bxFeedback.onclick = function() { bxOptions.style.display = 'none'; bxRating.style.display = 'block'; };
function getRadioValue() { var stars = document.getElementsByName('rating'); for(i = 0; i < stars.length; i++) { if(starsi.checked) return starsi.value; } }
bxRatingButtons.onclick = function() { ratingValue = getRadioValue(); if (ratingValue) { bxRating.style.display = 'none'; bxComment.style.display = 'block'; } };
bxSubmitFeedback.onclick = function() { console.log("Submit feedback clicked"); var feedbackEvent = { "channel": "WEB", "type": "FEEDBACK", "language": "EN", "currency": "EUR", "page": "home", "pos": getPos(), "browser_id": Boxever.getID(), "rating": ratingValue, "comment": document.getElementById('bx-comment_textarea').value, "survey_id": "150174", "question_text": document.getElementById('bx-header_question').textContent, "page_category": "", "visitor_session_id": "", "platform_type": "", "country_region": "", "member_tier": "", "page_url": window.location.href }; console.log("Feedback event:", feedbackEvent); Boxever.eventCreate(feedbackEvent, function (data) { console.log("Feedback event sent:", data); // Only toggle visibility after the feedback event is processed bxThankYou.style.display = 'block'; bxComment.style.display = 'none'; }, 'json'); };
bxModalClose.onclick = function() { closeModal(); };
bxCloseButton.onclick = function() { closeModal(); };
var pos = getPos(); document.getElementById('bx-contact_link').setAttribute("href", ("https://www." + pos + "/company/contact-us") ); document.getElementById('bx-complaint_link').setAttribute("href", ("https://www." + pos + "/resources/support") ); document.getElementById('bx-faq_link').setAttribute("href", ("https://www." + pos + "/resources/support") ); document.getElementById('bx-contact_link2').setAttribute("href", ("https://www." + pos + "/company/contact-us") );
/* Add feedback to card on Help page */ if (document.querySelector('ul.help-centre-feedback__cards-container > li data-link="Complaints and feedback
feedback"')) { var helpFeedbackCard = document.querySelector('ul.help-centre-feedback__cards-container > li data-link="Complaints and feedback feedback"'); helpFeedbackCard.onclick = function() { bxOptions.style.display = 'none'; bxRating.style.display = 'block'; bxModal.classList.remove("bx-hidden_important"); bxModal.style.display = 'flex'; }; }
フィードバックイベントをフォーマットし送信する
顧客フィードバックをSitecore PersonalizeのVoice of the Customer dashboardに表示させるためには、ストリームFEEDBACKイベントをカスタムイベントとしてフォーマットし、データをキャプチャするために送信する必要があります。
フィードバックイベントをフォーマットし送信するには:
-
以下の必要な属性を持つカスタムイベントをSendします:
- "channel" - イベントが送信されたチャネル。可能な値は、 "WEB"、 "MOBILE_WEB"、または "MOBILE_APP"。
- "type" - イベントの種類はフィードバックイベントを表すために "FEEDBACK" に設定されなければなりません。
- "question_text" - 顧客に対して「 ウェブサイト体験にどれくらい満足していますか?」と尋ねる具体的な質問。
- "rating" - 1 から 5までの数値回答。 1 は最低得点、 5は最高得点を表します。
- "comment" - 顧客からのフリーテキストの回答で、体験に関する書面によるフィードバックを含むことができます。
- "execution_ref" - フロー実行のための一意な参照。
- "pos" - 例えば、テナント向けに設定された販売時点(POS) retailsite.com。
- "browser_id" - Sitecore Personalizeによって生成されたブラウザの一意ID。
以下はJSON形式のFEEDBACKイベントの例です:
{ "channel":"WEB", "type":"FEEDBACK", "question_text":"How satisfied were you with your website experience?", "rating"
, "comment":"Fantastic customer service when I needed to change my order", "execution_ref":"ec5b12fc-f70b-4bcc-950e-338bbf41c66e", "pos":"retailsite.com", "browser_id":"22860bff-94ba-4d84-aa37-2b5a83d5411b" } -
オプションとして、FEEDBACKイベントを送信した後、Voice of the Customerダッシュボードで詳細を確認できます。このダッシュボードは顧客フィードバックを集約し、FEEDBACKイベントに含まれる属性に基づいて主要な指標を追跡できます。
- rating値は平均評価タイルとNPS評価タイルに表示される評価を計算するために使われます。
- comment属性にキャプチャされたテキストは、十分な数の顧客が同様のフィードバックをくだされば、ダッシュボードのワードクラウドに表示されます。
How satisfied were you with your website experience?
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。