{"id":11460,"date":"2022-05-25T09:26:37","date_gmt":"2022-05-25T09:26:37","guid":{"rendered":"https:\/\/www.mainbrainer.com\/hc\/knowledge-base\/survey-social-widget\/"},"modified":"2022-11-23T12:30:36","modified_gmt":"2022-11-23T12:30:36","slug":"survey-social-widget","status":"publish","type":"ht_kb","link":"https:\/\/www.mainbrainer.com\/hc\/en_GB\/survey\/creator\/social\/","title":{"rendered":"Survey Social Widget"},"content":{"rendered":"
\n

The Social <\/strong>widget helps you add social media profile links to your survey. Using this widget, you can add links to a Facebook page, Instagram profile, Twitter handle, Youtube channel, and LinkedIn profiles.<\/p>\n

How to Use a Social Widget in a Survey Creator?<\/h2>\n

Step 1 \u2013 Navigate to the Survey Creator<\/h3>\n

Open the Survey Creator to start creating your survey<\/a>.<\/p>\n

<\/div>\n

\"Survey<\/p>\n

Step 2 \u2013 Add a Social widget to your survey<\/h3>\n

To add links to your social media profiles to your survey, drag and drop the Social<\/strong> widget to the work area.<\/p>\n

<\/div>\n

\"Survey<\/p>\n

Step 3 \u2013 Select the social media icons that you wish to add to your survey.<\/h3>\n

Once you drop the widget in the work area, you\u2019ll see the widget settings on the right side.<\/p>\n

\"Survey<\/p>\n

You\u2019ll notice that all social media platforms are displayed as a list.<\/p>\n

As highlighted in the above screenshot, against each listing, there are two options:<\/p>\n

    \n
  • A Delete <\/strong>button – Use it to delete the irrelevant social media icons from your survey.<\/li>\n
  • An Expand<\/strong> button – For the icons that you wish to retain, click the expand button to enter the subsequent details.<\/li>\n<\/ul>\n

    Let’s have a look at the expanded settings for the social media icons:<\/strong><\/p>\n

    3.1 Settings for Facebook, Twitter, and LinkedIn<\/strong><\/h4>\n

    Similar settings are available for these three media.<\/p>\n

    <\/div>\n

    \"Survey<\/p>\n

    Use these settings to specify if:<\/strong><\/p>\n

      \n
    • you would like to redirect the clicks to your business’s Facebook page URL (the one specified under your account’s Integrations), or<\/li>\n
    • you would like to redirect the clicks to some other URL.<\/li>\n<\/ul>\n

      3.2 Settings for Instagram and Youtube<\/strong><\/h4>\n

      Type in the URL to which you would like to redirect the clicks.<\/p>\n

      \"Survey<\/p>\n

      Step 4 – Style your Social Media Icons<\/h3>\n

      By default, we display the social media icons with their original branding styles, but you can customize the appearance of icons if you wish to.<\/p>\n

      \"Survey<\/p>\n

      To customize the look and feel of the icons, click the Style tab.
      \nThe different design options available are:<\/p>\n

      4.1 Social Font settings and Background color<\/strong><\/h4>\n

      \"Survey<\/p>\n

        \n
      • Social Background Color <\/strong>to change the color of the widget background. You can also choose to make the widget background transparent.<\/li>\n
      • To customize the icons:\n
          \n
        1. Select the icon that you want to customize by using the dropdown \u2013 Select Social Icon for Color Change.<\/strong><\/strong><\/li>\n
        2. Subsequently, select the colors you wish to use for the icon background, and the icon itself using the dropdowns Selected Icon Background Color<\/strong> and Selected Icon Color<\/strong>, respectively.<\/li>\n
        3. Select the checkbox Selected Background and Icon Color Apply to All <\/strong>if you wish to apply the selected color scheme to all the social icons.<\/li>\n
        4. Use the Rounded Corners<\/strong> sizing bar to add rounded corners to the icons.<\/li>\n<\/ol>\n<\/li>\n<\/ul>\n

          4.2 Social Setting<\/strong><\/h4>\n

          \"Survey<\/p>\n

          Customize the icons using the following settings:<\/p>\n

            \n
          • Orientation <\/strong>to select whether you would like to display the icons vertically (one below the other), or horizontally (side by side)<\/li>\n
          • Social <\/strong>Position <\/strong>to choose the alignment of the icons within the widget boundary.<\/li>\n
          • Horizontal Icon Gap<\/strong> to select the distance between the icons.<\/li>\n
          • Vertical Icon Gap<\/strong> to adjust the distance between the icon and widget boundaries.<\/li>\n<\/ul>\n

            Click Save <\/strong>and that\u2019s it!<\/p>\n<\/div>\n