Unique Anchor URLs

For anyone that hasn't figured it out already, Wix doesn't offer unique anchor URLs by default. That means you have to get your hands dirty with Corvid.

Step 1. Enable Corvid

Step 2. Assign your anchors the names you will use in your code.

For our example I've given them the names ♯id-1 and ♯id-2.

Step 3. Write your code.

import wixWindow from 'wix-window'; 
  
//imports the necessary wixWindow data 

import wixLocation from 'wix-location'; 
 
//imports the necessary wixLocation data

$w.onReady(function () {
let query = wixLocation.query;    
                
//this lets us use the query parameter ? in our URL

if (query.hasOwnProperty("point")) {  
     
/*we create the query suffix "point".  
You can change this to whatever you want -no special characters. */

switch (query.point) { 
case "♯id-1":                    
/*this creates the query of  "♯id-1", which creates the anchor URL.  As I stated earlier, you will use the names of your anchors instead of "♯id-1"  */

wixWindow.scrollTo(0, 550);  
            
/*(0,550) refers to the pixel that will be in the top left corner of the screen (inside the gridlines) */

break;
case "♯id-2":
wixWindow.scrollTo(0, 1880);
break;
default:
}
}
$w('#button1').onClick(function() {
wixLocation.to("https://heathh-m.wixsite.com/unique-anchor-urls/v1?point=♯id-1");  
});
    
/*redirect the user to the specified URL (this has the unfortunate effect of reloading the page, but if we just use "/v1?point=♯id-1" it changes the URL but doesn't navigate to the anchor)*/
    
$w('#button2').onClick(function() {
wixLocation.to("https://heathh-m.wixsite.com/unique-anchor-urls/v1?point=♯id-2");
});
});