Paperform logo
ProductTemplatesPricingResources
ProductTemplatesPricingResources
Sign inTry Free

Can I change the style of my pagination buttons?

Help Making Forms Using the Editor Appearance & Theming

Appearance & Theming

How do I add or remove the 'X questions to go' message on the submit button?Can I add a progress bar to my form? Can I change or edit the color of the placeholder text?Can I change the font size of the multiple-choice question answers?Can I change the font size beyond just H1 and H2?Can I change the style of my pagination buttons?Can I change the transparency on my background video?Can I change transparency of the background image?Can I create my own theme and use it across all my forms?Can I edit my images?Can I fully customize the language and wording of forms, including the UI & buttons?Can I customize typography?Can I update the answer text font color? Can I remove the white background from my questions?Can I set the question background to transparent?Can I style the submit button on guided mode?Custom CSS Class NamesHow can I create auto-advance multi-step forms?Does Paperform support non-English character translations and RTL languages for forms?How big should my form icon be?How can I change color for the question fields in my form?How can I change the background color?How can I change the Active Color?How can I change the colors on my form?How do I add images to products?How do I add placeholder or help text to guide my customers?How do I change Address field wording to reflect how my country writes addresses?How do I change the fonts in my form?How do I put my questions side by side instead of one at a time?How do I remove the asterisk from required questions?How do I select a translation for a specific form?How do I hide the total price on the submit and next page buttons?How do I upload my Adobe Creative Cloud images to my form?How do I use my Adobe Creative Cloud colours on my form?How do I add a background image to my form?Can I add numbers to the page buttons?How do I add text to the pagination buttons?How do I change the submit button wording and styling?How do I add images to a form?Why are some font characters not displaying correctly on my form?What are Color 1, 2, 3, 4 in the Palette section of Theme?What can I do with custom CSS?Which fonts does Paperform support?What are the proper size and dimensions for the background image of a form?Can I align images or have multiple images on one line?Guided Mode OverviewTheme Overview

You can change the style of your form's pagination buttons within Theme. You can access Theme via the small droplet icon top-right of your form editor.

A screenshot of the top-right of the form editor interface, showing some text that says "Saved", a droplet icon (Theme), and an eye icon (View Live Form)

How to change pagination button styles

Navigate to Theme → UI Elements → Pagination Buttons to update the style of your Pagination buttons.

The styling options available for your pagination buttons differ between Standard and Guided Mode. To check which mode is enabled on your form, navigate to Theme - the selection will be listed under the heading "Form Experience".

Standard Mode

We offer a variety of pagination button styles for Standard Mode - all of which can be found below:

  • Buttons Only - This option displays a simple arrow button to move between pages.

    A button with curved edges containing an arrow pointing to the right.

  • Buttons Only (with Total Price) - This option is similar to Buttons Only, except the total price of your form will be displayed alongside the arrow.

    A button with curved edges containing an arrow pointing to the right, alongside a label that reads "$10.00" within the same button.

    You can enable this button style with the option "Shows total price in the next page button".

    A toggle option titled "Shows total price in the next page button"

  • Numbers - This option displays a row of numbers between standard arrow pagination buttons to navigate between pages.

    A row of four buttons with curved ends. The two buttons at either end have arrows pointing left and right relative to their position in the row, and the two buttons remaining in the middle have the labels "1" and "2".

  • Progress Bar - This option will display a progress bar between the two standard pagination buttons on your form.

    A row of two buttons, between them is a two-tone bar indicating the respondent's progress in completing the form. The two buttons at the end contain left and right-pointing arrows according to their relative position on the row.

Guided Mode

If your form has Guided Mode enabled, pagination styling is limited to three options. These options are listed below:

  • Include a back button - This will allow a respondent to move back to previous pages.

  • Include progress bar - This will include a progress bar at the top of the screen.

  • Include page numbers - This will display the number of the current page, and how many are left.

Custom CSS

If you have access to an Agency plan account, you have the option to use Custom CSS on your forms. Custom CSS allows you to completely customize the look and feel of your forms, which can be useful for creating pagination buttons that match your specific branding requirements.

Related Articles

Can I add a progress bar to my form?
You can add a progress bar in Theme → UI Elements → Pagination Buttons → Pagination Style → and choose Progress Bar
How do I hide the total price on the submit and next page buttons?
Total price will be displayed by default in the submit and next page buttons. Either or both can be toggled off under Theme → UI Elements.
Can I fully customize the language and wording of forms, including the UI & buttons?
You can create, edit, and manage all of your translations under Account Settings → Translations. You can then apply these to forms from the Theme Settings.
Can I style the submit button on guided mode?
When using Guided Mode, you can only change the color of the Submit Button by changing the Active Color under Theme. There are a number of other configuration options available under Theme → UI Elements → Submit Button.