Referral page URL query Rule not working with Search UI React

I just added a new query rule to my search config where I want to boost entity results based on a URL regex:

    {
      "criteria": {
        "referrerPageURLRegex": "/wine/red-wine"
      },
      "actions": [
        {
          "actionType": "BOOST_ENTITIES",
          "entityIds": [
            "wine_161"
          ],
          "verticalKey": "beverages"
        }
      ],
      "name": "Demo Red Wines"
    }

When I go to this page in my Yext pages project where I am using the Search UI React library, I don’t see the entity being boosted in the results. What am I doing wrong?

Hi Aaron,

This is a great question!

The problem is that the referralPageUrl param is not being set in the Vertical Query API request. To accomplish this with the Search UI React Library, you can add the following code:

import { useSearchActions } from "@yext/search-headless-react";
import { useEffect } from "react";
// other imports and code
function YourComponent = () => {
  const searchActions = useSearchActions();
  useEffect(() => {
    searchActions.setReferrerPageUrl(window.location.pathname);
  }, []);
  // other code
};

The searchActions.setReferrerPageUrl function will set the referrerPageUrl search query parameter with the path name of the current page. This should trigger your query rule.

1 Like