How to make the Submit button larger and more obvious? | XM Community
Question

How to make the Submit button larger and more obvious?

  • 2 August 2023
  • 4 replies
  • 159 views
N
Rank
Userlevel 1
Badge +2

We have created a survey on Qualtrics. We have noticed that the Submit button at the end of the survey is ssmall, grey and inconscpicuous. Is there a way for us to make the Submit button larger and more obvious?

I see that a similar question has been asked before and someone recommended the following, but I cannot see where and how I can paste this code:

Paste the code at the very last question JS, change the css property values as required:
jQuery("#NextButton").attr("value","Submit").attr("title","Submit").css({
"background": "black",
  "width": "300px",
  "height": "60px",
"font-size": "35px",
  "color": "wheat"});
 

Is there another way to do this? 

4 replies

ManfredBM
Rank
Userlevel 5
Badge +32

Hi @neilpw ,

copy the following code in the question text of the last question of your survey (in HTML view):

 

<script>
jQuery("#NextButton").attr("value","Submit").attr("title","Submit").css({
"background": "black",
  "width": "300px",
  "height": "60px",
"font-size": "35px",
  "color": "wheat"});
</script>

This is the last question text?

NiC
Rank
Userlevel 7
Badge +27

Hi @neilpw ,

 

As ManfredBM replied, you could  use the code in the last question.

 

The other option might be to use the Modern Layout in the Qualtrics Look and Feel > Layout section  

but beware this will change the next button size on all pages and also the look of all the questions as well.

 

XM Engineer | Zill Consulting
N
Rank
Userlevel 1
Badge +2

Thank you Manfred BM and NiC, 

When I try to add the script below (from ManfredM) in HTML view, I get an error message: "JavaScript is not allowed in the question text". Please can you advise?

<script>
jQuery("#NextButton").attr("value","Submit").attr("title","Submit").css({
"background": "black",
  "width": "300px",
  "height": "60px",
"font-size": "35px",
  "color": "wheat"});
</script>
 

Thanks, Neil

NiC
Rank
Userlevel 7
Badge +27

You need to remove the script html tags

And then you can add that code in OnReady or OnLoad function

As shown here https://www.qualtrics.com/support/survey-platform/survey-module/question-options/add-javascript/#AccessingTheJavaScriptEditor

 

 

XM Engineer | Zill Consulting

Leave a Reply


Terms & Conditions