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 Items on the main Stream page only. While viewing an Item, the Next/Previous Item carousel will remain unfiltered (will show Items not matching the specified tags). If needed, you can personalize the carousel using Uberflip's Content Recommendations feature.

Swap Logo

Optional Turn on this setting to dynamically set the Prospect Logo on Marketing/Sales Streams that use the Banner+Logo template. When enabled, the current visitor’s company will be extracted from their Demandbase data and used to search Clearbit for a matching logo. If a logo is found, it is placed in the banner. If no matching logo is found, the default logo from the Stream’s settings is displayed instead.

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).

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.

 

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.