How to create a back button on the site
Hi,
Can you please clarify what is the use case? What are you trying to achieve?
It should be normal a back button allows user to navigate to a previously viewed page.
Hi Rishabh,
Calling wixWindow.referrer will provide you with the previous page url.
Please note that it is currently not working as expected and will return null on certain conditions.
We are working to solve this issue.
Hey Ido can you please help me create a ābackā button?
Redirecting to the referer is not a back button in terms of āundoā or if your page include a few logical steps. Back button is not a trivial task
So I reckon the code for it is
import wixLocation from 'wix-location';
import wixWindow from 'wix-window';
export function backbutton1_click(event, $w) {
let url = wixWindow.referrer
wixLocation.to(url)
}
This seems to be broken. it works sometimes on some browsers and then not on others. I just tested on chrome version 67.0.3396.99 (Official Build) (64-bit) on my Win 7 x64 machine and it seems to work, the same version on Win 10 did not. Then I tested on Firefox 61.0.1 (64-bit) on Win 7 x64 machine and it did not work there either. See this original page and then the back button for this is going to be for the price of $18.75 in the middle (top left blue square in the repeater grid in the blue area, middle of this page) on the order now destination page, which goes to this page.
Hi,
Should the issue persists, please post a new thread and clarify what you would like to achieve.
Thanks,
Tal.
A possible solution (although little tricky) could be:
- Create 2 Text Boxes (name them like: ātbPathā and ātbPathPrevā) and shift them into your site footer (to make them āSite globalā) and set their properties to ānot visibleā (since only to be used as kind of āglobalā memory)
- On your Site Code add:
import wixLocation from 'wix-location';
$w.onReady(function () {
let path = wixLocation.path[0];
let prevPath = $w("#tbPath").text;
$w("#tbPathPrev").text = prevPath;
$w("#tbPath").text = path;
});
The previous code will execute each time you go to a page.
- Where ever you want to have a āgo backā functionality: create a button and attach similar to the following code to its āOnClickā event:
import wixLocation from 'wix-location';
export function vectorImageGoBack_click(event, $w) {
let prevPage = "/" + $w('#tbPathPrev').text;
wixLocation.to(prevPage);
}
Note:
The needed āSite globalā data could also be placed in Cookies (instead of in āinvisible Text Boxesā), but then the solution gets more environment/system dependent (i.e. āCookies enabled/disabledā).
Iām new to Wix and I liked how easy it was, but I mustr say Iām very suprised and a bit dissapointed that there is not any built in functionality for a simple thing like a back button.
1 Like
It says in the post; It should be normal a back button allows user to navigate to a previously viewed page. What needs to be clarified?
Iāve tried both examples and none of them worked in any of the browsers I tested (Vivaldi, Chrome, Internet Explorer and Opera).
Iāve tried both examples and none of them worked in any of the browsers I tested (Vivaldi, Chrome, Internet Explorer and Opera).
Hereās a simple Back Button Example .
Itās really very simple to do, and allows much more flexibility. See the example I posted below.
@cihlen See the example I posted below.
Hi Yisrael, can not load template from your linkā¦ can you help please? I need back button on my site. Thanks !
@oleksiisologub Itās working fine for me. Are you logged into you Wix account?
Works fine for me, but I have to enable the Corvid manually. Then, it shows this code in Site:
import wixWindow from 'wix-window';
import {session} from 'wix-storage';
import wixLocation from 'wix-location';
let previousPageURL;
$w.onReady(function () {
previousPageURL = session.getItem("page");
console.log(previousPageURL);
session.setItem("page", wixLocation.url);
$w("#btnBack").link = previousPageURL;
$w("#btnBack").target = "_self";
});
Where #btnBack is the back button of course.
1 Like
Worked perfectly for me. Thanks!