Creating a Website Creative

Updated 

Website Distribution enables companies to implement surveys through a variety of creative formats. These formats include Pop-up, Positioned Pop-up, and Feedback Button. Each type is customizable, offering the flexibility to gather your feedback in diverse ways while preserving the interactivity of the website. You can adjust the design, look, and functionality of these formats to meet the requirements of their site and target audience, thereby maximizing survey participation.

The following types of creative content are supported for website distribution:

  • Pop-up: The survey pop-up appears at the center of the webpage as an overlay.

  • Positioned pop-up: The survey pop-up can be placed at a custom position on the webpage, keeping the rest of the website interactive.

  • Feedback button: A button is displayed on the webpage, and the survey opens when the button is clicked.

Business Use Cases

  • Improving User Engagement: It allows businesses to present surveys using various display formats, such as Pop-up, Positioned Pop-up, and Feedback Button, to boost user interaction while maintaining a seamless website experience.

  • Customizable Survey Display: By offering completely customizable features, companies can create surveys that match their website's look and branding, thereby improving both response rates and the quality of feedback.

Website Distribution offers flexible display options with multiple creative formats that capture feedback without disrupting the user experience. With full customization control, businesses can tailor each format’s appearance, position, and behavior to align with their website’s design and user journey. Additionally, the system is optimized for different devices, offering mobile overrides and custom mobile views to ensure surveys are responsive and effective across all screen sizes.

Prerequisites

In order to access the Website Distribution, you must have the following View and Edit Distribution permissions at the Survey Level.

Setting up a Pop-Up Creative

  1. Navigate to Creative Library in the left pane and select + Creative and select Website from the drop-down.

  2. Navigate to the "Choose Template" page and pick a template from the three options provided and click Next.

    1. Popup: Forms that are presented immediately, covering the entire screen.

    2. Positioned Popup: Forms designed to appear at a user-specified location on the screen.

    3. Feedback Button: Gain insights from posts and mentions pertaining to the Executive and significant competitors.

  3. In the Add Creative page fill in the details:

    1. Creative Name: Enter creative name.

    2. Description: Add a meaningful description to the creative.

    3. Direct Display: Select the 'Direct Display' option. When enabled, this option will present the survey content directly on the website instead of the creative content.

    4. Access Creative Permissions to manage user access rights, allowing you to assign editing and viewing privileges and click Next.

  4. Navigate to Creative Content page and fill in the details:

    1. Navigate to Creative Content section:

      1. Logo: You can upload a logo and are also given the choice to either modify or remove it.

      2. Headline: Provide a relevant title for this content.

      3. Content Description: Provide a relevant description for the content.

      4. Go to Target Button section and add a relevant Primary Button text and add a Secondary Button text by clicking + Secondary Button.

    2. Navigate to Styling section:

      1. Logo: Go to Logo section and adjust the size and vertical padding.

      2. Overlay: You can adjust the colour and opacity to control the appearance of the background layer.

      3. Popup Display: Style the pop-up display by setting background and border colors, and adjusting the padding.

        1. Background: Style the pop-up display by setting background colours.

        2. Border: Style the pop-up display by by selecting the border colors.

        3. Sides: Slide to adjust the sides.

        4. Vertical Padding: You can adjust the vertical padding.

        5. Opacity: Modify the transparency of the pop-up window.

        6. Radius: Modify the border radius of the display.

        7. Shadow Colour: Incorporate shadow effects.

        8. Shadow X Offset: Incorporate shadow effects around the border.

        9. Shadow Y Offset: Incorporate shadow effects around the border.

        10. Shadow Blurr Radius: Helps soften or blur the shadow radius for a smoother, more subtle visual effect.

        11. Shadow Spread Radius: Slide to increase or decrease the shadow of the radius.

        12. Header Text: Customize headline fonts, including size, weight, and style

        13. Description Text: Customize headline fonts, including size, weight, and style.

        14. Footer: The footer is the bottom section of the creative, where the action buttons are located.

          1. Enable sticky footer: This option keeps the footer sticky when the description text is long.

          2. Top Padding: You can slide to adust the padding.

        15. Mobile Overrides: You can switch to mobile view to observe the changes. Review the mobile overrides to ensure the design adjusts correctly for mobile devices.

          1. Overlay:

            1. Vertical Padding: You can adjust the padding by sliding from left to right.

      4. To add or modify translations, please proceed to the Translation section and complete all required fields within the creative content area.

    3. Click Create.

Note:

  • You must select creative while creating a website distribution.

  • You should be able to add and manage translations for creatives across all key touchpoints, while creating a new creative, in the Creative Library, and during distribution setup. You can view existing survey languages, update translatable fields such as the image (inherited by default), title, description, and CTA, and set up RTL languages. You can auto‑translate using base‑language content, preview each translated version, and ensure that all required base‑creative fields are also completed in every translated variant.

Preview

  1. Click full page preview to view the creative on the full page.


Best Practices

  • Check Mobile Compatibility: Always check and confirm that the survey functions properly on both desktop and mobile devices to guarantee the best user experience.

  • Use Direct Display for Immediate Interaction: Think about implementing direct display for quick feedback gathering without the need for extra clicks while also ensuring a good user experience. You may include it inline in the earlier part of the “How It Works” section.