Power Pages - Design & Build

Adding styles and formatting to power pages multistep forms

(1) Share

Report

Posted on by Ashish10Pal

I am trying to give give good UI look and feel to multistep form but i don't know where we can format CSS or add this.

Categories:

General

I have the same question (1)

All responses (3)

Answers (0)

Suggested answer

Fubar 8,122 Super User 2025 Season 2 on at

Like (0)

Report
Adding styles and formatting to power pages multistep forms

It really depends on what it is that you want to change:

General styling is available in the Designer

You can add a custom CSS file to add your own classes or override existing ones (note: if wanting to override existing CSS you need to add the !important keyword at the end of each css entry) - see the link below

The Web Page your form is on has an area for CSS - available from the Power Pages Management app or the Code editor in the designer.

Some styling can be applied against the Steps by adding classes in the areas provided (e.g. previous/next buttons) - available from the Power Pages Management app.

Some styling can also be applied against elements on each step using Metadata records against the step (e.g. attributes on the form step can have a custom CSS class added).

You can also dynamically apply style using JavaScript/JQuery to add classes or change inline

https://learn.microsoft.com/en-us/power-pages/getting-started/tutorial-add-custom-style

Was this reply helpful? Yes No
Suggested answer

Harry Leach 2 on at

Like (0)

Report

Adding styles and formatting to power pages multistep forms

Hi @Ashish10Pal,

You cannot edit a form as a component in Power Pages natively, nor can you simply add CSS as @EmadBeshai suggests.

This guide explains it all: Build custom HTML forms in Power Pages: Part 1 – The ReadyXRM Blog by Nick Doelman

The guide explains this:

The only way to create a form without the constraints Microsoft has put in place is by creating a custom web template (Web templates | Microsoft Learn) and adding an HTML form using the logical names of the Dataverse table column fields to capture data.

From there, configure the Power Pages site settings to allow WebAPI to create new records in Dataverse. You will also need to make sure the correct table permissions are also configured.

From here, you need to use the Power Pages WebAPI so that it will take the data added to the form and create a new record in Dataverse when the form submit action is called. Use this extension to generate the script/code: Dataverse REST Builder - Microsoft Edge Addons

From there, you can add any CSS you want.

Create the page template and use it to create a web page with the appropriate table permissions to allow users to create new records.

Hope this helps. I was stuck on this for hours, and only in the past half an hour have I managed to make it work.

1 people found this reply helpful.

Was this reply helpful? Yes No
EmadBeshai 806 Moderator on at

Like (1)

Report

Re: Adding styles and formatting to power pages multistep forms

Hi @Ashish10Pal ,

From https://make.powerpages.microsoft.com/ you can edit your website

Select your Theme and click on the 3 dots(...) for that Theme and select manage CSS

You will find the custom CSS file and you can upload more CSS files to your website

If this post helps you with your problem, please mark this answer as Accepted Solution.

If you like my response, please give it a Thumbs Up.

Was this reply helpful? Yes No