Configure the Query String Personalizer App

Follow

Beta Feature Advisory

This article is about an Uberflip Marketplace app that is currently in beta. Like all beta software, this app is provided "as-is" and may contain bugs or may otherwise not work as expected. 

If you would like to try this app and provide feedback to help us improve it, please contact your Customer Success Manager (or Uberflip Support) to request an invitation to the beta program.

 

Before You Begin

  • This app uses query strings to personalize Streams, so you must share Stream URLs that contain query strings (and appropriate values) for it to work. The app will still work on Streams accessed without a URL containing query string values, but will only display default values in this case (provided you have defined default values).
  • On any Hub where you want to use this app, you must enable the setting Include Item tags for Custom Code. You can find this setting under Hubs > Hub Options > Advanced > Content Experience. To enable, check the box next to Include Item tags for Custom Code.

 

About The App

This app personalizes selected Streams using query string values from the URLs used to share those Streams. It can:

  • Dynamically filter a Stream to only show Items that match query string values contained in the Stream’s URL (using tags)
  • Automatically populate a visitor’s organization logo on Streams that use the Banner+Logo template (if the organization is specified in the query string)
  • Automatically insert query string values from the URL used by the visitor into variables placed in Hub text: titles, descriptions, body text, CTAs, etc.

 

Configure App Settings

You configure settings for this app at the Hub level, which means that your settings will apply to the current Hub only.  If you have multiple Hubs, you must configure this app separately for each Hub.

To configure settings for this app, go to Hubs > Integrations > Apps tab. On this tab, open the app's settings by hovering your mouse over the app, then clicking on the Edit (pencil) button.

You can configure the following settings for this app: 

Stream IDs

Required Use this field to specify the Streams that this app will personalize. To add a Stream, type in its Stream ID. Add multiple Streams by separating Stream IDs with commas.

To find a Stream ID, go to Hubs > Content > Streams tab, click on the Stream, then click on the Metadata tab. The Stream’s Stream ID is listed near the bottom.

Filter Items by Tags

Optional Turn on this setting to filter the specified Stream(s) so that only Items matching a specific tag are displayed. The tags to be matched are dynamically defined based on query string values present in the URL used to access the Stream. For example, if the URL contains the query string ?industry=healthcare, then turning on this option will only return Items that carry the Healthcare tag.

The app will attempt to find matches for any of the tags defined by present query strings. If any matches are found, only the Items matching the tag(s) are displayed, down to a minimum of one Item. If no matches can be found, the full Stream is displayed (all Items).

To use this option, you must add tags to your Items in the following format:

querystring.[field].[value]

Replace [field] with the Demandbase attribute, and [value]with the attribute’s desired value. For example, the tag querystring.industry.healthcare would indicate that the tagged Item should be displayed if the URL contains the query string ?industry=healthcare, and would therefore be applied to Items relevant to that topic.

Note that field names and values in tag names must match values in query strings exactly: any spaces, parentheses, etc. that exist in the query string must also exist in the tag.

Note

This app filters not just Items on the main Stream page, but also the additional Items displayed when viewing an Item in that Stream. While viewing an Item, the Next/Previous Item area and the Other Content in This Stream carousel will be filtered in the same way as the main Stream page:

  • For the carousel, filtered Items will take priority, and any additional free slots in the carousel (after all filtered Items have been displayed) will be filled with non-filtered Items from the same Stream
  • If no next or previous filtered Item is available, the Next/Previous Item area will be hidden

Previous Item Navigation Label

Optional Use this setting to specify a custom label for the Previous Item area while viewing an Item. If you do not specify anything here, the default label ("Previous Item") will be displayed.

Next Item Navigation Label

Optional Use this setting to specify a custom label for the Next Item area while viewing an Item. If you do not specify anything here, the default label ("Next Item") will be displayed.

Swap Logo

Optional Turn on this setting to dynamically set the Prospect Logo on Marketing/Sales Streams that use the Banner+Logo template. To use this setting, you must also specify the query string field name where the company name can be found with the Domain/URL Field Name setting (see below).

