Step-by-Step Instructions:
Step 1: Insert JavaScript Code
First, we'll start by adding a small piece of JavaScript code to your website. Don't worry, it's simpler than it sounds. Just copy and paste the code below into the <head>
section of your website's HTML. This is usually done in the header file or template of your site.
<script>
const MACORVA_SURVEY_URL = '';
const showMacorvaSurvey = () => {
const [modalBody, survey] = createMacorvaModal();
survey.src = MACORVA_SURVEY_URL;
modalBody.appendChild(survey);
};
const createMacorvaModal = () => {
const modal = document.createElement('div');
const modalBody = document.createElement('div');
const modalClose = document.createElement('button');
const survey = document.createElement('iframe');
modal.classList.add('macorva-modal');
modalBody.classList.add('macorva-modal-body');
modalClose.classList.add('macorva-modal-close');
survey.classList.add('macorva-survey');
modalClose.innerText = '✕';
modalBody.appendChild(modalClose);
modal.appendChild(modalBody);
modal.addEventListener('click', (event) => {
if (!modalBody.contains(event.target)) {
document.body.removeChild(modal);
}
});
modalClose.addEventListener('click', () => {
document.body.removeChild(modal);
});
document.body.appendChild(modal);
return [modalBody, survey];
};
</script>
Step 2: Fill in Your Details
Next, replace MACORVA_SURVEY_URL
with the static link to the preferred Macorva survey
Step 3: Add Custom Styles with CSS
To make the survey button look good and fit seamlessly with your site, you'll need to add some styling. Just like with the JavaScript, simply copy the CSS code below and paste it into the <head>
section of your HTML. Then you can enter your customization to help the button fit your company branding. This will style the survey modal and button to make it visually appealing.
Step 4: Place the Survey Button
Finally, decide where you want the survey button on your page. Once you've chosen the perfect spot, paste the following HTML code there. This creates a clickable button that users can press to open the survey.
And that's it!
You've successfully integrated a Macorva survey into your website. This simple yet effective tool will help you gather valuable customer feedback with ease.
Remember, you don’t have to do this alone. If you're managing a technical team, share these instructions with them, and they'll know exactly what to do. If you encounter any issues or need assistance, don’t hesitate to reach out to Macorva's support team. We’re here to help you every step of the way in enhancing your customer engagement.