adding a full size image (banner) to the first page of the survey | Experience Community
Skip to main content
Solved

adding a full size image (banner) to the first page of the survey

  • April 21, 2022
  • 2 replies
  • 1432 views
S
Forum|alt.badge.img+1

Hi,

Can anyone please advise me on how to add a full size image - end to end (banner) just to the first page of my survey?
Many thanks🙂

Best answer by Tom_1842

Hi there, the Text/Graphic solution will work great but it will technically be a part of the survey and might be limited by the width of the question containers. You can also approach this by going after the Logo space directly via some code.
If you have a Logo already in place for your survey, you can replace the URL of the logo for a single page by using jQuery. You can also use jQuery to adjust the styling of the new image. Place the below code in the OnLoad section of a question on the first page via JavaScript:
jQuery('#Logo img').attr('src', 'https://www.pngmart.com/files/9/Text-Banner-PNG-Transparent-Image.png');

jQuery('#Logo img').css({"height":"auto", "width":"480px"});

2 replies

jmborzick
QPN Level 5 ●●●●●
Forum|alt.badge.img+41
  • jmborzick
  • QPN Level 5 ●●●●●
  • April 25, 2022

Simin There is a question type "Text/Graphic." If you select that and then change content type to "Graphic" you should be able to accomplish your goal.

Tom_1842
Level 8 ●●●●●●●●
Forum|alt.badge.img+28
  • Tom_1842
  • Level 8 ●●●●●●●●
  • Answer
  • April 25, 2022

Hi there, the Text/Graphic solution will work great but it will technically be a part of the survey and might be limited by the width of the question containers. You can also approach this by going after the Logo space directly via some code.
If you have a Logo already in place for your survey, you can replace the URL of the logo for a single page by using jQuery. You can also use jQuery to adjust the styling of the new image. Place the below code in the OnLoad section of a question on the first page via JavaScript:
jQuery('#Logo img').attr('src', 'https://www.pngmart.com/files/9/Text-Banner-PNG-Transparent-Image.png');

jQuery('#Logo img').css({"height":"auto", "width":"480px"});

    Terms & ConditionsAccessibility statement