Passing Listings through Get Directions/Map Components where applicable

Pages
1

If a client has Listings, it’s best practice to use the Content-supplied Listings URLs (ref_listings.listingUrl) to populate any Get Directions CTAs on Pages. This allows for us to link Get Directions CTAs directly to the entity Google listing for a better user experience.
(deep linking enabled vs. no deep linking enabled)

To implement the ref_listings field on React, make sure you import getDirections from @yext/pages/components in the component file that has the Get Directions CTA. Then reference the ref_listings field while setting up your CTA link this way:

href={`${getDirections(
            profile.address,
            profile.ref_listings,
            profile.googlePlaceId
          )}`}

Afterwards you will need to add ref_listings to the corresponding template config’s stream.fields array. Deploy your updates and see your Get Directions CTAs link directly to your entity’s Google Listing!