Hide the ribbon on a Nintex form

Hide the ribbon on a Nintex form

I needed to hide the ribbon on a specific Nintex form.  Yes, the client had heard my arguments about why you should keep the ribbon and decided to remove the ribbon regardless. Removing the ribbon from that one form did not turn out to be quite as straight-forward as I expected.

The normal SharePoint CSS code to hide the ribbon is:

#s4-ribbonrow { display: none; }

This will completely hide the ribbon and the space it takes up. Perfect, right?

However, if you add this code to the custom CSS of a Nintex form, you lose the ribbon in the Form Editor. It becomes very difficult to save your changes:

No ribbon in Nintex Forms Designer

As you have not yet saved your changes, you can just refresh the page to remove the new CSS as well as any other changes you may have made.

To correctly hide the ribbon on a form and only affect the form, you need to add the following JavaScript to the form settings:

NWF$("#s4-ribbonrow").hide();

Once you have done that, the form will not have a ribbon but everything else will.

In this case, the form will become the master form for this project. Any forms created from this master form template will automatically have this JavaScript included.

Resources: Nintex Forms – Who looks at the mantle? (Hide the ribbon)

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s