Customize css for specific page

Hi @nicewp123,

Could you please explain what you meant by “example apply last row distance to page 2”? Not sure I quite get which exact row you are referring to.

There isn’t any out-of-the-box setting but you could use Custom CSS to apply on any steps or fields.

If you could provide further information ie screenshots or URL to the form then we could better assist regarding this.

Looking forward to your response.

Kind Regards,

Nithin

@wpmudevsupport11, thanks for reply!

Imagine multipage form (you click Next to go to next page). On one of the pages, I want to reduce distance between Previous-Next button and my content (because that space is blank). So I want to apply this setting only for this page (and only for this) and I was wondering whether that’s possible.

Hi @nicewp123

I hope you are doing well.

You could do something like:

.forminator-pagination-footer .forminator-button{
    flex: 1 !important;
}

.forminator-pagination-footer{
    gap: 10px;
}

https://monosnap.com/file/gzjyqjPJb27tpLxlYfcvSv63FhO1Ky

Best Regards
Patrick Freitas

@wpmudevsupport12, Thanks for your help! With “gap:10px”, I can control gap between button and form, right? Can I control it for specific page or for all at the same time only?

Maybe to be a bit more specific, my problem is that for my form structure I use blank HTML blocks. For example, I want to have a form with two columns. In column 1, I want one big (height) element. In column 2, I want two smaller elements. To achieve this, I use blank block in column 1 (to have two like in column 1), which allows me to do it, but creates empty distance between field and Submit button. Here is schematics https://easyupload.io/dtzknp . How to remove this blankspace?

Extra question: When I use Forminator form on my website, is attribution mandatory? If so, is it mandatory to be on same page as form or can I add it on separate page i.e. Attributions? (which would be more convenient for me).

Hi @nicewp123

Based on your data and screenshot I guess 1 column will use textarea. We had similar request in past and using empty HTML field liek that will make things more complex. There is another solution which is less complex, which I will mention leter.

Let’s focus on general pagination as global and separate control via CSS.

In the first place point your form via ID, which will narrow to that form and not affect other forms on site. So your CSS will start from “#forminator-module-121” where 121 is your form ID.

Later on you can narrow all pagination pages by “.forminator-pagination” or each separate pagination page by ID “#forminator-custom-form-121–page-0” , “#forminator-custom-form-121–page-1” , etc.

In the end you can control things like:

Control all pagination pages
#forminator-module-121 .forminator-pagination {}

or separate pagination pages
#forminator-module-121 #forminator-custom-form-121--page-1 {}

Now, you cannot mix that with “.forminator-pagination-footer” as footer next previous buttons are outside each page in general and footer will be always after each page, with only small gap/space.

The main issue, as mentioned above is your HTML fields which are in first column and make that gap. With that and different number of fields on each page it will be not possible to control pagination buttons on each page as those are in separata bottom div, below each page.

Solution:
add to your HTML field custom class, like “.hidethis” and add CSS
.hidethis {display:none;}
Note, this will hide the field div from the 1st column, and the field from the 2nd column will be full width then. It will be good if you could share your form or link to the page where the form is located and we could adjust CSS for you.

Kind Regards,
Kris

@wpmudevsupport13, Excellent, thank you!

Thanks to your instructions on page control, I’ve achieved what I wanted with the following code:

forminator-module-x #forminator-custom-form-x–page-0 .forminator-pagination–content {margin:0 0 -10% 0 ;}

Extra quick question: When I use Forminator form on my website, is attribution mandatory? If so, is it mandatory to be on same page as form or can I add it on separate page i.e. Attributions (which is in footer of website)?

HI @nicewp123

Extra quick question: When I use Forminator form on my website, is attribution mandatory? If so, is it mandatory to be on same page as form or can I add it on separate page i.e. Attributions (which is in footer of website)?

No, it’s not required. Please feel free to “just use” it and that’s it ??

Have a great day!
Adam

@wpmudev-support8, awesome, thanks! Have a great day too!