Building customized/branded forms in an Office 365 with Nintex Forms is a great experience.  It's even better now that there is support for our Nintex Mobile app.  If you haven't seen the great post by my colleague Dan Stoll, take a look here: Taking Office 365 for a Spin with Nintex Mobile.

When it comes to browser based forms, sometimes, you don't want to have your user go into a List and then click on New Item just to fill in a form.  Think of a Leave Request or an Expense Claim form.  Wouldn't it be easier for your employees to go to the HR site or the Finance site and simply have a form there to fill in?

With Nintex Forms for Office 365, there is a web part that comes with it that will let you do just that.

To get the result we want, we first start off with a simple SharePoint List.  As you can see, there's nothing to it but a Title field.  Of course you can make it as complex as you need it.

To this list, we need to customize a Nintex Form.  Click on the Nintex Forms button on the ribbon and begin the customizations that you need, if any.

I won't be going into the form design here.  This is simply for show.

Once the form has been finished and published, we can now move on to the interesting part of configuring a SharePoint page to display that form.

The web part that comes with Nintex Forms for Office 365 can be places on any SharePoint page.  You can add a new page and insert a number of these web parts if you want it to be a central place for users to fill in forms.  Or, you can use an existing page like the front page of a site and add the web part there.

When you are on a SharePoint page, in the ribbon, click on the Page tab then the Edit drop down and select Edit.

Once that is done, you are in Edit mode for the SharePoint Page.  Click on the Insert tab and then the Web Part button on the ribbon.

Depending on the name of your lists, you may need to scroll across to find the Nintex List Forms Online web part.

Then click on the Add button to add it to your page.

Web Part Configuration

Now that the web part is on the page, we need to configure it to show the appropriate form.  You will find at the top of the web part, there is a drop down where you then select Edit Web Part.

On the right side of the page, you'll see the editable settings.  This is the same for all web parts, but if you don't see it, you may need to scroll to the right.

In order to configure this, there are few important settings.  The Form Mode is whether you want to display a New form or edit form or even a Display form.  If you select Edit or Display, you'll need to provide an Item ID.

In our case, since we are only interested in a New Form, we need the List Name, a Redirect URL and a Site URL.

The rest of this work is this :

Our form is now embedded in our front page and our uses can go to that page and fill in there expense form quite easily without having to find where the Expense Claim list is.

A HUGE Thank You goes to Daniel Kinal, the Product Manager for Nintex Forms, who pointed me in the right direction for the web part.  His knowledge of Nintex Forms, both on-premise and in the cloud is amazing!!