“3rd party cookies” blocked notification

Notify your customers they are blocking cookies and direct them to enable it.

*Note – instructional links lead to pages made by Rebillia’s team. You can create pages of your own and change the “href” value.

Coding Skills Required!


BluePrint:

Go to “Storefront Design” –> “More” –> “Template Files”.

Search for “checkout_express.html” file, click on the ‘…’ button and “Edit”.

When in the design mode page, enter the following code under the <div class=”main”> tag:

<link href=”https://fonts.googleapis.com/icon?family=Material+Icons” rel=”stylesheet”><script>var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(‘ OPR/’) >= 0;var isFirefox = typeof InstallTrigger !== ‘undefined’;var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === “[object SafariRemoteNotification]”; })(!window[‘safari’] || safari.pushNotification);var isIE = /*@cc_on!@*/false || !!document.documentMode;var isEdge = !isIE && !!window.StyleMedia;var isChrome = !!window.chrome && !!window.chrome.webstore;if(isOpera){var a = 0;} else if(isFirefox){var linker = “https://www.rebillia.com/enable-cookies-firefox/”;} else if(isSafari){var linker = “https://www.rebillia.com/enable-cookies-safari/”;} else if(isIE){var linker = “https://www.rebillia.com/enable-cookies-internet-explorer/”;} else if(isEdge){var linker = “https://www.rebillia.com/enable-cookies-edge/”;} else if(isChrome){var linker = “https://www.rebillia.com/enable-cookies-chrome/”;} else{var linker = “https://www.rebillia.com/enable-cookies-mobile/”;}var receiveMessage = function (evt) {if (evt.data === ‘MM:3PCunsupported’) {document.getElementById(‘cookieCheck’).style.display = ‘block’;document.getElementById(‘browser’).href= linker;} else if (evt.data === ‘MM:3PCsupported’) {document.getElementById(‘result’).innerHTML = ‘supported’;}};window.addEventListener(“message”, receiveMessage, false);</script>

And the following code above the %%Panel.WrapperBanner%% tag:

<div id=”cookieCheck” style=”display:none; border:1px solid #eee; padding:20px; background-color:aliceblue; margin-bottom:20px; overflow:hidden;”>

<div style=”width:10%; float:left; text-align:center;”><i class=”material-icons”>&#xe85a;</i></div>

<div style=”width:90%; float:left;”>To enjoy our most personalized shopping experience, you need to enable 3rd party cookies on your browser. Follow your browser’s instructions <a id=”browser” target=”_blank”>here</a>.</div>

<iframe src=”https://mindmup.github.io/3rdpartycookiecheck/start.html” style=”display:none”></iframe>

</div>

Stencil:

Go to “Advanced Settings” –> “Checkout” –> Select the “Custom one-page checkout (for developers)” and click “Save” on the bottom-right.

Go to “Storefront Design” –> “More” –> “Template Files”.

Search for “checkout_express.html” file, click on the ‘…’ button and “Edit”.

When in the design mode page, enter the following code under the <div class=”main”> tag:

<link href=“https://fonts.googleapis.com/icon?family=Material+Icons” rel=“stylesheet”><script>var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(‘ OPR/’) >= 0;var isFirefox = typeof InstallTrigger !== ‘undefined’;var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === “[object SafariRemoteNotification]”; })(!window[‘safari’] || safari.pushNotification);var isIE = /*@cc_on!@*/false || !!document.documentMode;var isEdge = !isIE && !!window.StyleMedia;var isChrome = !!window.chrome && !!window.chrome.webstore;if(isOpera){var a = 0;} else if(isFirefox){var linker = “https://www.rebillia.com/enable-cookies-firefox/”;} else if(isSafari){var linker = “https://www.rebillia.com/enable-cookies-safari/”;} else if(isIE){var linker = “https://www.rebillia.com/enable-cookies-internet-explorer/”;} else if(isEdge){var linker = “https://www.rebillia.com/enable-cookies-edge/”;} else if(isChrome){var linker = “https://www.rebillia.com/enable-cookies-chrome/”;} else{var linker = “https://www.rebillia.com/enable-cookies-mobile/”;}var receiveMessage = function (evt) {if (evt.data === ‘MM:3PCunsupported’) {document.getElementById(‘cookieCheck’).style.display = ‘block’;document.getElementById(‘browser’).href= linker;} else if (evt.data === ‘MM:3PCsupported’) {document.getElementById(‘result’).innerHTML = ‘supported’;}};window.addEventListener(“message”, receiveMessage, false);</script>

And the following code above the %%Panel.WrapperBanner%% tag:

<div id=“cookieCheck” style=“display:none; border:1px solid #eee; padding:20px; background-color:aliceblue; margin-top:30px; overflow:hidden;”>
<div style=“width:10%; float:left; text-align:center;”><i class=“material-icons”>&#xe85a;</i></div>
<div style=“width:90%; float:left;”>To enjoy our most personalized shopping experience, you need to enable 3rd party cookies on your browser. Follow your browser’s instructions <a id=“browser” target=“_blank”>here</a>.</div>
<iframe src=“https://mindmup.github.io/3rdpartycookiecheck/start.html” style=“display:none”></iframe>
</div>