These styles serve as the default for your surveys. You can override them at any time in the survey settings.

You can find the default styles under Projekteinstellungen -> Standard-Styles des Projektes

Definable Styles

Within the project styles, you can define the following settings for all surveys to be created:

• Color
  • Button Color
  • Button Text Color
  • Survey Background Color
  • Survey Text Color
• Typography
• Header & Branding
  • Survey Header
  • Custom Logo
• Avatar & Progress Bar
  • Progress Bar
• Custom CSS

Changing Styles in an Individual Survey

In the Style tab of each survey, you will see the following notice at the top:

We are using your predefined project styles. You can override these at any time with individual settings in this survey.

Additionally, you can recognize by the “Link” icon that the styles are being pulled from the predefined project styles.

However, you can still adjust any styling in the survey as usual and tailor it to the specific needs and requirements of that survey.

If you modify a style linked to the project styles, the icon changes to the disconnected icon .

Furthermore, you can reload the original styles from the project settings for that section at any time by clicking Zurücksetzen auf Projekt-Styles.

With Direct Inject, you can “find” specific elements on your page. PollHero then injects the survey at the first location that matches the selected element.

You can choose from 5 options:

• Replace: Replaces the element found via the selectors with the survey. The target element is removed from the page.
• At First: If the target element is a container with multiple elements, it will be placed in the first position within that container.
• At Last: If the target element is a container with multiple elements, it will be placed in the last position within that container.
• Before: The survey is placed directly before the start of the target element.
• After: The survey is placed directly after the end of the target element.

To use Direct Inject, enter your CSS selector into the input field above the position selection. You can then use PollHero Targeting to set which pages PollHero should search for the target element.

In the survey creation, you will find the Custom CSS feature under the “Style” tab.

Detailed documentation for all use cases will follow.

Simply click on the “Set up now” link to do so.

Clicking the link will redirect you to a page where you must confirm your password again.

Once you have confirmed your password, you can set up MFA/2FA.

If you do not have an authentication app yet, you will need to download one.

You can find the preview function for onsite surveys in the Launch tab.

If you specified a project URL when creating a project, it will be automatically entered as the URL for the preview. However, you can also change it in the survey preview.

Open the preview either via the button, copy the link into the browser bar, or scan the QR code to view your survey.

Important note regarding the preview:
For technical reasons, this only works if the PollHero project script is integrated on the website where the preview is to be viewed.

You can activate PII masking in the project settings under the Data Protection & Compliance section.

If you enable PII masking, number sequences with more than three digits, as well as email addresses (excluding the ‘Mailing’ question type), will be censored with asterisks *.

Activating the KLAR Integration in PollHero

To activate the KLAR integration, navigate to your project settings.

There, set the toggle for Activate Klar Integration to ON and you will see a button to authenticate with Google.

Click this button and grant access permissions via Google.

Adding Google Sheets to the PollHero Project

After successful authentication, a popup will appear in which you can select all Google Sheets for which you want to establish data transmission from your surveys to the sheets.

After you have selected the correct sheet, you can add additional sheets via the Weiteres Spreadsheet hinzufügen button.

These can then be assigned to the correct sheets below via the survey listing. Confirm these settings with the Zuordnung speichern button.

Selecting Which Questions/Answers Should Be Transmitted to KLAR

For post-purchase attribution, you typically use a single question (with possible follow-up questions/logic).

The question is usually something like

Where did you first hear about us?

Navigate to the corresponding question in your survey and activate the “Send to Klar” option at the bottom.

This will prepare this question with the information question_1 and answer_1 accordingly so it can be transmitted to KLAR.

If you activate this for another question, it will appear in the export as question_2 and answer_2:

Inserting a Purchase Tracking Script

To send purchases to PollHero, you must trigger a conversion script with each purchase:

window.PH_API = window.PH_API || [];
  window.PH_API.push({
    event: "purchase",
    transaction_id: "{{dlv - ecommerce.transaction_id}}",
    value: {{dlv - ecommerce.value}},
    tax: {{dlv - ecommerce.tax}},
    shipping: {{dlv - ecommerce.shipping}},
    currency: "{{dlv - ecommerce.currency}}",
    coupon: "{{dlv - ecommerce.coupon}}",
    items: {{dlv - ecommerce.items}}
  });

The example shown here uses the common Google Tag Manager variables from the dataLayer, but your individual syntax may differ!

The required values in any case are transaction_id, value, and currency.

Adding Responses with Order IDs to KLAR!

What are User Attributes?

With user attributes, you can enrich information about your survey participants and gain more insights about them in the analysis of your surveys. Additionally, user attributes enable more specific use cases, allowing surveys to be delivered even more precisely to customers.

How can user attributes be used?

The information you send to PollHero as user attributes via the Identify function can be used in targeting for survey delivery.

Furthermore, these user attributes are output in the CSV analysis as new columns (one column per user attribute with the corresponding value).

Common Use Cases

Here are some use cases for how user attributes are typically used and what kind of content they are provided with.

Important: This list is just an example; you can set completely custom user attributes that are not listed here.

Examples

A hotel chain wants to mark users in the checkout process who have not selected breakfast and later conduct an onsite survey to find out why users opted against breakfast. They use the Identify method and send, for example, breakfast: false as a custom parameter. They can then use this as a targeting option for displaying their survey at a later time.

A pet food provider wants to display surveys on the order confirmation page to customers who do not have a subscription, specifically asking if they are aware of the subscription and/or why they decided against it. For this, an attribute active_subscriber: false is set after login, which is then used in targeting for survey delivery.

Setup Code

You can easily embed the setup code via Google Tag Manager or directly in your source code to send custom attributes to PollHero.

(window.PH_API || (window.PH_API = [])).push(function() {
    var identifier = email oder user_id || null; // Ersetze email oder user_id durch einen eigenen Identifier, falls verfügbar
    window.PH1.identify(identifier, {
        // Füge hier deine benutzerdefinierten Attribute zu
        customer_type: "recurring",
        subscriber: true,
        subscription_date: '01.01.2025'
    });
});

Here is a concrete example where we set a correct identifier:

(window.PH_API || (window.PH_API = [])).push(function() {
    var identifier = 'info@poll-hero.com' || null;
    window.PH1.identify(identifier, {
        customer_type: "new",
        subscriber: true,
        subscription_date: '01.01.2025'
    });
});

Background color

This setting does NOT change the background color of your survey, but the color of the page on which the stand-alone survey is displayed.

Example page:

Background image

You can also choose to display a background image. Here you can define the position of the image on the page, whether an image overlay is shown, or whether the image is displayed blurred.

An example of the settings options shown above:

Example of a left-aligned image without blur:

Example of a right-aligned image with 25% blur:

You can also specify whether your image should have an overlay. For the example with an overlay, the same image is selected, no blur is set, and a black overlay with 35% transparency is configured.

You can set the transparency in the “A” field or via the slider below the color selection.

You can find more information about cookies, localStorage, and retention periods here.