External URL to Anchor Or Wix Code Workaround?

Ask the community
,
7

Hello, friends!

Just in case this topic is still relevant (because it indeed IS for me). I’ve found a workaround that was sufficient enough.

1) You’ll need WixCode so switch it on.

2) For some weird reason adding a hashtag to the end of your URL (i.e.: https://mySite.com#myAnchor) will mess with Wix router (I can’t be bothered figuring out this ridiculous behaviour) so just don’t use hashtags on your Wix site I guess. Also, adding a hashtag to my website link makes my main menu disappear… By the way, you can STILL access the hashtag, even though it gets “eaten” by the router I assume:

wixLocation.hash; //returns URL hash string (with "#" character)
  1. Add some reasonable “query” parameters to your URL (i.e.: https://mySite.com?a=services), the value of “a” parameter will indicate an anchor on your page (you may replace “a” with any variable name that is URI-valid). Now you can access query parameters via:
wixLocation.query; //returns array of query parameters
  1. Here comes another “pleasant surprise” from Wix. For some incomprehensible reason the following code:
$w("#myAnchorId").scrollTo().then(() => {
    console.log("Done with scroll");
});

doesn’t scroll me anywhere. No matter if I use my Anchor ID or any ID of any visible element on the page - the promise (returned by “scrollTo”) gets resolved, but no scroll happens whatsoever. So this approach failed for me also. Throw it into a rubbish bin.

  1. WixCode is “so liberating” that I can’t even get the positioning of a page element! So in the end I became “a bit upset” and brute-forced it via:
let isMobile = (wixWindow.formFactor === "Mobile"); //this helps us determine if we're in mobile version

wixWindow.scrollTo(0, (isMobile ? 400 : 600)); //the second parameter being the Y coordinate (in pixels) of the page, also since the page height is different we need two values; in this case it's 400 for mobile and 600 for web

which is just plain stupid and quite an inflexible approach, but I honestly couldn’t do better. I tried…

  1. So, at the end of the day, the more I use Wix, the more my first “wow”-impression fades away. I’ve got at least 3 MAJOR complaints which really force me to consider solutions other than Wix. Maybe that’s the business model: “Get subscriptions money for a year, a chunk of users will submit and conform anyways, then we’ll get a bunch of new ganders that will swallow the shiny bait. Repeat the cycle. Profit”. Here’s my result code anyways:
import wixWindow from 'wix-window';
import wixLocation from 'wix-location';

$w.onReady(function(){ //this function runs after the page is loaded and is SLOW. Any reasonable Wix Page is SLOW AS HELL because there is A TON of unnecessary JavaScript code! Sorry... went on a rant again
    let query = wixLocation.query;
    let isMobile = (wixWindow.formFactor === "Mobile");

    if (query.hasOwnProperty("a")) { //this line checks the presence of "a" query parameter, you may need to use some other name
        switch (query.a) { //this accesses the query parameter "a", change the name according to your needs
            case "services": //you go here if your URL is "https://mySite.com?a=services"
                wixWindow.scrollTo(0, (isMobile ? 400 : 600)); //you can get the Y value by left-clicking on an anchor you have on your page and look at the "Position Y" parameter on the "editor panel" on the right
                break;
            case "about": //other cases are similar, this is for "https://mySite.com?a=about"
                wixWindow.scrollTo(0, (isMobile ? 800 : 1200));
                break;
            default:
                //do nothing
        }
    }
});

Hope this helps any of you, friends! Best regards