When enabled, the current visitor’s company will be extracted the query string and used to search Clearbit for a matching logo. If a logo is found, it is automatically placed in the banner beside your own logo. If no matching logo is found, both logos are hidden from the banner.

Note

For this feature to work, you must enable the Banner+Logo template and specify a "default" Prospect Logo under the Appearance tab on any Marketing or Sales Stream where you want to use this app. The default logo will not be displayed, but this feature will not activate if no logo is set. We recommend using a generic logo for this purpose (e.g. a logo that just says "You" or similar).

We also recommend specifying a default Banner Title under the Appearance tab to be displayed in case no logo is found and the logos are hidden from the banner. If you do not specify a Banner Title, only a blank header (or Banner Image, if specified) will be shown.

Domain/URL Field Name

Required (if you have turned on the optional Swap Logo setting). Use this setting to specify the query string field name whose value should be used to search for a company logo. For example, if you set this to domainName, and the URL includes ?domainName=ACME.com, then the app will search Clearbit for “ACME.com”.

Enter only the exact name of the field, without ? or =, e.g domainName instead of ?domainName=.

Search & Replace

Optional Turn on this setting to dynamically populate placeholders in Hub UI text with values from query strings. Placeholders can be placed in virtually all editable UI text across your Hub. 

To insert a placeholder, use the format {querystring.[fieldname]}, replacing [fieldname] with the desired field name you have defined in the Search & Replace Fields and Empty Values section (see below). For example, a user with the query string ?firstName=John would see "John" anywhere you have inserted the placeholder{querystring.firstName}.

Note: Placeholders in URL and Email Fields

The app can also populate placeholders inserted into URL and email fields, such as the Link Action field on Link CTAs. Because most of these fields in Uberflip have validation, you must use a special format for placeholders in these fields to ensure that the placeholder is not rejected by the validator.

For fields that validate email addresses or URLs, do not use the standard placeholder format (as above). Instead, use the following formats:

  • Email Fields: replace@querystring.[fieldname]
  • URL Fields: replace.querystring.[fieldname]

As with the standard format, replace [fieldname] with the desired field name you have defined in the app settings. Note that the special formats are only required in fields with URL validation; URLs in normal text fields (unvalidated) can use the standard format.

When this setting is enabled, you must use the Search & Replace Fields and Empty Values settings to specify which query string field names you want to use in placeholders, as well as which default values to use if the field name is not present (or has a blank value).

Search & Replace Field and Empty Values (1st to 10th)

Required (if you have turned on the optional Search & Replace setting, at least the 1st field is required; the remainder are optional). Use these fields to specify the query string field names you want to use as placeholders. If you reference a query string field name in a placeholder, but have not specified it in one of these fields, then the placeholder will not work (will not be replaced with a value from the query string).

To use this setting, use each individual field to specify both the query string field name and a default value to be used in case the field name does not exist in the URL (or lacks a value).

Field names and their default values must be formatted as JSON objects, i.e. as a key-value pair. Use this format:

fieldName:'Default Value'

Define only one field name/value pair per setting text field, for example:

image.png

The example setting shown above would allow you to use the field names firstName, companyName, industryusecase and repName as placeholders, and would insert the appropriate value (e.g. You, Your Company, etc.) anywhere that the corresponding placeholder appears if there is no value present in the URL.

Short Form: Use 'qs' instead of 'querystring'

Optional When the Filter Items by Tags and/or Search & Replace settings are enabled, turn on this setting to enable an alternative (shorter) format for tags and placeholders. When enabled, you can use qs instead of querystring in tags and placeholders, e.g. qs.[field].[value] rather than querystring.[field].[value].

Enable this setting if you are running into character limits in fields where you are entering tags and placeholders for this app.

 

Troubleshooting

If you experience problems with this app's functionality, this may be due to corrupted data. To resolve the issue, try clearing your browser's cache (or try using the app in Incognito Mode to see if that resolves the issue).

0 out of 0 found this helpful

Comments

0 comments

Please sign in to leave a comment.