Changing styles (color, size, position, etc) of the next button for one page | XM Community
Skip to main content

Changing styles (color, size, position, etc) of the next button for one page

  • October 5, 2022
  • 3 replies
  • 737 views
H
Forum|alt.badge.img+1

Hi, I am struggling to figure out how I can change styles of the next button on selected pages. For instance, I want to have a special next button (e.g., big red circle in the middle of the screen) for some pages (not all pages).

Is this possible with custom JavaScript? I appreciate any help/suggestions.

Warm regards,
Hiro

3 replies

TomG
Level 8 ●●●●●●●●
Forum|alt.badge.img+27
  • TomG
  • Level 8 ●●●●●●●●
  • October 5, 2022

You can do it with CSS or JavaScript. JavaScript is a bit easier:
Qualtrics.SurveyEngine.addOnReady(function() {
jQuery("#Buttons").css("text-align","center");
var nb = jQuery("#NextButton");
nb.css({"background-color":"red","border-radius":"50%","height":nb.outerWidth()+"px"});
});

SuhasM
M
H
Forum|alt.badge.img+1
  • hirompet
  • Author
  • October 7, 2022

Thank you TomG !! I can now edit it a bit more now that I know the format.

SuhasM
SuhasM
Qualtrics Employee
Forum|alt.badge.img+16
  • SuhasM
  • Qualtrics Employee
  • October 10, 2022

Thank you so much TomG for creating another custom code solution! And, thank you hirompet for confirming that it works - this confirmation helps a lot of our users 🙂

Terms & ConditionsAccessibility statement