201 reads

Velo How-To: On SEO For Router Pages

by Velo by WixMay 26th, 2021

Too Long; Didn't Read

You can define the page title, description, and social network images for router pages just like you can for regular pages. Since router pages do not contain static data, their SEO information must be set dynamically. There are two parts to setting up SEO on your router pages: Creating a sitemap for Google to use to find your pages. Each page includes information about a page, such as its URL, title, name, and name. You can also add additional information about each page such as how often its content changes.

Companies Mentioned

featured image - Velo How-To: On SEO For Router Pages

SEO Settings for router pages vary slightly from the settings for regular pages. Learn about SEO for Wix pages here.

You can define the page title, description, and social network images for router pages just like you can for regular pages. The difference is that since router pages do not contain static data, their SEO information must be set dynamically, so they reflect the real content they will hold when they are viewed.

There are two parts to setting up SEO on your router pages:

Create meta tags for Google to learn about your pages.
Create a sitemap for Google to use to find your pages.

Meta Tags

You set SEO meta tags for your router's pages when you create the router's router() function. Within that function, you create a HeadOptions object and pass it to the page you route to using the ok() function.

For example, in the sample code that is provided when you add a router, the following code uses the data retrieved by the router to build a HeadOptions object and pass it to the page named myRouter-page.

export function myRouter_Router(request) {

  // retrieve data for the page ...
    
  let seoData = { 
    title: data.title, 
    description: "This is a description of " + data.title + " page",
    noIndex: false,
    metaTags: {
      "og:title": data.title,
      "og:image": data.image
    }
  };
       
  return ok("myRouter-page", data, seoData); 
    
  //...
}

The

HeadOptions

object contains several properties that you can set with relevant values using the data you retrieve in your

router()

function. The

title

and

description

properties contain the page's title and description that are used for SEO purposes. The object can also contain a

noIndex

flag that tells Google whether it should index your page. Additional meta tags can be added to the

metaTags

property.

The

HeadOptions

object can also contain a keywords property, but Google ignores your site's keywords.

Sitemap

Your site's sitemap is what Google uses to find all your site's pages. Pages on your site that don't belong to a router are added to your site's sitemap for you. However, since you fully control what pages are available through your router, including all of their dynamically different versions, you need to create a sitemap that contains all possible URLs that are connected to your router's prefix so Google can find them.

To add your router's pages to your site's sitemap, you create a sitemap() function for the router. Within that function, you create a WixRouterSitemapEntry object for each URL the router can possibly route to. Each

WixRouterSitemapEntry

includes information about a page, such as its URL, title, and name. You can also add additional information about each page, such as how often its content changes, when the last change was, and its relative priority within your site. Google uses the sitemap entries to discover all the pages in your site.

For example, in the sample code that is provided when you add a router, the following code uses the data retrieved by the router to build a

HeadOptions

object and pass it to the page named myRouter-page.

export function myRouter_SiteMap(sitemapRequest) {

  //Convert the data to site map entries
  let siteMapEntries = Object.keys(peopleData).map( (name) => {
    const data= peopleData[name];
    let entry = new WixRouterSitemapEntry(name);
    entry.pageName = "myRouter-page";
    entry.url = "/myRouter/" + name ;
    entry.title = data.title;
    return entry;
  } );

  // Wrap in asynchronic Promise
  return Promise.resolve(siteMapEntries);
}

To ensure that your sitemap is working properly, you can get the sitemap from your published site. In a web browser, go to your published site's URL and append /sitemap.xml to it.

For example, for premium sites, if your site's published URL is: https://mysite.com

Go to: https://mysite.com/sitemap.xml

For free sites, if your site's published URL is: https://username.wixsite.com/site-name

Go to: https://username.wixsite.com/site-name/sitemap.xml

Previously published at https://support.wix.com/en/article/velo-about-seo-and-routing