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

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

  • October 5, 2022
  • 3 replies
  • 746 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"});
});

    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
      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