Location Bias Component Text Customizations

Hey Team!

My client has asked to change the language in the location bias compenent to be very specific.
It currently says:

" Red Bank, New Jersey, United States of America (based on your internet address) | Change"

And they would ideally like it to say:

You’re in Red Bank, New Jersey | Change” (they even had a tiny map pin at the front)

Based on the Answers README it seems we are limited in the way we can update this text - we have these three fields:

ipAccuracyHelpText: 'based on your internet address',
deviceAccuracyHelpText: 'based on your device',
updateLocationButtonText: 'Update your location',

Is there any way to create the desired text above by moving around these components? Perhaps with CSS? Let me know what you think!

Hey Jessie,

I think it would be possible to do this using just the LocationBias component’s configuration. First, set those three fields listed above to just be “”. That will prevent the SDK from displaying something like “(based on your internet address)”. The bolded string is computed internally in the SDK. This is the display name of their location. You can modify this display name by providing a transformData function to the LocationBias component:

answers-search-ui/README.md at master · yext/answers-search-ui · GitHub.

This might be a bit advanced since it will require writing some Javascript. Here’s what the transformData function might look like:

transformData: (data) => {
// Somehow strip country from data.locationDisplayName
data.locationDisplayName = "You’re in " + data.locationDisplayName;
return data;
}