we have a domestic violence client that has asked for ‘leave this site’ button. This is common on many DV support sites (example is https://safelives.org.uk/ This can be site wide too where clicking the button/banner, will open a net tab with a fixed address (e.e.g weather.com)) and return the existing (current) window to /home or google.com but disable the ‘back’ button on that tab too. this would remove any trace of the site for those in a vulnerable situation. This is a very important requirement. Any thoughts? I’ve seen JS and HTML/CSS code online, but when I tried these, they do not work on VELO

I think I’ve got something that even works on Chrome (as well as Firefox and Safari). This is what you’ve got to do (take a deep breath)… ● Create a Custom Element on your site as described in Velo About Custom Elements . ● When you S et the Location of the JavaScript File , rename the file to leave-button.js. ● Add the following code to the leave-button.js file: const template = document.createElement('template'); template.innerHTML = ` .container { padding: 8px; } button { display: block; overflow: hidden; position: relative; padding: 0 16px; font-size: 16px; font-weight: bold; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; outline: none; width: 100%; height: 40px; box-sizing: border-box; border: 1px solid #a1a1a1; background: #ffffff; box-shadow: 0 2px 4px 0 rgba(0,0,0, 0.05), 0 2px 8px 0 rgba(161,161,161, 0.4); color: #363636; cursor: pointer; } Leave this site `; class LeaveButton extends HTMLElement { constructor() { super(); this._shadowRoot = this.attachShadow({ mode: 'open' }); this._shadowRoot.appendChild(template.content.cloneNode(true)); this.$button = this._shadowRoot.querySelector('button'); this.$button.addEventListener('click', () => { window.open("https://www.yahoo.com", "_newtab"); // open new tab and switch to it. window.location.replace("https://www.google.com"); // load the another site in the current tab. }); } connectedCallback() { if (this.hasAttribute('as-atom')) { this.$container.style.padding = '0px'; } } get label() { return this.getAttribute('label'); } set label(value) { this.setAttribute('label', value); } static get observedAttributes() { return ['label']; } attributeChangedCallback(name, oldVal, newVal) { this.render(); } render() { this.$button.innerHTML = this.label; } } window.customElements.define('leave-button', LeaveButton); ● Set the Element Setting like this: [image] ● Save and Publish the site. This will only work on a Live site, not Preview. A Custom Element will only work on a Premium site with a domain attached (which is what you have). ● Click on the Leave this site button and you should get a new tab with another website, and the original tab will be redirected to yet another site. If all works as expected (and as worked for me), the browser’s back button will end up going nowhere. I tried this on Safari, Firefox, and Chrome. It worked for me. Your mileage may vary. I need a beer.

Leave a site = Log-Out Take a look into VELO-API-DOSs and search for -->Wix-Users (log-out)

Thanks but that’s not what I’ve been looking for. that logs a user out of their session. I need the browser/tab to default to /HOME, disable dhte ‘back button’ and open a new tab. Just like the reference I gave ( https://safelives.org.uk/ ). look at the bottom of the page- (leave this site)

@mims You may be able to create this functionality using a Custom Element. This article will help you get started: https://support.wix.com/en/article/velo-about-custom-elements

Please observe the community guidelines and refrain from multiple posts on the same topic or question. In any case, you can create a simple “leave this site” button like this… Design your footer with the color and text that you want - I like grey. Then set “freeze position”. [image] To prevent the browser’s back button from being used, I added an HtmlComponent to the footer that has the following code: window.onmessage = (event) => { if (event.data) { let receivedData = event.data; if(receivedData === 'flush') { history.pushState(null, document.title, location.href); history.back(); history.forward(); window.onpopstate = function () { history.go(1); }; } } }; This code is called from the page by sending a message to the HtmlComponent. Then, your masterPage.js onReady() code should look like this: import wixLocation from 'wix-location'; $w.onReady(function () { // Write your code here $w("#footer1").onClick((event) => { $w("#html1").postMessage("flush"); // send message to HtmlComponent wixLocation.to('https://www.wix.com'); // go to another site }); }); This code first “flushes” the browser history to prevent someone from returning to the site by hitting the browser’s back button. It then redirects to another website (I’m using wix.com for the example). If your site has a login, then you can also add a logout() before the redirect, to make sure the site visitor has “completely left” the site.

Thank you for the advice. I’ll give this a go and apologies for posting twice. I wasn’t sure the first actually went through but this is amazing that you found a solution to it. This is why we love WIX!

hi Yisrael. Almost there. Just a couple of points please. 1 - In the advanced page, under custom code, only head and body exist. so how did you add code to the footer please? I cannot embed HTML snippet to the footer. Seem the footer is locked! 2 - the html1 element does not exist on my page. What does this refer to on your page please? I cannot find anything for html except the htmlmenu (1 and 2) that are there. Not sure what this bit is for. thanks Mims

@mims I didn’t add the HTML snippet to the custom code blocks (under custom code). I added an HtmlComponent to the Footer right in the site editor. Add the Embed a Widget element: [image] After adding the HtmlComponent, move it into the Footer, and then add the HTML code as shown. [image] Don’t worry about html1 or html2 . Add an HtmlComponent, and then whatever element Id the Editor assigns, use that Id in the page code.

@yisrael-wix Thank you! I figured how to put the HTML in the footer (sorry, schoolboy error). Code is redirecting now but not disabling the ‘back button’, i.e. flushing. Is yours working properly? al-hasaniya.org.uk … code is identical except I’m using button32 instead of footer1

@mims Mine works as I constructed it - using only the Footer to click on. I see the button on your Live site, but I don’t see it in the Editor. [image]

@mims Well, one problem I see is that it works on Safari, but it doesn’t work on Chrome. Seems that there are some browser compatibility issues. Sorry, this may be a problem finding a way to adapt to all browsers. I’ll see what I can find, but I would suggest that you also try to find a more “compatible” script than what I found.

How to create a 'leave site' button?

Ask the community

Topic		Replies	Views
Coding Exit Now/Escape this Site Feature for Non-profit Ask the community code , question	11	716	November 11, 2024
How do I create a "leave site" button? Ask the community code , question	1	42	June 13, 2025
Quick escape button Ask the community code , other-functionality , question	2	238	November 11, 2024
How I Triggered the Native Wix Cookie Settings Panel from a Custom Footer Link in Wix Studio Show and tell wix-studio , code	0	55	May 20, 2026
How to use referrer on a button in Velo Ask the community code , question	16	278	May 11, 2024

How to create a 'leave site' button?

Related topics