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.listingUrl 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.listingUrl field while setting up your CTA link this way:
href={`${getDirections(
profile.address,
profile.ref_listings.listingUrl,
profile.googlePlaceId
)}`}
Afterwards you will need to add ref_listings.listingUrl 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!