You have launched your survey on your recipe or production website, but you are encountering display or triggering issue ?
This article lists common problems related to deploying a survey on a website and provides solutions to identify and resolve each type of issue. It applies to Website, Pop-ins, Pop-unders, Bars, Buttons and In-page deplyment formats.
Glossary of web deployments
A web deployment is a channel that allows integrating a survey into a website. It can be displayed in various forms : button, bar, pop-under, pop-in and in-page (learn more about creating a web deployment).
An iFrame deployment (Inline Frame) is a URL deployment manually embedded in a website using an HTML "<iframe>" element without interfering with the host page's code. The loading and interactions are managed by the iframe itself. Skeepers does not support technical issues that may arise in this configuration because the integration is not managed by the platform.
A trigger condition is a specific criterion that must be met to trigger an event. In this context, the event corresponds to the survey's display on a website. A condition can be based on a date, platform, specific value, or an event previously configured in the deployment.
A solicitation refers to the display of a survey integrated into a website (pop-in, button, bar or pop-under).
An exit intent is a trigger condition for a web deployment that detects when the visitor moves their mouse toward the browser tab area, which is interpreted as an indication that they are about to leave the page or close the tab.
A domain is a unique address used to identify a website. It is an integral part of a URL and consists of two parts : the domain name and the domain extension - ".com", ".fr", etc... - (learn more about domains).
A URL path refers to the part of the URL located after the domain name that indicates the location of a specific page within a site, based on its hierarchical structure. It excludes the parameters and anchors that follow it.
A deployment tag is a script (JavaScript) that needs to be implanted in a website or a tag manager to display an online survey. When the tag is embedded and activated, it ensures that trigger conditions are met, collects data, and loads the survey on the page (learn more about integrating a deployment tag).
A SPA (Single Page Application) is a type of website where the content of a web page is dynamically updated without a complete reload of the page. Unlike traditional pages (Multi-Page Application or MPA), where a simple reload would trigger the script, a SPA requires more advanced event management to ensure that the survey displays correctly when the conditions are met.
The Console is a tool integrated into web browsers that allows executing commands to test scripts, verify data collection and display errors.
A command is an instruction entered into the Console to interact in real-time with the displayed web page. It allows executing various actions, such as verifying JavaScript code, inspecting page elements, or debugging the script.
CSS (Cascading Style Sheets) is a programming language used on the platform to customize the visual display of a survey or web deployment (color, font, alignment, size, etc.). While HTML handles the structure of a web page, CSS controls its visual aesthetic. However, conflicts can arise when the applied CSS rules contradict or overlap with the website's HTML structure, leading to unexpected behavior in the display of page elements (learn more about advanced CSS customization).
The DOM (Document Object Model) is an interface that structures the HTML content of a web page hierarchically, where each element (tags, text, etc.) is identified. Thanks to this structure, the deployment tag can dynamically manipulate the content of the page in real-time, without reloading the page, in order to directly integrate the survey.
The Content Security Policy (CSP) is a security measure that limits the resources that can be loaded on a web page (scripts, images, styles, etc.). It specifies the allowed content sources (internal and external). If an unauthorized source is detected, the browser automatically blocks its loading (learn more about CSP).
Introduction
When integrating surveys on a website, it is common to encounter various display issues that may impact user experience and the effectiveness of feedback collection.
Whether you are facing difficulties related to the appearance of your online survey or its triggering on your website, these problems may result from multiple configurations that might seem trivial. By exploring different hypotheses and their solutions, you will be better prepared to ensure optimal display of your online surveys.
For iFrame deployments, Skeepers only provides a URL link to your survey. You are responsible for implementing this link on your website. If the survey displays correctly via the URL, Skeepers Support cannot assist with integration issues related to this link on your website. We recommend using InPage deployments, which are more modern and can be configured directly on the platform.
Tools
To follow some of the verification steps described in this documentation, specific commands must be executed in your browser's console. If you're not comfortable with this, feel free to ask for support from a local web/IT technical integrator. Web integration expertise may sometimes be necessary to quickly identify blocking elements.
To open the Console, go to the page where your survey should appear, right-click on the page and select "Inspect." Then select the "Console" tab to display it. All commands should be entered in the white box at the bottom of the page:
You can also access your browser's console by pressing F12 (or fn + F12 on some keyboards).
Case 1 : Your web deployment does not appear on your website at all
Your campaign with web deployment shows one of the following display malfunctions :
- The survey does not appear on your website at all
- The survey appears in a test environment but not in a production environment
- The survey appears in the production environment but not in the test environment
If you are experiencing one of the issues mentioned above, we encourage you to check our article Solve an issue with web deployment trigger.
Case 2 : Your web deployment does not display correctly on your website
Your campaign with web deployment shows one of the following display malfunctions :
- The survey does not display on the intended page
- The survey displays on a different page than intended
- The survey displays correctly in a test environment but not in production
- The survey displays correctly in the production environment but not in the test environment
- The survey does not display at the right time on the intended page
If you are experiencing one of the issues mentioned above, we encourage you to check our article Solve an issue with web deployment trigger.
Case 3 : Your web deployment faces layout and design issues on your website
Your campaign with web deployment shows one of the following display malfunctions :
- The survey appears blank upon opening
- The survey appears incorrectly after a specific page
- The survey is disproportionate (stretched, minimized, distorted)
- The visuals and images in the survey are distorted or misaligned
- The design or font of the survey is not displaying correctly
If you are experiencing one of the issues mentioned above, we encourage you to check our article Rectify a design issue in a web deployment.
Glossary of console commands
Command | Usage |
---|---|
document.domain | Allows checking the domain linked to the displayed page |
_Mfb_domain | Allows checking the domain associated with the deployment tag placed on the site |
_Mfb_ud | Allows checking the attributes valued on the page via the deployment tag |
MFB.start() |
Allows evaluating (or reevaluating) the trigger conditions on the page, and triggers the survey if conditions are met |
MFB.deployment_timestamp |
Retrieves the last update date of the deployment tag. After modifications on a web deployment in Skeepers, script refresh is not immediate, taking a few minutes. If the timestamp is recent, the integration is up to date. Otherwise, if it is older than the changes, the update likely has not been applied yet. To convert the timestamp, you need to copy the answer to the command into a timestamp converter (https://www.epochconverter.com/) |
window.document.referrer |
Retrieves the URL of the previous page from which the user navigated to the current page ; the value can be empty if the visitor directly accessed the page or if the previous site did not pass the information for privacy reasons |
navigator.userAgent |
Detects the browser version, platform, and operating system of the site visitor |
localStorage.getItem("mfb.actor.beta.s.nbp") |
Checks the number of pages visited and counted on the domain during the session |
JSON.parse(localStorage.getItem("mfb.actor.beta.s.pagesVisited")); |
Retrieves the details of the visited URL paths and the number of visits for each path during the session |
window.location.pathname |
Checks the URL path of the current page |
parsedData = JSON.parse(localStorage.getItem('mfb.actor.beta.pagesHistory')).visitedPages; Object.keys(parsedData).forEach(k = { parsedData[k].time = new Date(parsedData[k].time); });parsedData |
Retrieves the details of visited URL paths, the number of visits for each path and the timestamp of each visit based on history |
new Date(localStorage.getItem("mfb.actor.beta.s.startDateTimeOnSite")*1) |
Checks the timestamp for the start of the current session on the site |
parsedData = JSON.parse(localStorage.getItem('mfb.actor.beta.pagesHistory')).visitedPages; new Date(parsedData.at(-1).time) |
Checks the timestamp for the start of the current session on the page |
parsedData = JSON.parse(localStorage.getItem('mfb.actor.beta.campaignVisits')); Object.keys(parsedData).forEach(k = { parsedData[k] = new Date(parsedData[k]); });parsedData |
Retrieves the timestamps for requests related to campaign displays, with details by ID |
parsedData = JSON.parse(localStorage.getItem('mfb.actor.beta.deploymentVisits')); Object.keys(parsedData).forEach(k = { parsedData[k] = new Date(parsedData[k]); });parsedData |
Retrieves the timestamps for requests related to deployment displays, with details by ID |
Unable to resolve your issue ?
After consulting and following our documentation, contact us via the Contact Icon available in the left-hand sidebar of the platform.
Before contacting us, please check the following and attach the requested screenshots :
-
The exact URL where your web deployment survey is supposed to appear
- The URL where you conducted your display tests (if different from the previous point)
- Specify whether the URL is accessible to Skeepers teams. If possible, make arrangements to provide us access.
- The name of your deployment in the Skeepers platform, along with its direct access link
-
A screenshot of the console after entering the command "_Mfb_ud"
-
A screenshot of the console after entering the command "_Mfb_domain"
-
A screenshot of the console after entering the command "MFB.start()"
If you have a time-based condition, wait for the necessary time before taking the screenshot of MFB.start(). For example, if you need to wait 5 seconds, run MFB.start() and wait the 5 seconds before taking the screenshot.
Without all of these elements, we will not be able to perform a complete analysis of your issue.
After submitting your request, please do not make any changes to your web deployment. This will allow the Skeepers teams to carry out the necessary investigations to resolve your issue.
If this instruction is not followed, our conclusions may not be reliable, as they may not reflect the actual state of the deployment.
When taking screenshots, be sure to include all elements by capturing the entire page, the navigation bar with the visible URL, as well as the entire console with all values displayed. This will provide us with all the necessary information for a thorough analysis.
Also, do not forget to click the arrow to the left of the command answer to expand it and display all elements.
If you have any questions, feel free to contact our Customer Care team.