Creating a pop-up notification is possible by using a JavaScript code.
This can be done easily via a script assistant or even an AI bot that can generate a script tailored to your needs to set up the pop-up notification on your website.
The generated JavaScript can be saved in your CMS so that the notification appears whenever your webshop is loaded.
You can set up the JavaScript code for the pop-up notification as follows:
Go to CMS > Core-Portal Basic > Settings > Start Page
On the right side, in the 4th line from the top, you will see the section: Include JavaScript Code
Paste the script you created here.
After clicking Save, the pop-up notification will be visible on your website.
Below is an example of a pop-up notification and its corresponding code. This code creates a pop-up in the center of your screen with a title, message, link, and close button. The script also ensures that the pop-up is shown only once per session.
Example of a script:
window.onload = function () { if (sessionStorage.getItem("popupShown")) return; const popup = document.createElement("div"); popup.style.position = "fixed"; popup.style.top = "50%"; popup.style.left = "50%"; popup.style.transform = "translate(-50%, -50%)"; popup.style.background = "#334d3d"; popup.style.padding = "30px"; popup.style.borderRadius = "16px"; popup.style.boxShadow = "0 10px 30px rgba(0, 0, 0, 0.2)"; popup.style.textAlign = "center"; popup.style.zIndex = "1000"; popup.style.maxWidth = "400px"; popup.style.width = "80%"; popup.style.fontFamily = "Arial, sans-serif"; popup.style.animation = "fadeIn 0.5s ease"; const styleSheet = document.createElement("style"); styleSheet.innerHTML = ` @keyframes fadeIn { from { opacity: 0; transform: scale(0.95) translate(-50%, -50%); } to { opacity: 1; transform: scale(1) translate(-50%, -50%); } } `; document.head.appendChild(styleSheet); const headline = document.createElement("h2"); headline.innerText = "✨ Ontdek onze nieuwste sieradenlijn! ✨ "; headline.style.color = "#c3d6c2"; headline.style.marginBottom = "10px"; const message = document.createElement("p"); message.innerText = "Verwen jezelf met een welkomstcadeau bij je eerste bestelling!"; message.style.fontSize = "16px"; message.style.color = "#96ac91"; message.style.marginBottom = "20px"; const link = document.createElement("a"); link.href = "https://commerce.orisha.com/nl/optimizers/"; link.innerText = "Maak een afspraak in onze showroom"; link.target = "_blank"; link.style.color = "#96ac91"; link.style.fontWeight = "bold"; link.style.textDecoration = "underline"; link.style.display = "block"; link.style.marginBottom = "20px"; const closeButton = document.createElement("button"); closeButton.innerText = "Sluiten"; closeButton.style.background = "#96ac91"; closeButton.style.color = "#334d3d"; closeButton.style.border = "none"; closeButton.style.padding = "10px 20px"; closeButton.style.borderRadius = "25px"; closeButton.style.cursor = "pointer"; closeButton.style.fontSize = "14px"; closeButton.onclick = function () { document.body.removeChild(popup); }; popup.appendChild(headline); popup.appendChild(message); popup.appendChild(link); popup.appendChild(closeButton); document.body.appendChild(popup); sessionStorage.setItem("popupShown","true"); };